DEV Community

Cover image for What is the lighthouse score of your porfolio/personal website (and why)?
Corentin Bettiol
Corentin Bettiol

Posted on

What is the lighthouse score of your porfolio/personal website (and why)?

I want to discover new portfolios, and in order to do it I want you to post and discuss your lighthouse score.

For thoses who don't know what I'm talking about, here's the doc for lighthouse.

Top comments (6)

Collapse
 
_garybell profile image
Gary Bell

Desktop: 83, 95, 92, 100
Mobile: 45, 95, 92, 98

It's hosted by Ghost using a default template, so could be better if I spent some time configuring it myself.

Main issues:

  • improperly sized images (due to using unsplash for the most part)
  • inefficient cache policy
  • Old jQuery library

To fix the issues I would need to download all of the images I use from Unsplash and resize them. Given that my personal site has 95% of traffic coming from desktop, it's not a pressing matter for me.

Collapse
 
corentinbettiol profile image
Corentin Bettiol • Edited

I'll start:

Here's my portfolio/personal website (in french): l3m.in.

And here's it's lighthouse score:
lighthouse

This website is built using only vanilla php/html/css (and a scoop or two of js in the admin panel), with a focus on speed and SEO. I recently added cover images for my posts, but the images where too big and lowered my score. So today I reduced the width of the cover images, and the "100" performance score is back :)

Collapse
 
joelbonetr profile image
JoelBonetR 🥇 • Edited

It's a hard task to maintain the 100 score for long time and specially on big web apps or even little ones that need some scripts for analytics but trying it with a portfolio is a good exercise to practice it a bit and see the limits and the weights for each point on those kind of metrics.

In addition to my comment before I'll let you here my documentation about the entire workaround I followed :)

Collapse
 
corentinbettiol profile image
Corentin Bettiol

I read your post (great & valuable content!), and here's what I did for my site:
Steps 1 Wireframing (pen and paper), 3 Choosing a webhosting, 4 Setting up your hosting, 5 Preparing the version control service (Git), 9 Gitignore, 14 Deploy to production, and 15 Optimization.
The thing is I don't used any framework or bundler, since I don't really use javascript on my site other than for my tiny wysiwyg editor in the admin panel:

wysiwyg panel

Thread Thread
 
joelbonetr profile image
JoelBonetR 🥇

Bundlers also take care of html and css optimization (they minify too), also I use Sass on dev time for obvious reasons and the bundler transpilates it into css.

Collapse
 
joelbonetr profile image
JoelBonetR 🥇 • Edited

When I re-made it some months ago it was 100, 100, 100, 100.

Now it's 98, 97, 100, 100 because they update the algorithms from time to time and I'm not earning a penny from it so I'll update it when I've time and feel like 😆

Here's the report