How can I safely improve my site speed by removing unused JavaScript?

[smallerliving]

Good morning,

I am new here. I have a site https://smlvg.com and have been working it since June of 2022. I am currently tackling my site speed. It is my biggest pitfall right now as I have a bunch of unused javascript that I need to rid of if I can. I have some knowledge on how, I just want to be sure that I am doing this correctly. I don't want to crash!! Any and all suggestions would be greatly appreciated. 

Thank you in advance! I hope to help others here as well if I can.

[JohnE10]

Hi,

You mentioned that you've been working on your store since mid 2022, have you installed and then removed some apps? One of the things that significantly affect the load speed of a Shopify store is residual javascript code that's left over after an app has been uninstalled. So, I'd check that first.

Also, if there are any apps that are installed but are no longer used or are not absolutely necessary to run the store, then I’d remove them. The less apps in the store the better the store performance.

In the PageSpeed Insights "Diagnostics" section, one of the culprits is “Reduce the impact of third-party code. Third-party code blocked the main thread for 8.130 ms”, there’s a very good chance that the cause of this stems from apps.

For apps that are indispensable to the store, not all need to load at the same as the store. Apps with widgets below the fold, for example, do not need to be displayed right away and could be deferred so that they don’t hold up the loading of your store’s core vitals.

There’s also the possibility that some Shopify scripts themselves could be deferred and thus allow your store to load faster.

Another culprit in the “Diagnostics” section is: “Largest Contentful Paint image was lazily loaded”. This means that your banner image is being lazy loaded when it shouldn’t be. Lazy loading is a must for images, but only for those below the fold. Images that appear on the screen as soon as the store loads shouldn’t be.

Another culprit is: “Image elements do not have explicit width and height”. Fix this by making sure all your images have a value for “width” and “height”.

There may be other fixes that will need to be implemented as well, but this alone should get you started and significantly improve your store’s load speed and thus your PageSpeed Insights score.

Keep in mind that this will require some basic knowledge of coding, if you do have some, then fixing this shouldn’t be an issue, if you’d rather not deal with code, then let me know as I may be able to help. Contact info in signature.

Cheers,

[smallerliving]

Great, thank you! I thought these might be the steps but just wanted to be sure I was on the right track. Also, do you know what "other resources" is and how I can find out. It is third party code blocking load. Example below. 

I assume being it is shopify it is needed but wow! I have others too and was wondering where I can get those details?

Thank you!

[JohnE10]

Those look like apps. They'll need to be removed or deferred if they're needed at all.