PageSpeed Ninja and Cloudflare APO – Speed Up WordPress Website

GTMetrix A grade scores on desktop and mobile. Core Web Vitals were green. PageSpeed Ninja and Cloudflare APO were enabled.

Two things come to my mind, when I check the pagespeed of a web page.

Is the site loading slow? How to Improve the WordPress site speed optimization?

I’m not a developer or tech junkie who can play with the PHP code of my site.

Also Read – Railgun and Auto-Minify in Cloudflare – Their Role in Web Page Load Speed (Case-Study)

So for cache and minification I tried using several plugins.

But most of them did not give satisfactory scores. Also some of the settings were difficult to understand.

In one case study, I did a GTMetrix test with a page speed optimization plugin. The scores were not that good. I removed the same plugin and checked for results. Nothing improved.

Both the sites I compared were with minimal plugins, images and resources. Since not many third-party scripts were there, I expected a 100/100 score.

The more significant part is the Core Web Vitals which will be a ranking signal in coming months.

Also Read – Optimize Images – Improve Google PageSpeed and Reduce Server Load [Case-Study]

Then I found a plugin called PageSpeed Ninja. Better page speed performance compared to the earlier plugins. In order to improve the TTFB scores, I also activated the Cloudflare APO. This costs $5/month per site.

This combination gave me good results in terms of score and web vitals.

PageSpeed Ninja – Fast Caching and Speedy Load Time

The main use with this plugin is the automatic control of settings. There were 6 different presets. Each preset will come with a set of preconfigured settings. I chose the “optimal” version. This enabled the following options under “Desktop” and “Mobile” mode.

  • Avoid landing page redirects
  • Enable compression
  • Leverage browser caching
  • Reduce server response time
  • Minify CSS
  • … HTML
  • Minify JS
  • Eliminate render-blocking JavaScript and CSS in above the fold content
  • Optimize images
  • Prioritize visible content

Separate static files folder created. Remote critical CSS generation is also automatic. The distribute method was Apache mod_rewrite+mod_headers.

Introduction

I was using the DreamHost shared hosting plan. Enabled the free Cloudflare plan for this site. Brotli compression and Rocket Loader were turned on. Speed up page load times for your visitor’s HTTPS traffic by applying Brotli compression. Improve the paint time for pages which include JavaScript.

There were 21 active plugins. AMP pages were used for mobile redirection.

But there was a difference between this site and the earlier one with Hummingbird Pro. Automatic Platform Optimization for WordPress. This results in consistent, fast TTFB and content loading faster.

The tested web page had 15 images. Images were compressed using an image optimization plugin.

GTMetrix – Metrics

The GTmetrix Grade is an assessment of your overall page performance.

It reflects both, how fast your page loaded for users, and how well it’s built for performance.

The Performance Score is essentially Lighthouse Performance Score, as captured by GTmetrix, with our custom audits, Analysis Options, browser and hardware specifications.

Your Structure Score is the proprietary assessment of Lighthouse and Custom GTmetrix audits.

It represents how well your page is built for optimal performance

Web Vitals

LCP measures how long it takes for the largest content element (e.g. a hero image or heading text) on your page to become visible within your visitors’ viewport.

For a good user experience, aim for an LCP of 1.2 seconds or less.

TBT tells you how much time is blocked by scripts during your page loading process.

For a good user experience, aim for a TBT of 150 milliseconds or less.

CLS indicates how much layout shift is experienced by visitors as your page loads.

For a good user experience, aim for a CLS score of 0.1 or less.

GTMetrix Page Speed Test – Desktop

The result for the desktop page shows GTMetrix Grade “A” score. Audits did not show any “Top Issues”. All the performance metrics were in green. The fully loaded time was less than 1.0s. Main core web vitals of LCP and CLS were within limits.

 

TTFB time was 131ms. The cumulative layout shift required some improvement. The total requests were 22. Due to the minification of HTML, CSS, JS the total size of these resources was only 90KB.

GTMetrix Page Speed Test – Mobile

AMP pages were tested with desktop emulation. The GTMetrix Grade was “A” and web vitals were also showing good metrics. Only the CLS value was out of range. The only issue was with “Avoid large layout shifts”. The fully loaded time was 2s and TTFB was 84ms.

FCP and LCP values were green. HTML, CSS, JS resources for AMP were 10 requests with 165KB. Though the AMP plugin was creating some JS sources, they were loading fast enough.

Conclusion

The best results were obtained when using the deadly combination of PageSpeed Ninja and Cloudflare APO. One was used for minification, gzip compression, optimize images. The other was used in reducing the TTFB times. No third-party ad scripts were used for this site.

This also has an impact on page loading speed. Since both desktop and AMP version were loading within 120 secs, we can safely say that the host was clearly optimized for speed.

The best thing is about the Core Web Vitals. Since GTMetrix is also using the Lighthouse tool of PageSpeed Insights of Google, it gives a clear indication of speed.  Server speed, caching, image optimization and CDN together produce 100/100 results.

 

Leave a Comment