Okay, so today I decided to mess around with Lighthouse to see if I could improve the performance of one of my pet projects. It’s been a while since I last did a deep dive on this, so I figured it was time for a “revision,” as I’m calling it.
First things first, I needed to run a Lighthouse audit. I just opened up Chrome DevTools, you know, by right-clicking on the page and hitting “Inspect.” Then I clicked on the Lighthouse tab. Simple enough, right?
I made sure to select all the categories – Performance, Accessibility, Best Practices, SEO, and even PWA, just to get the full picture. Then, I hit that “Generate report” button and waited for it to do its thing.
Boom! The results came in, and honestly, they weren’t pretty. My performance score was kinda low. I saw a bunch of red and orange warnings, and that sinking feeling started to creep in. But hey, that’s why I’m doing this, right? To find the problems and fix ’em.
Digging into the Details
I started scrolling through the report, looking for the biggest offenders. “Reduce initial server response time” was screaming at me. Seemed like my server was taking its sweet time to respond.
Next up, “Eliminate render-blocking resources.” This one is always a pain. Basically, it means some of my JavaScript and CSS files were slowing down the page load. My images were another problem – “Properly size images” and “Serve images in next-gen formats.”
I also saw some issues under Accessibility, like low contrast between text and background colors. Okay, definitely something I need to fix.
Time to Get My Hands Dirty
- Server Response Time: I’ve a shared hosting, so maybe it is time to upgrade hosting plan.
- Render-Blocking Resources: I tried the `async` and `defer` attributes to some of my scripts, that should fix render-blocking resources.
- Images: I used an image optimizer, and it dramatically reduced the file sizes without losing, like, any noticeable quality.
- Accessibility: I adjusted the color palette to make sure the text was easier to read.
After making all these changes, I ran another Lighthouse audit. Keep my fingers crossed!.
And… much better! My scores went up significantly. There are still a few things to tweak, but it’s a huge improvement. This “revision” was definitely worth it. I’ll keep working on this stuff, but for now, I’m feeling pretty good about the progress.
