Mariestads

project | Mariestads

Contracted with a clear mission. Improve the performance of www.mariestads.se.

The existing site was built using Wordpress. So our first decision was choosing whether to improve the Wordpress implementation or to choose a different path. From experience we know that using a server to render a site will have some performance loss. So in order to user Wordpress there would have to be some demands from the site that a static generator could not meet. The site itself needed no backend. The only functionality of the site except from rendering the view was to collect email addresses to Mariestads MailChimp list. That could be solved using MailChimps Form Builder. So the last remaining usage of a back end would be the CMS part.

Familiarity vs performance

There are of course CMS solutions that can be used in combination with static site generators. On the other hand Wordpress CMS was already familiar to the client. So on one side of the balance we have the convenience of using an already familiar CMS but the performance loss of a back end and on the other side we have the benefits of speed that a static site would give but also the need for the client to learn a new CMS.

Conclusion

Since the structure of the site is not very complex with only a handfull of different components to update we choose to build the site leaving the back end behind and going static.

Our choice her is that of speed. Both from our own experience as developers and the data we have studied suggests that speed plays a huge role in user experience. In this case the improvement was remarkable. Usually we measure in 100ms or tens of ms in improvement. Here we could save 3 seconds in load time.

Numbers

We shortened the full download of HTML from 3042ms to 6ms and the time to first byte from 1851ms to 5ms.

Technical description

Custom static website built using webpack. Since the page is heavy on images we used Webpacks image-loader to minify the files.