Website loading times become an increasingly important problem to solve in the modern internet age. According to KissMetrics blog, "...Page loading time is obviously an important part of any website’s user experience. ...". Moreover, major search engines add page loading time as part of the internal algorithm when presenting search results to the internet audience. The SearchEngineJournal outlines the importance of fast loading websites, where even half-a-second improvement in page loading speed changes the search results display presented by Google.
Recently we optimised a Managed Secure hosting customer website tilkah.com.au. We managed to reduce the page loading times from over 40 seconds per page down to under 4 seconds per page. It is important to note that the whole optimisation work was completed on the web server end, without changing the application itself.
The problem - slow website
Tilkah is an Australia wide retailer for high-quality luxe leather and jewellery pieces. The online store tilkah.com.au is built in WordPress and has several hundreds of products sold online. The challenge we faced was the lack of content optimisation. The website was lacking CSS/JS files combining, minification and compression. Product images were too big in size and page generation was very slow, resulting in customer complaints about slow checkout process.
Unoptimised static files were causing a large amount of data to download for a single web page. Every page had a large number of request that browser had to make to load all content.
The solution - content resampling, compression, minification
We began our work by moving the customer to our optimised and fine-tuned CentOS 7 cloud server.The website was placed behind Nginx caching proxy with HTTP/2 protocol support and SSL termination. Browsers with HTTP/2 support load the whole page content in just one multiplexed connection, which appeared to work faster than using CDN.
We then continued by adding mod_pagespeed support to the Apache web server, enabling Content Optimiser and Accelerator technology. As the outcome, we saw an immediate reduction of page size (reduction of over 3x times) and loading times. Content Optimiser and Accelerator works by applying content resampling and optimisation best practices, without the need to change anything on the application side. For tilkah, we activated a range of filters to achieve following outcomes:
- Combine together, compress and minify JavaScript and CSS files. Even though combining the files does not change speed noticeably over an HTTP/2-enabled website, some browsers (IE < 10) that fallback to standard HTTP-1.1 SSL connection would benefit from the lesser number of requests.
- Load JS asynchronously, using Pagespeed's 'defer JS' filter,
- Resample and resize images to reduce their size. We set to convert all images to JPEG, and to WEBP (for browsers that support it). The average page size was reduced by the factor of 3x,
- Convert images into progressive .jpeg or lossless .webp formats (based on the browser),
- Cache all optimised assets in server's memory via Memcached service.
- Extended the expire headers for static files, to facilitate local browser caching for the static files.
As the last bit, we replaced slower PHP 5.6 with HHVM. It worked great, delivering a better user experience, even to the logged in customers and during the checkout. HHVM allowed reducing page generation time tremendously, around 2.5x times on an average.
Tools used for website speed optimisation
During the fine-tuning process, we used a range of tools to deliver measured performance gains:
www.webpagetest.org
We used www.webpagetest.org to achieve A-only rating for every measured metric and the full page loading time was around 1.5-3.5 seconds for the home page.
PageSpeed Insights
The PageSpeed Insights is a tool made by Google for the public to help building the faster internet. Similarly to the webpagetest.org, PageSpeed Insights allows to measure website loading speed grade and assess if further optimisation may be necessary to improve it.
PageSpeed insights helped us to optimise tilkah.com.au website a bit further by adding deferred JS filter, also unblocking content loading and rendering by several JS files that were loading first. The defer JS filter allows for restructuring web page content and putting non-critical JS files to the bottom of the page.
CDN
We did not use CDN for tilkah.com.au. HTTP/2 allowed the server to deliver content much faster than via a CDN. In fact, 3rd party CDN is the limiting factor for further website speed improvement at the moment, as the third party content (such as external JS and analytics scripts) are being loaded via the CDN. The www.webpagetest.org tool clearly outlines this problem.
As the outcome, WordPress backed shopping site tilkah.com.au is loading in a whopping 2-3 seconds time.
Server performance
During the optimisation and fine tuning cycles for the tilkah.com.au, we use the loader.io tool to measure and compare the server effectiveness during every step of our optimisation work. As the outcome, the production server is capable of serving 100 customers (full page loads) per second. In fact, the server was able to exceed this performance target by several times, surviving over 300 customer visits per second.
If your website is loading in more than 4.7 seconds, Google and other search engines downrank it. talk to our experts now to get your website optimised.
Talk to our experts now to get your website optimised.