Hello Everyone, in this article, I will show how you can calculate pwa score for your progressive web app. For those who are wondering with the term, Progressive Web App is an enhancement of a web app with features like offline availability, app feeling, homescreen icon, push notifications. For more discussion about PWA, check out PWA.
PWA Score is a number which will tell how close is your progressive web app to an ideal progressive web app. You will also get detailed result on how you can improve your result in case. PWA score is powered by Lighthouse. It provides assesment for other data as well like performance, accessibility, best practices.
So, this can be done with the new Audits Panel feature in Chrome 60 dev tools.
Let’s see it then!
1- Go to your laptop/desktop machine.
2- Open Chrome(updated version 60 or more).
3- Open the website you want to calculate the pwa score.
4- Open Dev Tools(Ctrl + Shift + I) or right click on somewhere your webpage and Choose Inspect Element.
5- Choose Audits tab in the dev tools.
6- Click on Perform an audit button.
7- Keep all the options(Progressive Web App, Performance, Best Practices, Accessibility) checked and click on Run audit button.
8- Wait for sometime until the Audit is complete.
9- When the Audit completes you will be presented the data about Progressiveness, performance, accessibility, best practices.
1- Go to Lighthouse tool page and Install Lighthouse chrome extension.
2- Open the website you want to calculate the pwa score.
3- Click on Lighthouse extension in chrome.
4- Click on Generate report.
5- Wait for sometime until the Audit is complete.
6- When the Audit completes you will be presented the data about Progressiveness, performance, accessibility, best practices.
As you scroll down, you will see the respective fixes if any. Go ahead and make a great Progressive Web App.
Also you can check out this awesome Automatic PWA Converter Platform to build progressive web app of your platform on the fly.