PWA Score, the forgotten Lighthouse Metric

Google Lighthouse (testable from browser extension or pagespeed insights) generates scores across 5 categories. Performance, Accessibility, Best Practices, SEO, and PWA.

Most sites opt to overlook the PWA score, which makes optimizing it a competitive advantage! Fortunately, Google makes it very easy to get a perfect score.

What is the PWA Score?

Google is testing your site for ‘an app-like experience’. What sets an app apart from a traditional website? It’s installable, it’s fast (no long wait times between pages), and it’s reliable (no erroring on current/home page when offline).

How is it scored?

The PWA category doesn't get a 0-100 score, but instead is evaluated in 3 separate groups: Fast and reliable, Installable, and PWA Optimized. In order to satisfy each grouping (and get the associated badge), every audit within the group must be passing.

How do I know what to do?

Google has been generous enough to outline the requirements for each category, along with implementation techniques, at web.dev. Additionally, you can run Lighthouse against your site and get a list of what passed/failed along with links to Google’s knowledge articles to implement any improvements (see example from Lighthouse below).

Can I get a quick overview of what I’ll need to do?

For the link averse, let’s do a high level walk through:

Fast and Reliable- 

• Time to Interactive on 4G/mobile has to be under 10 seconds.

• This should be a goal regardless, as it impacts your Performance Score and user experience dramatically.
  

• Current Page and start_url don’t generate a 200 when offline

  • • This is merely a service worker that caches these two pages so that offline experience still works.
    • Bonus- If your site is a Single Page Application, the ‘start_url’ will be the home page which includes all other pages! A user will be able to use your site from home to cart, with only the checkout requiring internet connection.

Installable-

• Uses Https
• This should be standard practice for security purposes
• Register a service worker
• This only takes a few lines of code, and unlocks the more advanced features of the PWA score like installability and offline mode
• Web app manifest
• 5 pieces of information must be present in the web app manifest, again simple code additions here

PWA Optimized-

• Mostly small one-off items related to appearance and http to https redirects
• Though this section will be the most cumbersome, it is ‘set it and forget it’
• You will still be ahead of the pack checking off installable and fast/reliable, this icing on the cake and will vault you into the highest echelons of the check mark badge