How to score a perfect 100/100 on google PageSpeed Insights
managed to score 100/100 last week, here’s few quick tip on how you can score a whooping 100/100 on pageSpeed Insights too.
#1 Images
Optimize and Compress Images: Resize your images to the correct dimensions and compress them without compromising quality. One can create smaller, richer images that make the web faster. WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25–34% smaller than comparable JPEG images at equivalent SSIM quality index. Add alt tags, width and height information explicitly to score on accessbility section.
#2 Minify
Minify CSS and JavaScript: Nuxt3 bundler will take care of this, however if not you can use webpack to minify or bundle up your javascript/css files.
#3 Static
Cache Set appropriate caching headers for your static resources (CSS, JavaScript, images) to instruct browsers to cache them. This reduces the number of requests made to your server.
#4 Redirects
Minimize the number of redirects on your website as they add additional round trips before the page can be loaded.
#5 Eliminate Render-Blocking JavaScript and CSS
Analyze your critical rendering path and defer or asynchronously load JavaScript and CSS that is not required for the initial page load. This allows the browser to start rendering the page faster.
#6 Prioritize Visible Content
Ensure that the above-the-fold content (content visible without scrolling) loads quickly. This helps improve the perceived page speed for users.
#7 Contrast
Make sure your web elements are visible, enough space to be viewed, clicked on, on the accessibility side, I received 70ish score, after I gave “light gray text” on a medium gray background, once i made it black, it worked like a charm.
