0

I ran a lighthouse audit on the page via chrome dev-tools and got a very poor performance rating...

The unused JavaScript code is causing the score to fall.

The unused JS is mainly the node-modules functions & commented out code present in JS files present in node modules. Below is an example of that: Coverage report showing unused JS

LightHouse score: here if you see the largest contentful paint, time to interactive and speed index are very poor, what Is causing this? I'm barely even doing anything.. Score

Lighthouse report Opportunity

How can we handle such unused Javascript code which is affecting the performance? Thank you!

I have uninstalled unused node-modules and dev-dependency from application.

  • As suggested by lighthouse (in the last image you posted) you could look into [lazy loading in React](https://beta.reactjs.org/apis/react/Suspense) (lazy/Suspence). There are also concepts like [tree-shaking](https://developer.mozilla.org/en-US/docs/Glossary/Tree_shaking) you could read up on. Then there is [above the fold rendering](https://stackoverflow.com/questions/18340402/what-is-above-the-fold-content-in-google-pagespeed). – Bqardi Nov 01 '22 at 05:54

0 Answers0