Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hi There,
While our previous non-shopify site loaded a couple of libraries, we were able to force all other js into a single theme.js file, and reduce the number of file requests per page load.
Is there a way to do this in Shopify?
If not, can I make a feature request for a system where apps register their js and css, and Shopify has a way of concatenating and minifying everything to serve a single, site-wide theme.css and site-wide theme.js file?
Our little shop is currently loading 28 separate js files which seems crazy for what it does.
Cheers
you can call that js based on that page.
or you can marge into one file it will increase the score
Hi Ben31,
All Shopify core files and app files are stored in the {{content_for_header}} variable.
It is not desirable to edit this variable. It is possible, but this may lead to unforeseen circumstances in the future. But all third-party js files that are connected outside the content_for_header can be combined.
To begin with, a large number of js files depends on the theme and the number of installed apps. If you have a lot of apps, there will be a lot of js connections. But sometimes it happens that the theme itself is not optimized. Can you please tell me how many apps are installed at your shop and the name of the theme? Also, if you can share the URL of your shop with us.
Hope that helps you.
Best Regards,
Aibek
P.S If you wish our agency can help you with optimization, you can subscribe here: https://mailchi.mp/d3382f3c7380/7xc6wdulhe
Applications JS files are injected via {{ content_for_header }}. Without doing a massive hack, you can not touch those.
You can bundle your theme JS files. You can do it manually (time-consuming) or have a build system in place that will do this automatically on every deployment.
But there is more to it. Do you want all of your JS files bundled to be served on a page that only uses 10% of what is there?
For me, this does not make much sense in 2021. With a massive bundle, you lose control of what you want to serve.
It makes more sense to load only what you use and control exactly when and how you want those files to be loaded (blocking, defer, async).
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024