How to Optimize the Speed of Your Website | MultipleMedia
Read about our 20 years!

HOW TO OPTIMIZE THE SPEED OF A WEBSITE.

100 on PageSpeed Insights… or almost! PageSpeed ​​Insigths, offered by Google, is a tool that analyzes your site’s display speed. Nowadays, with the advent of mobile, speed is no longer an asset but a necessity.

 

At MultipleMedia, we got a score of 99. How? We have identified two main levers of action:

- Server response time

- Size of the content to download.

 

»» »Here's what to do!

 

Server Response Time

This accounts for much of the loading time of a web page. This is the time between the request made by the user and the time when the download begins.

Unlike the rest of the page, waiting for the server response does not occur with the loading circle of the site. This gives the impression that "nothing is happening", which must be avoided at all costs.

"We opted for WP Super Cache"

Several variables can influence the equation, but solutions often require code modification. Since we use WordPress, it seemed inappropriate to change WordPress. To remedy this problem, the use of a cache plugin was necessary. This one keeps in memory the pages which have been loaded, thus avoiding rewriting the page each time. With over 2 million downloads, we opted for WP Super Cache. Its features are efficient, accurate and its good reputation ensures reliable support.

 

However, there is still a big disadvantage when using a plugin like this: caches expire after a while. If no one has visited a page for a while, there may be no cache in memory. The next user will therefore have a slower server response.

Another point: remember to regenerate the cache when you make changes to be able to see them, otherwise you will have to wait for its expiration. It is however possible to configure the plugin to regenerate it automatically.

Here, the benefits far outweigh the disadvantages. The impact of using a caching plugin is considerable on the speed of the site and the result is even more significant for the user.

 

Optimization of Images

The images of a site represent a large part of the loading of a web page. From the theme to the carousel, we find them everywhere. A priority point for aesthetics, they must be of good quality. That said, higher quality means a heavier file, and more data to download. We must therefore ensure that we maintain a suitable quality, while reducing their size as much as possible.

"... thanks to the EWWW Image optimizer plugin"

We decided to create images in WebP format using the EWWW Image optimizer plugin. The choice of this format is relatively simple since it is an image format developed by Google, better optimized than JPEG. The images are compressed to the maximum, without loss of visible quality. We simply created copies of our images, in WebP format. If the search engine does not support the latter, it will choose the equivalent JPG / PNG.

The problem with WebP is that it is only supported by Chrome and Opera. Another disadvantage: having two copies of each image (an original and a WebP) on our server doubles the required storage space.

The benefits offered by image optimization range from 5% to over 50% decrease in the volume of data to download.

 

Optimization of the Source Code

The last changes had a small impact for the user, but significant for the Google tool. We used a hybrid approach to optimize the source code of the website. Part of it was automated using the Autoptimize plugin, while our JavaScript and CSS files were manually compressed.

"Using Autoptimize ..."

Another optimization solution was changing the source download order to a more appropriate priority. We did not want to leave the loading of our page in suspense to download JavaScript files used only after the initial loading of the page.

 

Go Further

A feature that saved us a lot of time and drastically increased our rating on gtmetrix.com is the KeepAlive. This is a feature that keeps the connection open to download all content rather than opening and closing connections for each request. However, this feature, like all the ones mentioned in this article, can cause some inconvenience.

First, it does not activate on the site, but on the server. It is not possible to activate it only on the desired site if the machine that hosts it also does this for other sites on which we do not want this feature. Moreover, this can become more demanding in terms of performance if many users visit the site. Our advice: Take the time to analyze the connection load before making a decision.

However, the benefits far outweigh the disadvantages. This feature saved us an average of 1.3 seconds.

 

In summary we achieved almost perfect results. On Google PageSpeed, we get a score of 99 on mobile and 95 on desktop and we get an A and a B on gtmetrix.com.

If you also want to improve the performance of your site, contact our Digital Agency.

What is Quality Assurance for Developers ?

Research

July 20, 2018

What does Quality Assurance mean when it comes to developers?   According to our experience, the best solution is to carry out your QA as you develop …

By: Julien Stébenne, Developer and
Jean-Philippe Georges, Marketing and Communication Manager

The 6 Major Trends in UX in 2018 – 2019

Research

July 6, 2018

A little reminder is always appreciated!   First, here are the main points you should remember when you think about UX.   Usability. Make something easy to …

By: Jean-Philippe Georges, Marketing and Communication Manager

The Angus Clinic gets a New Website, Responsive and Dynamic.

News

June 29, 2018

The starting point.   Located on the site of the Angus Technopole, the Angus Medical Clinic is a place dedicated to health promotion. Housed in a reminiscent …

By: Jean-Philippe Georges, Marketing and Communication Manager