Code Movement

Chrome Lighthouse For Quality Applications

I am a big fan of automated tools that help you improve the quality of code. One tool that is particularly useful is Chrome Lighthouse.

In Chrome navigate to a web page you want to improve the quality of, right click the web page and click ‘Inspect’. Click on the tab that says ‘Lighthouse’, it may be under the minimized menu, ‘»’.

On this blog when running the report with all of the categories checked and Desktop selected I received a 100 for ‘Performance’, ‘Best Practices’, ‘SEO’ and an 89 for ‘Accessibility’. Clicking on ‘Accessibility’ or any of the other categories that can be improved, you can see the suggestions and links to how you can fix your application to improve the score.

One of the suggestions was that the time elements for the dates of each blog post on this site were too light of contrast. As a result I was able to change the color of the text from #a9a9a9 to a darker gray, #231010, and rerun the lighthouse audit passing that accessibility test.

Lighthouse is great tool to help you improve you application quality. I have found that managers enjoy seeing the results of the report, and are eager for team members to take it upon themselves to improve the score over a sprint or two, as many of the suggestions are easy to implement and can have huge impact on customers.