I'm a Front end developer and I'm very curious if there is more technique to optimize shopify store loading speed
Techniques I already Know:
Minify JS and CSS
Bundle JS and CSS in one file
Remove uninstalled Shopify app injected file
Update Shopify theme
Preload Web Fonts, CSS and JS
Add Google Tag Manager
I'm so excited to learn new web performance techniques for shopify stores
I am not Karl or Jason but here are my 2 cents, maybe I can help.
Your list is solid, good things in there.
I try to avoid large CSS and JS bundles and prefer progressive rendering: https://jakearchibald.com/2016/link-in-body/
<link rel="stylesheet" href="/article.css"> <main>…</main> <link rel="stylesheet" href="/comment.css"> <section class="comments">…</section> <link rel="stylesheet" href="/about-me.css"> <section class="about-me">…</section>
Don't limit the preload to fonts, CSS and JS.
Especially on product pages it makes a good difference to also preload the featured product image
Google Tag Manager is not always your friend.
Usually this is loaded async as it needs to run relatively fast for tracking purposes.
Async execute immediately once they finish downloading, this does not ensure that the HTML document is done being parsed.
GTM injected scripts may render block even if gtm.js is async.
- as a side note do keep an eye on what is added to GTM. At some point we've found 3 different versions on jQuery in there added by the marketing guys.
Compress images and use responsive images to deliver appropriate image sizes based on the screen resolution
<picture> is my fave here and Shopify img_url filters are great with it.
WebP from time to time can be used when opacity is needed, it doesn't play nice with Shopify but really good quality and size make this worth it.
And of course a big part of an optimization process is testing things out.
My tool of choice is https://www.webpagetest.org/
Hope it helps
There are several ways of optimizing Shopify Speed depending on the reasons.
Here you may find more tips on how to optimize a Shopify website.
There are several reasons why your website can load slowly. Let me clarify them:
#1 Too many Shopify apps installed. Solutions:
#2 Utilizing slow, unresponsive theme. Solutions:
Here is a detailed list of reasons and their solutions - https://wholesalenfljersey.biz/ecommerce/how-to-optimize-shopify-store-for-high-sales/