I'm learning about the templating engine Jade bundled with Express. As I understand, Jade allows for server-side rendering. Isn't that suboptimal for two reasons:
1) The server has to compute more to render the templates. The work can be pushed client-side.
2) Once a template or partial has been rendered, and the data needs updating, it just sends JSON to the client, instead of resending fully-fledged HTML, which is a drain on bandwidth.
Are these real problems with server-side template rendering?
Some server-side rendering advantages include: A server-side rendered application enables pages to load faster, improving the user experience. When rendering server-side, search engines can easily index and crawl content because the content can be rendered before the page is loaded, which is ideal for SEO.
Server-side rendering improves site speed and results in better Core Web Vitals scores. However, sometimes it can be difficult to implement and might also increase First Input Delay.
Server-side rendering allows developers to pre-populate a web page with custom user data directly on the server. It is generally faster to make all the requests within a server than making extra browser-to-server round-trips for them. This is what developers used to do before client-side rendering.
Server-side rendering is an excellent option for rendering web pages to increase the initial page load speed, improve SEO and provide a better user experience.
I think it really depends on the type of application you're writing. If you have a page that mostly serves individual pages, and kind of fits into your typical CRUD/MVC mold, it may not be an issue. However, if you're writing something dynamic with a ton of ajax, it is a problem :-)
I feel your pain - I've been bitten by this a few times in various stacks. I've ended up just doing all of my list bindings with async calls in the browser that execute after the core page loads. It kind of stinks, because you like that first request to come with a page of pre-bound list data, but subsequent page to be driven by ajax calls. I just don't want to write template stuff once for the server and once for the client.
I don't /think/ Jade supports that kind of client side binding. The good news is that there are a few popular templating languages that work both on the server, and in the browser. The two I know of are:
I haven't seen anyone using plates with express, as it belongs to the flatironjs project which kind of has it's own growing framework going on. There are tons of examples out there of using mustache and ejs with express:
On a side note, here's a list of templating packages for node on Joyent's site:
https://github.com/joyent/node/wiki/modules#wiki-templating
My suggestion is to start with EJS - it's a little more down to earth with it's non-HAML-esque syntax, supports client and server binding, and seems to be well accepted in the express stack.
Happy Coding!
There is an other important point. Depending on your website aim. You may have to pay attention to SEO or not.
In simple word, the content that is generating from the server is indexing by search engine. Others not. Because search engine crawlers don't take care about client-side content.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With