100 out of 100 in Google PageSpeed Insights (Bug or feature)?
Many of you have probably enjoyed the wonderful service from Google: PageSpeed Insights ? Want to get the coveted 100 out of 100?
Picture to attract attention
But it's up to the small one.
We take any website, for example, I took a free ready-made adaptive website template to my hosting and started testing: The result of the first test (link to the website ):
Not bad, yes?
')
Complains of:
It was:
It became:
And - hooray! - we have the results above (link to the site ):
And only complains about:
And also we do not forget that after all we have not solved the problem described above:
And now the main question: Bug or feature?
Thank!
UPD 09/07/2015 16:55 : Inflated styles on the site (+ squeezed css) to 5 megabytes, and the result is the same, even due to compression, better than 100 out of 100.
Picture to attract attention
But it's up to the small one.
So, the results of my test.
We take any website, for example, I took a free ready-made adaptive website template to my hosting and started testing: The result of the first test (link to the website ):
- mobile speed - 79/100;
- computer speed - 93/100;
Not bad, yes?
')
Complains of:
Correct necessarily:We make small frauds. Transfer the styles from file to code:
Remove the JavaScript and CSS blocking the display from the top of the page.
The number of blocking CSS resources per page: 3. They slow down the display of content.
All content at the top of the page is displayed only after downloading the following resources. Try to postpone the loading of these resources, load them asynchronously, or embed their most important components directly into the HTML code.
It was:
<head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <link rel="stylesheet" href="css/style.css"> <title></title> <!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]--> </head> It became:
<head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <style> article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display:block; } /* */ </style> <title></title> <!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]--> </head> And - hooray! - we have the results above (link to the site ):
- speed for mobile - 99/100;
- computer speed - 99/100;
And only complains about:
Correct as possible:But this problem can be solved by compressing the code. This topic does not apply.
Shorten HTML
Compressing HTML code (including embedded JavaScript or CSS code) allows you to reduce the amount of data to speed up the loading and processing.
And also we do not forget that after all we have not solved the problem described above:
All content at the top of the page is displayed only after downloading the following resources. Try to postpone the loading of these resources, load them asynchronously, or embed their most important components directly into the HTML code.How much they weighed in the file, the same they weigh in the code!
And now the main question: Bug or feature?
Thank!
UPD 09/07/2015 16:55 : Inflated styles on the site (+ squeezed css) to 5 megabytes, and the result is the same, even due to compression, better than 100 out of 100.
Source: https://habr.com/ru/post/266357/
All Articles