Skip to content

Improving pagespeed scores on my website

Posted on:July 22, 2023
Improving pagespeed scores on my website
Image generated by adobe firefly

I recently made some changes to my website (this). I wasn’t worried about the page performance at first; the goal was to make it work and worry about performance later.

Pagespeed insights

When the initial modifications were live on my website, I checked some pagespeed insights. Here are the results


The SEO reported in the initial tests is wrong. The actual value is 100 for both tests. Since the tests are run on a preview URL, Cloudflare pages add the X-Robots-Tag: noindex to make it non-indexable






Improving the scores

Defer non-critical js

The mobile page was loading a /toggle-theme.js , which is not immediately required on page load. So I deferred the script loading.

<script is:inline src="/toggle-theme.js" defer></script>

Eliminate render-blocking resources

This site loads two fonts, one for the typography and the other for the code blocks. Preloading the fonts helped solve this issue.

<link rel="preconnect" href="" />
<link rel="preconnect" href="" crossorigin />
  this.onload = null; this.rel = 'stylesheet'

The script loads the font CSS asynchronously and processes them as soon as they load. The onload is set to null so that browsers don’t redo any of these steps upon switching the rel attribute. You can read more about this on

Minimizing CLS

The google fonts standard CSS snippet sets the display attribute as swap. This does not block your page from the font loading, which means that your page is painted first, and when the fonts are loaded, it gets applied. This behaviour caused CLS(Cumulative Layout Shift). The font preloading only caused the CLS to reduce.

The solution was to change the display attribute to optional. Optional does the following

Read more about font display attributes here.

Final scores





The scores improved, but there’s still some work on mobile regarding FCP. You don’t always need a perfect score on all the metrics, but it feels good when you have them. Apart from solving silly issues, I also improved the user experience on my website.

If you have any pointers or if there’s something I could’ve done better, please let me know.