Optimizing the speed of loading a site on Wordpress using the tips of Page Speed

Good day.

Today I will tell on the example of one of the sites created and maintained by me - how to optimize its download speed and Googla loyalty.

Initial data:

• Site loading speed - 2 s,
• The processing speed of the first request is 1.06 s,
• The transmission time of the first request is 364 ms,
• The download data ~ 3 MB,

')

The answer to the puzzle

• Site loading speed - 1 sec.
• The speed of processing the first request is 80 ms,
• The transfer time of the first request is 15 ms,
• Downloadable data ~ 70 kB, (first load 1400 kB)

Before work, backup all files and databases. The author is not responsible for the consequences.

Task:

Optimize download speed for a good laptop with good internet download speed, to put it mildly, leaves much to be desired.
For comparison, the data on the main page of Yandex:

• Site loading speed - 1.2 s,
• The speed of processing the first request is 203 ms,
• The transfer time of the first request is 71 ms,
• The volume of loaded data is ~ 46 kB,

The solution of the problem

Googling and finding a bunch of recommendations for optimizing a site like this one realized that for meaningful estimates of the site’s speed, it’s not enough to know the numbers, you need to understand where your legs grow from.
In the comments to the above topic I came across a wonderful addition to chrome PageSpeed ​​Insights

The procedure for working with this tool is very simple:

• Installing PageSpeed
• Open the required site
• Launch "Developer Tools"
• Open the PageSpeed ​​tab and run the "Analysis"

We get a list of recommendations that have different priorities and are divided into groups

• Provide quick server response
• Reduce the number of blocking resources
• Minimize load
• Minimize the delay in loading the page
• Other, etc.

In each section there are recommendations for example, “Minimize the load” (In my case, the list turned out like this)

• (B) Enable compression,
• (N) Provide resources from the same URL,
• (N) shorten javascript,
• (N) shrink css,
• (N) shrink html

This tool not only makes recommendations but also does some things for you.

All that is proposed to reduce, reduce, squeeze the addition immediately squeezes and offers to open the finished file, your only task is to take and put where it is necessary on the server. By the way, where to put it will also prompt if you hover on the file name.



But back to our sheep site. Having made all the necessary replacements of JavaScript, CSS and images, I am pleasantly surprised at the decrease in the amount of downloaded information by about 1 MB.
But everything stops at the “Turn on compression” item. We go and ask Google for help. We find W3 Total Cache - a great Wordpress plugin that allows us to optimize the site according to the parameters we need.
Installation is simple as always with Wordpress. We go in additions, search, install.
But then the fun begins, setting ...
The plugin can do a lot, but we don’t need everything. Reserve

• Page cache (Pages are not generated for each request, but are already saved)
• Browser cache (Some of the information, such as pictures, scripts and styles are stored on the client after the first boot)

In addition to this, the plugin itself can compress JavaScript and CSS, but I would prefer PageSpeed ​​as I don’t know what to do with these files.

In the plugin there are more exotic optimizers like CDN, Reverse Proxy, but they give the result already under heavy loads.

The answer to the puzzle

• Site loading speed - 1 sec.
• The speed of processing the first request is 80 ms,
• The transfer time of the first request is 15 ms,
• The volume of the loaded data ~ 70 (1400) kB, *

Total we get a huge increase in the speed of loading the site, reducing the load on the server and of the satisfaction of the work done!

Data on the speed and load time were obtained by the method of 5 samples at different times of the day and a certain average value was derived.

* - The amount of downloadable data as a result turned out due to the use of a slider of 8 pictures 1000 by 300 pixels, the average weight of each before optimization is 250 kB after 170 kB. but since we have a browser cache, they are loaded only for the first time and for 1 month

I wish everyone a successful use of this knowledge.