Solutions to problems you find through Google PageSpeed
Strategy
You just ran the Google PageSpeed tool on your website, and you see a bunch of red text signifying a slew of problems. So where do you start? Start with the ones that add the most time to your page load. (After all, our goal is to speed up our site. Right?)
Largest Contentful Paint
While this is not a problem we need to handle on it’s own, this problem is caused by the list of other items shown to you. This item describes when a visitor will first see anything substantial on the screen, versus a white page or the background color. Just know that solving other problems in the list will effectively bring down the seconds it takes to display the page.
Eliminate Render Blocking Resources
This problem is caused by CSS and JS files needing to get processed before the browser can continue processing the HTML for your page. (That’s the part that the visitor sees.) CSS styles your page to look right, and JS can do a number of things from providing you with analytics, to creating sliders for your site.
To fix this issue, you can do several things.
- Add async or defer to your JS tags. Async will allow you to move the work to a different thread, so that the browser can process it while it compiles the page to show to the visitor. Defer, on the other hand, will wait until after the page is finished rendering, and then run. Both have advantages and disadvantages.
- Move your JS tags to just before </body> so it no longer blocks rendering.
- Use the “media” attribute to limit which types of devices and views should even load the CSS. (Ex. Print, device width, etc.)
Minimize Main Thread Work
The main thread of an application is the thread that handles everything including displaying your site to the visitor. However, you can use child threads (boss/worker model, for example) to allow your site to have things like JS code get processed in parallel with the page. Some JS code may not like that, and will throw errors if you try to run it asynchronously.
You could do the following:
- Make JS files load with the “async” attribute.
- Reduce your JS content. (Ex. If you have a slider you don’t need on your site, try making it use a grid/masonry style item instead.)
- Reduce the number of images on your page, and convert the ones you keep into webp format. (Webp is much smaller than some other formats, and the quality still looks great.)

Conclusion
These are just a handful of the most common “large ticket items” you’ll want to solve. If you reduce the work the browser must do, and lower the download size, then your page will perform much faster. Also, try W3 Total Cache, add a CDN, and front load your site with CloudFlare. All of that will help speed up your site, too.
Want us to do it for you? We’re offering a free audit to discover how best to help you reach your website speed goals.
Were you able to fix your page speed using this guide? If not, what challenges did you face?