Server-side rendering is the most common method for displaying information onto the screen. It works by converting HTML files in the server into usable information for the browser. Whenever you visit a website, your browser makes a request to the server that contains the contents of the website.
HTML over the wire
Progressive HTML Rendering
Progressive HTML rendering is a technique to improve the performance of websites that involves sending an HTTP response for an HTML page in multiple flushes. This improves both the actual load time, as well as the perceived load time.
Server side Routing
Client-side routing sound more complicated, because it is. Server-side routing has been the standard for a long time, search engines are optimised for webpages that come from the server.
Optional Build / Compilation
Progressive enhancement is a design and development strategy for websites that starts with a simple base and adds step-by-step improvements for more powerful systems. It allows developers to design websites that take full advantage of the capabilities of modern browsers and devices.
Collapse as many unnecessary conceptual models as possible. Eliminates as much needless abstraction as you can swing a hammer at. It’s a big fat no to distributing your system lest it truly prevents you from doing what really needs to be done.
Make use of CDN
Content delivery networks (CDN’s) provide a great solution to this, serving assets such as image files from a network of data centres around the world. This means that in most cases, the largest files will be loaded from the CDN location in the users own region, reducing the distance that data is moving each time a page is loaded.
On most websites, images are the single largest contributors to page weight. The more images you use and the larger those image files, the more data needs to be transferred and the more energy is used.
As with images, ask yourself if videos are really necessary. If they are, see if you can reduce the amount of video streamed by removing auto-play from videos and by keeping video content short.
Choose fonts carefully
Web fonts can enhance the visual appeal of websites but can add significant file weight to the websites on which they are used.
Write Clean code
Write clean code
Images are one of the largest contributors to the amount of data transferred on most web pages. In addition to the decisions made by designers and content creators on the use of images, there are technical decisions that significantly affect the file size of images displayed on a page.
There are technical strategies that can be used to minimise the size of fonts on websites and we have seen that even with custom fonts, it can result in file size reductions of up to 97%.
Use Server Caching
Caching technologies pre-generate static versions of each page so that the server overhead can be significantly reduced for most visitors. This significantly reduces server energy consumption and makes a big difference to page load times.