Improving the speed of my site

Why does it matter?

Your online store speed is the time it takes the different pages in your store to load. It impacts the shopping experience of your customers, your conversion rate, and your store's discoverability.

Major Factors Impacting Performance

There are many factors that can impact your store performance (installed apps, your Shopify theme, the speed of your network, and the Shopify platform itself). This support article will address some of the major factors that you can take action on to improve your store's performance: Apps, content, and your theme.

Apps are the biggest factor that impacts theme performance

  • Each app adds its code to the theme which takes time to execute
  • Even apps that have been uninstalled can leave code behind that slows down your theme
  • Code customizations should be carefully added since “quick fixes” from tutorials can solve a problem, but increase thread work (e.g. adding an additional jQuery reference, adding <style> code in the theme.liquid file, adding Javascript, particularly with <script> tags)

By reducing the number of customer-facing apps vs. back-end apps (for example, apps for pop-ups and page builders vs. apps that connect to accounting or shipping services), you can significantly affect your site's performance.

Take care when removing apps, though, because many apps can modify your theme code and the changes remain even when you remove the app. The changes can impact your store's performance. To effectively remove an app's leftover code, first contact the app developer's support.

It’s all about content

  • The larger a page is, the longer it takes for a page to load
  • Images, in particular, take longer to load than text or other types of content
  • Larger images take longer to load
  • Some sections like videos (and to a lesser degree slideshows) can quickly impact your page speed
  • This doesn’t mean you should remove content from your site
  • Themes certainly impact your site’s speed, but they’re just one piece of the puzzle, regardless of where that report is showing up.
"Above the Fold"

You can have a big impact by simplifying your content "above the fold," which means the content immediately visible when your page loads. An example of simplifying this content would be to replace a slideshow with a single Image with Text section.

Images

The theme will compress and optimize your images.  You can confidently upload large, crisp images.  The theme will load the appropriate size image for each screen that is loading the site.  Mobile screens will get smaller images and large screens will get large images.  The theme uses Shopify's compression algorithm.  We don't recommend applying additional compression before uploading.  Compressing images twice can cause visible compression artifacts in the images without any gain in load speed.  Shopify adjusts their compression algorithm according to best practices.  

Links

Start by removing unnecessary redirects. It is vital that you check and ensure that you minimize the number of redirects within your site. Redirects tend to increase the number of requests within your site hence resulting in a higher load time, so make sure to minimize the number of redirects within your site. Redirects are managed within the Online Store > Navigation > URL Redirects section.

Next, you'll want to manually test your entire store for broken links (links that lead nowhere). This will improve page speed and customer experience.

Updating your theme

Updating to the latest version of your theme ensures that your theme has the latest version of components, from script libraries to Shopify features to page speed-specific enhancements. Support departments from every theme studio will recommend you start by updating to the latest version of your theme ( how to update your theme).

Shopify Speed Score

Shopify recently introduced an Online Store Speed feature which is displayed in the themes area of your store admin and in greater depth within your Admin > Analytics. Here is Shopify's own documentation on the Speed Score metric.

Problems with the report

  • Takes 1-3 days for the tool to update
    • Even though the speed report is positioned under the published theme, if you make changes to your store to improve speed or even switch the theme entirely the speed report will not automatically update
  • “Similar store” is defined in a way such that it might not really be “similar” to your store
    • Number of sales to date
    • Gross sales
    • Number of products and variants
    • Types of products
    • Traffic
    • Apps installed
    • Theme used
  • Shopify-required code slows down your theme and it can’t be removed
    • {{ content_for_header }} loads resource-heavy functionality through dynamic buttons, analytics, and other scripts
  • Lighthouse, the Google service that this tool is built on, consistently gives inconsistent scores
  • Your speed score is a score -- if you’re concerned about speed check its actual speed
    • GT Metrix is the best tool for checking your site speed. This is the best way to tell you if your site is slow or fast (3-5 seconds should be your benchmark for your home page)

Note about Speed Score fluctuations

Shopify's speed evaluation is based on data from Google's Lighthouse Web Developer Tools. These scores fluctuate based on a number of factors including internet traffic routing changes, testing on different devices, browser extensions, and antivirus software. Google has more information on their score variability here.

Additionally, the "Speed Score" itself can change over time without you making any changes at all to your theme, apps, or content. The reason is that the score is not a measurement of your store, but rather your store compared to other stores. The criteria for this comparison aren't fully transparent yet, and the comparison can take days to formulate, so it's still very difficult to identify exactly what changes result in a higher or lower score.