Blog

How to Score an A+ on Google PageSpeed Insights

Themify Tutorial How to Score an A+ on Google's PageSpeed Insights

Ranking higher on Google searches likely means the number of visitors crossing your page will increase as well. But how do you ensure you make it to the top of the Google search list? Well, there are a variety of factors that play into how high your website ranks.

You can improve your Google search ranking by adding an SSL certificate to your site, translate your site to be multi-lingual, or you can ensure your site loads super quickly! That’s what we’ll look at in this foundational tutorial, and we’ll show you just how to achieve a powerfully fast WordPress site!

For this tutorial we’ll be using Google PageSpeed Insights to monitor and evaluate our page speed scores. First, we created a demo site that we set up using the Ultra theme. We then used the free plugin, Autoptimize, in order to streamline, compress, and minify various aspects of the site, using the settings we’ll list further below. We then ran a test of our site through PageSpeed Insights, and ta-dah!

Themify Tutorial How to Score an A+ on Google PageSpeed Insights 100 percent pagespeed score

Demo Site

As you can see, the score is 100/100 on desktop. It’s also 97/100 for mobile. We’ll show how you can achieve a 90-100% score on PageSpeed Insights, step by step.

Ps. Full disclosure - the demo site we've set up, isn't as heavily loaded as some other sites might be with many more videos or photo content. But this tutorial should at least boost your current PageSpeed Insights score.

Run A Speed Test

First, to see the most true results, run a test of your site before uploading Autoptimize. You can run your page speed test here.

Installing Autoptimize

Next, install Autoptimize:

  • WP-Admin Dashboard > Plugins > Add New > search for "Autoptimize" > Install > Activate

Themify Tutorial How to Score an A+ on Google PageSpeed Insights

Autoptimize Settings

To configure the settings, go to:

  • WP-Admin Dashboard > Settings > Autoptimize

Themify Tutorial How to Score an A+ on Google PageSpeed Insights

These are the recommended optimize settings:

  • Optimize HTML code:

Themify Tutorial How to Score an A+ on Google PageSpeed Insights

  • Optimize Javascript files:

Themify Tutorial How to Score an A+ on Google PageSpeed Insights

  • Optimize CSS code:

Themify Tutorial How to Score an A+ on Google PageSpeed Insights

  • Save aggregated script as static files:

Themify Tutorial How to Score an A+ on Google PageSpeed Insights

After you have finished selecting the appropriate settings, view the site on the frontend with incognito mode (this is necessary so that the scripts/cached files will be generated).

Then go to Pagespeed Insights, and run a final test of your site! And you're done. You've just optimized your entire site to load faster than ever before.

Want to make sure your website is found and loads even faster? Check out this tutorial on creating SEO optimized images, or read up on our latest tutorial.

50 Comments

  1. Edwin Spiessens
    Apr 24, 2019 @ 13:22

    Hi there,

    Link to demo page gives a 404 for me (on mobile)

    Reply

  2. Eric van der Wal
    Apr 24, 2019 @ 14:05

    Hi

    I tried Autoptimize before but was not sure about all the settings. This will help!
    Maybe I’m wrong but I would like to know what to do with other plugins/settings that are doing partially the same. Like caching plugins and the settings in Ultra itself. In Ultra you can enable the Script minification. Should I turn these on or off?

    Eric

    Reply

    • Lee
      Apr 24, 2019 @ 17:43

      yeah same here. this looks good but my caching plugin does some of this already. Is it one or the other?

      Reply

    • Nick @ Themify
      Apr 25, 2019 @ 00:39

      You can keep the Themify minification enabled. However, Themify minification can only handles the scripts within the theme. The Autoptimize plugin handles the entire site.

      Reply

  3. Michael Wright
    Apr 24, 2019 @ 14:14

    Interesting – Autoptimize on my installation – lacks most of what I see in this tutorial e.g Javascript just has ‘optimise Javascript code’ – no other options.

    I looks to me that you are using a paid for version – this needs to be made clear in articles such as this.

    Reply

    • Stefanie
      Apr 24, 2019 @ 14:44

      You can click “show advanced settings” located in the title bar area of the settings page to see those extra settings.

      Reply

    • Erik Bowman
      Apr 24, 2019 @ 15:32

      I found the “Show advanced settings” (a button on the top right side).

      Reply

    • Olivier Brun
      Apr 24, 2019 @ 15:32

      Hi Michael,
      It is not a paid version, I was also looking myself for the option but you can see in the top right corner “advanced settings”. Then you will have all the options.

      Reply

    • Nick @ Themify
      Apr 25, 2019 @ 00:39

      We are using the free version as well. Perhaps the screenshots were taken from the older version. But the functions should work the same.

      Reply

  4. Lee
    Apr 24, 2019 @ 14:20

    This sounds really great!

    Can i use this along side ‘WP Fastest Cache’ plugin or is it a matter of using one or the other, as they might overlap in doing the same thing?

    Thanks

    Reply

    • Nick @ Themify
      Apr 25, 2019 @ 00:41

      It is better to find a cache/minify plugin that works best for your site. Don’t install multiple cache plugins as this might create conflicts.

      Reply

      • Lee
        Apr 26, 2019 @ 20:04

        Turned off my premium cache plugin and tried Autoptimize… loads better by a hair and with a smoother reveal, but I’m noticing on all my sites the mobile speed is up by 20-30points. Desktop 5. So I’m well happy with that recommend. Cheers Nick!

        Reply

    • Dragos
      Apr 25, 2019 @ 17:26

      I tested with LiteSpeed Cache and it works fine. Just disable extra options from the cache plugin that might overlap, like css/js minify.

      Autoptimze should optimize for first view, while a cache main function is to deliver fast pages on 2nd+ view. So they should complement each other.

      Reply

  5. wormishere
    Apr 24, 2019 @ 14:26

    I jumped on this when I saw the email come through – my site score well on other speed testing sites but very poor on Google.

    Having not found all the settings you list (I guess there is a premium account needed) I just applied the ones I could.

    After this I actually saw my page speed rating on Google decrease :(

    I would be genuinely happy to pay for a premium plug in that worked but not risking a long subscription without knowing the results.

    Reply

    • Nick @ Themify
      Apr 25, 2019 @ 00:42

      The screenshots on this tutorial could be taken from the older version. Note that you have to visit your site first in order to generate the cached files (then it will serve the cached files). Try to view your site in incognito window and then re-check Google PageSpeed Insight.

      Reply

  6. Hanne Olsen
    Apr 24, 2019 @ 14:54

    Thank you for the tip.

    I tried it, but it did not help at all. No change at all, and my website is really slow. So it might not help all of us? :-)

    Reply

  7. Gabriele
    Apr 24, 2019 @ 15:03

    Hi, I knew Autoptimize but I thought it was a bit risky because some of its features are already inside the theme and Builder settings (such as CSS compression and cache).
    Can you please explain what are the best settings in this case? Thank you.

    Reply

    • Nick @ Themify
      Apr 25, 2019 @ 00:43

      Yes, we do have minify/cache feature in Themify themes. However, we only handle the scripts within the theme whereas Autoptimize handles the whole site.

      Reply

  8. Erik Bowman
    Apr 24, 2019 @ 15:28

    Agreed. The free version has fewer options. It did bump my speed insight score from 7 to 50. That’s impressive but still no 100. The largest impact is still “Eliminate render-blocking resources.” Perhaps I’ll look into the paid version.

    Reply

    • Erik Bowman
      Apr 24, 2019 @ 15:31

      I found the “Show advanced settings” (a button on the top right side.

      Reply

    • Nick @ Themify
      Apr 25, 2019 @ 00:46

      Please go to WP-admin > Settings > Autoptimize > Extra tab, select “Combine and preload in head (fonts load late, but are not render-blocking)”. Does that help?

      Reply

  9. Davood Denavi
    Apr 24, 2019 @ 15:37

    I’d suggest being careful with such guarantees. I’ve used the autotomize plugin many times and while it does work very nicely it does not always lead to a 100/100 result on Google Pagespeed insights.

    Reply

  10. Philip Rosmarin
    Apr 24, 2019 @ 15:38

    On my free version, there’s a “Show advanced settings” button to the right of “Autoptimize Settings,” which shows all the options.

    Reply

  11. Philip Rosmarin
    Apr 24, 2019 @ 15:45

    Thanks much. My site went from 75 to 91.

    Reply

  12. Philip Rosmarin
    Apr 24, 2019 @ 15:47

    Oops, even better. After doing what you suggested , the 91 score was for mobile; desktop was 97.

    Reply

  13. Dragos
    Apr 24, 2019 @ 16:43

    Tested it and it doesn’t work as explained, doesn’t get the page up to 90-100% and further more, Autoptimize options from article screenshots differs from the versions I installed, namely missing aggregate css/js which sounds like quite an important feature. I am positive i have the latest version, just in case anyone will ask.

    I have better results with LightSpeed Cache or Asset CleanUp, also these plugins need more tweaks than just checking 3 check boxes.

    Reply

    • Nick @ Themify
      Apr 25, 2019 @ 00:46

      Thanks for sharing your feedback. We will check the other 2 cache plugins you suggested.

      Reply

  14. Michael Oglesby
    Apr 24, 2019 @ 18:20

    This whole article is click-bait, I expected better from Themify.

    I have tried to get 100/100 Google Page Speed with Themify themes for years, and the best I ever got was 91/100 for desktop, this was around 2015. This was by using the Landing theme, W3 Total Cache with about 3 three images on the page.

    One of the main problem were the Themify theme JS and CSS files, there were a lot of them and you can’t defer them nor disable them. If there was a way to disable theme in the Framework, that would be great.

    You also need a good hosting server with excellent response time (TTFB); this is critical, don’t cheap out. make sure your hosting has HTTP/2, also important. If you are pay less that £5 per month for your hosting, don’t expect Amazon level performance. Also, make sure your Page Size is as small as possible. You are not buying websites for desktops nor more, you are building websites for mobile, on a 3G signal.

    Reply

    • Nick @ Themify
      Apr 25, 2019 @ 21:45

      Hi Michael,

      There are many factors that can affect page speed (scripts, images, plugins, and of course server plays a big role here). Which Themify JS/CSS files are you referring to?

      Reply

  15. Barry Wehrli
    Apr 24, 2019 @ 18:35

    I’m using Autoptimize 2.5, and have not gotten any update notices, so I assume that’s the latest version. And with it, I am seeing all the screenshot options in that version. The only difference in my original settings versus those above is that I didn’t have the two JavaScript boxes checked. With original setting my Google Pagespeed was 39. After checking the JS boxes, it averaged 50-56. That’s an improvement but far from 90-100.

    That said, I don’t understand this statement “… view the site on the frontend with incognito mode (this is necessary so that the scripts/cached files will be generated).” I’m not sure how to view my site using “incognito mode” so maybe doing that is what forces the score higher? Please advise, thanks.

    Reply

  16. André Gardenier
    Apr 24, 2019 @ 19:45

    Hi you all,

    I have been testing plugins for speed for a long time.

    This works … but … i use Hummingbird also.
    100/100 is a dream.
    No cache plugins needed.
    No script to footer
    No WP super minify
    No Wp Super Cache

    I have nice results and 100/100 ?
    Dream on.

    Reply

  17. BubbleSwan
    Apr 25, 2019 @ 03:28

    Thx for the tutorial, it’s really a great help. My website really need that. Will you mind offering us another tutorial for SEO? like google, baidu, bing, etc. :D

    Reply

  18. Barry Wehrli
    Apr 25, 2019 @ 04:32

    Sorry, I don’t understand this statement “… view the site on the frontend with incognito mode (this is necessary so that the scripts/cached files will be generated).” I’m not sure how to view my site using “incognito mode” so maybe doing that is what forces the score higher? Please advise, thanks.

    Reply

    • Larry Whaley
      Apr 25, 2019 @ 15:19

      @Barry Wehrli
      Incognito is an option in most browsers. From the drop down you will find it I use it while developing a site so that I can make changes to code, and then view it in the incognito without the need to close what I’m working on.

      Reply

  19. John Pinkerton
    Apr 25, 2019 @ 12:15

    Gave Autoptomize a try and it did improve my site pagespeed score from 55 to roughly 79 so there is clearly a benefit. However, I think getting near the 100 mark is almost an impossibility for a normal working website. The demo site you use is a bare bones stripped down with with virtually no content. I ran the page score on your Ultra demo site (https://themify.me/demo/#theme=ultra) and got a score of 46. Would be interesting to see how much you could improve that score with Autoptomize on it.

    Also, I kept re running the pagespeed test with no changes to my site a few times and the score kept changing. Would like to see pagespeed being a bit more consistent to know if the changes I make are really helping or not.

    Overall, Thanks for the post.

    Reply

    • Nick @ Themify
      Apr 29, 2019 @ 16:24

      It depends on the images and plugins as well. On our Ultra demo, we’ve packed too much on one site. If we optimize the large images and remove the unnecessary plugins, the score will be improved.

      Reply

  20. Barry Wehrli
    Apr 25, 2019 @ 19:41

    @Larry Whaley, Thanks for the info.

    So I checked my site again using incognito. When I check both of those JS boxes, my speed does increase from around 40 to around 70. But my homepage (WehrliPubs.com) product slider at the top breaks and *every* WP Page has the top portion cut off. I also tried checking only the top JS box, not the bottom one. That fixed the broken elements but took my speed back down into the 40’s, effectively doing nothing. Looks like I need a pro to get this site up to speed correctly.

    Reply

  21. Jan
    Apr 25, 2019 @ 20:08

    I tried this on both of my websites, and one actually dropped from an abysmal 26 to a worse 21. Seriously.

    Reply

    • Nick @ Themify
      Apr 25, 2019 @ 21:41

      There could be other factors causing the issue. Have you tried to visit your site first before checking PageSpeed Insights?

      Reply

  22. Larry Whaley
    Apr 25, 2019 @ 20:31

    @Barry Wehrli
    Make sure that under Themify > Theme Settings > Script Minification is turned off. Try again, and see if it breaks the JS code. It could be because of the double settings. I’m not sure if the Themify Minification used at the same time would or would not cause a conflict.

    Reply

  23. fausto pastorino
    Apr 26, 2019 @ 08:41

    I’ve activated and configured as you shown but now THEMIFY POPUPS doesn’t work anymore… Thy conflict, I suppose: or have I to change something in configuration (from Autoptimize or Themify Popup)?
    thanks

    Reply

  24. Alex
    Apr 26, 2019 @ 20:08

    I’ve installed and activated the Autoptimize plugin and I can attest of the speed improvements on my website. Mind you I’ve already optimized that website by minifying the stylesheets and over recommended optimization tricks such as reducing the number HTTP requests, optimizing image size, caching, etc. All pages load times were below 3 seconds.

    Before installing the Autoptimize plugin here are speed scores on the main pages of my website https://wpxpertise.com:
    Home (93), Services (96), Custom Themes Design (93), Custom Plugins (93), Web Design (95), Website Upgrade (95), Security (94) About (93), Contact (95), Blog (97)

    Then, after installing the Autoptimize plugin:
    Home (97), Services (97), Custom Themes Design (97), Custom Plugins (96), Web Design (97), Website Upgrade (97), Security (97), About (97), Contact (97), Blog (98).

    As you can see there is an improvement across all the tested pages. I wonder how much improvement this plugin can add to a website with an average speed score below 90.
    It’s really worth trying. Your website visitors will appreciate it.

    Reply

  25. Ahad Arzi
    Apr 27, 2019 @ 07:17

    Hey @nick,

    Thanks for the awesome post. I’ve followed your post same way and i achieve the same results. Now, I too got page speed score 99/100.

    That’s awesome man.

    Reply

  26. Onno Moleman
    May 03, 2019 @ 19:12

    After installing the plugin, the Builder no longer works for me. Only when I disable the plugin can I edit my pages again … Speed went up do!

    Can this also be different ???

    Reply

  27. Nilla Palmer
    Jun 01, 2019 @ 14:51

    Great info but shouldn’t Ultra’s developer/s be looking at ways to improve and optimse Ultra without relying on a plugin installation?

    The more plugins installed, the more things that can clash or go wrong with future updates and not to forget that too many plugins also slow a site down.

    Reply

  28. Hiero Vilas Boas Crepaldi
    Jun 11, 2019 @ 04:06

    50 comments! My tip is a record! xD

    Reply

Reply

The New Global Style Feature is Here! We're celebrating with 20% off everything. Use coupon: GLOBAL20