How to fix unused JavaScript in PageSpeed Insights?

[TomStarkey]

Hi all, I'm a bit stumped here and could do with some help if at all possible. Through PageSpeed Insights I've got a ton of unused JavaScript I just can't seem to rectify. Any help would be much appreciated. 

[JoesIdeas]

To remove unused javascript, here's the path I usually take:

1) Remove any old app code (when you delete an app it loses access to your store, so it can't clean up after itself if it added code to your theme). You can usually find most of this in theme.liquid. You can also look at all the requests loaded (like in your screenshot) to help identify if any of the resources are from apps you no longer use.

2) Next up, for any resources that you have control over, you'll want to conditionally load them to where they're needed. For example, if you have an app / resources that are only needed on the product page but loaded on every page (from theme.liquid) wrap them in a Liquid statement to only load them there:

{% if template contains "product" %}
  put any code for product pages only here
{% endif %}

3) It's not practical and rarely a positive ROI in my opinion, but next up you can dissect theme files that contain code for all templates, and separate into separate files so you can load them conditionally (as in step 2). For example, you could split vendor.js into vendor-globla.js, vendor-home.js, vendor-product.js, etc.

You'll still likely end up with warnings because you don't have access to 3rd party app code. The estimated savings of 4.89s is not realistic. In actual cases, by removing some code it might help load speed a little, but not by much, definitely not something you would notice.

[TomStarkey]

Hi, thank you for taking the time to respond and help. I will certainly look into these this evening.