| layout | ../../layouts/BlogPost.astro | ||
|---|---|---|---|
| title | Comparing Performance Between Old & New Sites | ||
| description | Taking a closer look at the performance between the two sites. The result may or may not shock you, but probably won't. | ||
| pubDate | 2022-09-05 | ||
| heroImage | ../assets/blog/comparing-performance-between-old-new-sites/hero-image.webp | ||
| tags |
|
In my prior post, I detailed my experience of rebuilding my site using Astro. Now, I want to do some actual comparisons between old and new performance. I ran lighthouse on both and here are the results.
For both tests, I used the same lighthouse configurations
- Mode: Navigation
- Device: Mobile
- Categories: Performance, Accessibility, Best Practices, SEO, PWA
I also made sure to run the test in incognito mode to avoid extensions such as React DevTools affecting the results.
I'd like to note these scores are a bit skewed as I removed the projects section which included a lot of unoptimized images/gifs, which are all loaded the moment the page loads.
| Category | Old | New |
|---|---|---|
| Performance | 48 | 99 |
| Accessibility | 81 | 98 |
| Best Practices | 83 | 92 |
| SEO | 92 | 100 |
| Metric | Old | New |
|---|---|---|
| First Contentful Paint | 2.4s | 1.6s |
| Speed Index | 4.3s | 1.6s |
| Largest Contentful Paint | 12.5s | 1.6s |
| Time to Interactive | 10.3s | 1.6s |
| Total Blocking Time | 160ms | 0ms |
| Cumulative Layout Shift | 0.432 | 0.001 |
Here are some good docs on what these metrics mean.
The old site loads around 125kb worth of javascript, whereas the new site loads almost none: the only javascript file being google analytics. This is the reason why First Contentful Paint is the same as Time to Interactive since it's purely HTML.
AstroJS is a huge part of the performance gain, but also reworking/optimizing the site using the latest recommendations helped as well.
In any case, the numbers are just:
import { Image } from "astro:assets"; import wowImage from "../../assets/blog/comparing-performance-between-old-new-sites/wow.webp";