WordPress Test Server Environment, other optimization configuration jobs - twenty-seventeen theme screenshot

WordPress Test Server Environment, other optimization configuration jobs


<< previousWordPress Test Server Environment, optimization configuration comparison

This is the another report for other jobs results conducted on purpose on the low budget shared hosting services.

We wanted to show a peek preview of the optimization power to a couple of interested ones, before making the live job. So we chose to clone their site, or some very popular one, and place them on a difficult to work environment. Their servers are far away better.

A clone page is simply a static copy of a WordPress page, so it behaves just as if would be a cached page.

Score numbers noted on the site url lists refer to Google PageSpeed Insights Mobile and Desktop values. GTmetrix and PingDom scores are visible on the image slideshows.

#################################

Test done on https://null24.net/ cloned as static page.
They use cloudflare, but server response is slow, misses gzip, leverage browser caching, etc…

   site                                Google PageSpeed Insights
                                             mobile  desktop
https://null24.net/                          50/100   61/100
https://emd4.club/portfolio/n24u/            62/100   78/100
https://emd4.club/portfolio/n24o/            91/100   97/100
https://emd4.club/portfolio/n24fo/          100/100  100/100

The base of this job is just a static copy of the homepage, with all ads disabled.

https://emd4.club/portfolio/n24u/ is unoptimized, just the static copy. Many of the assets are still on null.24.net server.

https://emd4.club/portfolio/n24o/ SCENARIO A partially applied.
It has been optimized on images, on css, the only is the Critical CSS produced for this project, on the defer of Javascripts. We left out one CSS file as rendering-blocking, we didn’t want to manually deferring it on purpose.

https://emd4.club/portfolio/n24fo/ SCENARIO B applied.   TARGET: ACHIEVED
It is full optimized. Inline JS have been minified. It has no external CSS file, everything is rendered by the inlined Critical CSS.

 Note:

The Critical CSS produced for this project (40 KB) is not full functionally, it has not been engineered to be the only CSS asset in use. It is perfect to visually render all the above-the-fold content, extended to the footer of the page… The menu is not working. We could fix it, it requires manual extra job, we decided not to do in this occasion.
+ Added 9 KB of code to render the menu and fixed missing font images, menu still not working, we are blocking the js that handles it. But, in live situation this does not happens, menu works.

#################################

Test done on https://avada.theme-fusion.com/blog-grid-right-sidebar/ the most sold theme on themeforest, cloned as static page.
We chose a template with the most complex layout above-the-fold. Almost all the others have a large picture, just to avoid above-the-fold rendering troubles.
They use autoptimize, but server response is slow, leverage browser caching, and images not optimized is really a bad mistake, easy fixable…
Avada theme presents an error on a CSS Selector declaration, we needed to fix to make our system work. A situation we saw on many other themes and plugins on the market, just because dealing with complex stylesheets architecture is not an easy task.

   site                                                      Google PageSpeed Insights
                                                                   mobile  desktop
https://avada.theme-fusion.com/blog-grid-right-sidebar/            50/100   61/100
https://emd4.club/portfolio/avada-bgrs-u/                          70/100   61/100
https://emd4.club/portfolio/avada-bgrs-o/                          71/100   89/100
https://emd4.club/portfolio/avada-bgrs-fo/                         99/100   99/100
https://emd4.club/portfolio/avada-bgrs-fo/noYouTube.html          100/100  100/100

The base of this job is just a static copy of the homepage.

https://emd4.club/portfolio/avada-bgrs-u/ is unoptimized, just the static copy. Many of the assets are still on theme-fusion.com server.

https://emd4.club/portfolio/avada-bgrs-o/ SCENARIO A partially applied.
It has been optimized on images, the originals are stored on flickr but not optimized, removed flickr script and retrieved from the server then optimized, on css, the only is the Critical CSS produced for this project, on the manually defer of Javascripts. We left out one CSS file as rendering-blocking, we didn’t want to manually deferring it on purpose.

https://emd4.club/portfolio/avada-bgrs-fo/ SCENARIO B applied.   TARGET: ACHIEVED
It is full optimized. It has no external CSS file, everything is rendered by the inlined Critical CSS. Here it is not possible to reach 100/100 because of Google!

Leverage browser caching for the following cacheable resources:
https://i.ytimg.com/vi/hsEUBLIJvmE/sddefault.jpg (2 hours)

is the triggered warning, and it is a YouTube file, the thunmbnail of the video embedded… !
This Critical CSS file is almost complete, it renders the entire page.

https://emd4.club/portfolio/avada-bgrs-fo/noYouTube.html Same as avada-bgrs-fo/ but…
after stripping out YouTube calls, score 100/100, just to prove what just said above.
Warnings about “Leverage browser caching” are being triggered by several files owned by Google, there are some complains around, Google technicians have already declared that they will make no changes on how they serve does files. There is no solution, just forget about these warnings.

In the 2 /fo/ tests, GTmetrix PageSpeed tool suggest to “Specify image dimensions“. This is how Avada is built, we can’t do nothing about it, other Themes do this instead.

 Note:

On the slow server of this test it is not possible to lower under the second of time load. This because of the architecture of the theme, of the use of a lot of iframes to load external data, the overall weight of the page is high. And it is not possible to work on a live WP installation, where it would be possible to perform way long better. But above-the-fold  content is displayed faster enough to satisfy metrix tools rules and make visitors happy so the target is fully achieved.

#################################

Test done on http://2017.wordpress.net/ the new official WordPress theme, which report use of version 4.8, in late November 2016, 4.7 has not been released yet.
Just a note about the header video they use, we used their video source, since our low performance test server.
The images are loaded on our server, to avoid mixed content warning, because the original page is not under https.

   site                                                   Google PageSpeed Insights
                                                                mobile  desktop
http://2017.wordpress.net/                                      64/100   74/100
https://emd4.club/portfolio/2017-wp-u/                          73/100   89/100
https://emd4.club/portfolio/2017-wp-o/                          71/100   89/100
https://emd4.club/portfolio/2017-wp-fo/                         99/100   99/100

The base of this job is just a static copy of the homepage.

https://emd4.club/portfolio/2017-wp-u/ is unoptimized, just the static copy, with the images on our server.

https://emd4.club/portfolio/2017-wp-o/ SCENARIO A applied.   TARGET: ACHIEVED
It has been optimized on images, on css and js minification, adding inline the Critical CSS produced for this project, on the manually defer of Javascripts and CSS.

https://emd4.club/portfolio/2017-wp-fo/ SCENARIO B applied.   TARGET: ACHIEVED
It is full optimized. It has no external CSS file, everything is rendered by the inlined Critical CSS. For this particular project we used the full CSS of the page, optimized and merge into one piece of code, because the original css asset is made by 2 external file with an overall size of 83 KB. JS assets have been merged and minified, with the exclusion of the one necessary to make the play video button work. This has made loose 1 point on the YSlow metrix, down from 96 to 95.  Inline CSS and JS have been minified too, together with the entire HTML page.

FINAL CONSIDERATIONS

CAN YOU OPTIMIZE MY WORDPRESS SITE, TOO?

Sure! Since you are interested in optimizing your WordPress site,

We are here to help you satisfy your will.
If you want, you can follow us on Twitter Twitter_bird_logo_36x36 - (we) Optimize Your WordPress Site - Optimized Image to direct message with us.
You maybe scale up the waiting queue and have your job done sooner.
https://twitter.com/optimizeyourwp

PS: Please note that the metrix scores results are not a fixed number. They are elaborated by the various sites as new each time a brand new request is made, so they can vary. Especially the bad results, they can float a little. Once a site have been optimized its high values do not change. So you cannot attend to have an exact reproducibility of the numbers we have published in this report.

Google, PageSpeed, PageSpeed Insights, GTmetrix, YSlow, Pingdom, WebPagetest,  Avada, Theme-Fusion, Null24, and others are registered trademarks of the respective owners.

Advertisements

2 thoughts on “WordPress Test Server Environment, other optimization configuration jobs

Comments are closed.