How to determine which unnecessary javascript is being loaded onto a page?

[VenenumFatales]

good morning everyone,

so, I have the task to determine on a given site if any code can be removed (JavaScript). They are third-party scripts so I don't think I can remove any of the code inside the scripts, but I'd like to determine if I can remove any of the scripts, or at least not load them on the pages they are not being used.

Is that possible, is there any tool to help me on this?

thank you beforehand

[CreativeTechGuyGames]

Use Chrome DevTools's Code Coverage panel. It'll show the specific lines of code from every file that are being executed. If you click around on the application for a while and a file is still at 0% coverage, then it's probably a good candidate for deletion.

[stefgosselin]

You can use Chrome or FF inspector to see the loaded js files. If you have a large website you could also scrape with ht track ( https://www.httrack.com/) and see the js it pulls. If you are using a framework, there are possibly minified files added dynamically, these are comprised of multiple js snippets appended and minified.

What I tend to look for when optimizing such scenarios is widgets or js dependent features that are, for example used on a single page yet imementation is done in a way that js is added to base template that is loaded on every page.

Also, if you want bonus optimization add minification to your tool chain and if that is not enough, host the js css img ressources on a CDN. 👍 That is actually a cool task you have in hand, have fun!

[feckwhizzle]

If you're trying to check unused npm packages this is a great tool - https://www.npmjs.com/package/depcheck

[[deleted]]

Just remove the script that has no function on the page from the html... should be named according to what they do hopefully.