Français
Presentations About Resources Store

Salesforce, Python, SQL, & other ways to put your data where you need it -- a bilingual blog in English & French

Need event music? 🎸

Live and recorded jazz, pop, and meditative music for your virtual conference / Zoom wedding / yoga class / private party with quality sound and a smooth technical experience

How I brought my Google Page Speed from 80 to 91 in 5 minutes

23 Jun 2020 🔖 tips web development
💬 EN

Post Header Image

Table of Contents

I finally took the world’s advice and split my blog’s JavaScript into “load first” and “load last” sections. Brought my Google PageSpeed Insights score on mobile up from 80 to 91.

How I did it

I used to have a file called scripts.txt that I injected into the <head></head> of my site.

It included the 6-line JavaScript for my archive expander/contractor arrow toggles as well as calls to some external JavaScript, like Google Analytics and LinkedIn/Twitter widget I had long ago stopped using.

I split it into two files: scripts_internal.txt and scripts_external.txt.

  1. I left scripts_internal.txt in the <head></head>. Maybe it doesn’t need to live there, but I didn’t want to take a lot of time to debug.
  2. I moved scripts_external.txt to live as the last piece of HTML injected into the <body></body> of my web site.

I also got rid of the LinkedIn/Twitter widget JavaScript it turned out I’d long ago replaced with simple links.

Moral of the story: don’t just read the textbook on web site optimization – do your homework too!

Question for the audience

It looks like my only image on my home page is my SVG logo, so I’m a little mystified why I’m still all the way down at 91 on mobile and 95 on desktop.

Anyone have any ideas for how I could get my “first contentful paint” even snappier without too much effort?

Inspiration

Thanks to Michael Kennedy for teaching me about the PageSpeed Insights tool in his appearance on VBrownBag.

--- ---