Improving your online store speed

Several factors impact your online store speed, some of which you can control.

If you don't know how fast your online store is performing today, then you can view yourOnline store speedreport.

Factors you can't control

Your customer's device, network, and location

Customers who visit your store live around the world and have different devices and internet connections. This means that your store might load faster or slower for them depending on these factors.

If a customer contacts you about the speed of your store, then ask your customer to check that they're on the latest version of their browser, they have recently cleared their cache, and their Internet service provider isn't experiencing any outages or degraded performance.

Shopify infrastructure

Shopify hosts your online store onfast, global serversand doesn't limit your store's bandwidth. You can check the status of your Shopify store onShopify Status.

Shopify is constantly making improvements to its code and infrastructure. Some of these improvements might be reflected in your speed score.

Below are some features that affect the speed of your online store.

内容分发网络(CDN)

CDN stands for content delivery network. Shopify provides merchants a world-class CDN run byCloudflare确保你的在线商店快速加载欧宝体育官网入口首页around the globe. You can check the CDN status on theCloudflare status page.

Local browser cache

Your store caches, or saves, some elements on your customer's local storage temporarily. The next time your customer visits your online store, the browser can load resources from the cache instead of sending another request to the server.

Shopify sets browser caching for cacheable resources in your store to one year for each file. Files that can be cached include image files, PDFs, JS files, and CSS files.

Server-side page cache

In addition to local browser caching, Shopify caches pages on the server side. The first time a page is loaded, it might be slower, but later page loads are faster because customers are receiving a cached copy.

The assets inside thecontent_for_headerLiquid object

The `` Liquid object injects assets used by a variety of online store features, including performance analytics and optional features like dynamic checkout buttons. Loading this object and related assets has an impact on the speed of your store. Shopify is optimizing the tag and its assets to make it faster.

Factors you can control

Below are some factors that might impact the speed of your online store, and how you can address them.

Apps

When you add apps to change the functionality or appearance of your online store, they add code into the theme so they can run. Some code can be removed or reordered to improve your online store's performance. If you're not using an app, then you can remove it.

If you think that an app is slowing down your store, then take the following steps:

• Disableapp features you don't use, or remove the app if you don't need it. Consider thebalance between online store features and speed.
• If you're removing an app, then consider removing code that was added as part of the app install process. Some apps help you with this process by wrapping their code in{% comment %}tags that mention the app name. Removing unused app code is a best practice that avoids running code for unused features, and makes your theme code easier to read.
• Consult your app developer.
• Hire a Shopify Partner for further assistance. Learn more abouthiring a Shopify Partner.

Themes

Themes are made up of Liquid, HTML, CSS, and JavaScript code. When you edit or customize themes, file sizes can increase and affect your store speed.

If you think that something in your theme is slowing down your store, then take the following steps:

• Disabletheme features you don't use. Consider thebalance between online store features and speed.
• Consider using asystem font.
• Consult your theme developer. If you use afree theme from Shopify, then you can contact support for guidance.
• If you use a third-party theme, then you can contactyour theme developeror hire a Shopify Partner.
• Consider installing a theme that's optimized for performance, such asDawn.
• Hire a Shopify Partner for further assistance. Learn more abouthiring a Shopify Partner.

主题或应用features

Certain features, when activated, might also affect your store speed. For example, some quick view pop-ups pre-load information from every product page when a collection page loads. Loading extra data your customers aren't using can impact your store speed without adding value.

If you think that a feature is slowing down your store, you can take the following steps:

• Use aheatmap toolto view if customers are using certain features. Deactivate features if they're not being used.
• Deactivate the feature if you don't need it. Consider thebalance between online store features and speed.
• Consult your theme and app developers and ask if they're preloading data.
• Hire a Shopify Partner for further assistance. Learn more abouthiring a Shopify Partner.

Complex or inefficient Liquid code

You can edit almost all of the Liquid that is used to render your store. There are efficient and inefficient ways of writing Liquid code. Doing complex operations repeatedly can increase your Liquid render time, which impacts your overall store speed.

For example, if you want to order the products in a collection by price, then you should do that before you loop through the products in your collection, and not as part of the loop code. This is because the order of the products does not change for each product, and calculating the order of the products adds processing time to the request.

If you're concerned that your code isn't optimized, then you can take the following steps:

• Run theShopify Theme Inspector for Chrometo identify the lines of code that are slowing down pages in your online store.
• Hire a Shopify Partner to help you to find inefficient or useless code.

Images and videos

Oversized images and images that are hidden from view can interfere with loading other, more important parts of a page. If users have to wait for large images to load, then they might perceive your store to be slow.

Shopify adds some safeguards to prevent you from overloading your online store with images or videos. For example:

• You can't have more than 50 products on a collection page or 25 sections on your home page.
• Many themesdeferloading images that aren't currently onscreen.
• Many themes also load a specific size of an image based on the screen size it's displayed on.

However, these safeguards don't entirely prevent images or videos from impacting your online store's performance.

If you think that images are slowing down your store, then take the following steps:

• Review theimage optimization guide.
• Keep slideshows of featured images to 2-3 slides, or use one featured image.
• Consult your theme developer for their advice on the best way to use images with their theme.
• Hire a Shopify Partner for further assistance. Learn more abouthiring a Shopify Partner.

Fonts

You can choose from several fonts for the text in your online store. However, if you use a font that does not yet exist on your customer's computer, then the font has to be downloaded before your text can be displayed. This impacts the time that your store takes to load.

To avoid downloading a new font to your customer's computer, you can use a system font. A system font is a font that is already installed on most computers.

You can select a mono, serif, or sans-serif font family. You can still use font styles, such as bold or italic, when you use any of these font families.

The font that displays on your customer's computer depends on their operating system. Below are some examples of the fonts that might be used to render text when you select a system font family:

• Mono: Menlo, Consolas, Monaco, Liberation Mono, or Lucida Console
• Sans-serif: BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, or Helvetica Neue
• Serif: Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times, or Source Serif Pro

Troubleshooting tools

You can use the following tools to investigate your online store's speed.

If you're a developer, then you can further optimize your theme for performance using Shopify tools and best practices. Learn more onShopify.dev.

Lighthouse

Shopify'sOnline store speedreport uses Lighthouse to measure the speed of your store. You can run your own Lighthouse report usingGoogle PageSpeed Insightsto view more detailed metrics for pages in your store. To learn about what these metrics mean, refer to theGoogle Lighthouse performance scoring documentation. You can also hire a Shopify Partner to help you understand the metrics and suggest improvements. Learn more abouthiring a Shopify Partner.

Shopify Theme Inspector for Chrome

TheShopify Theme Inspector for Chromeis a profiling tool that uses a flame graph to display Liquid render performance. This tool helps you to identify the lines of code that slow down pages in your online store. Learnhow to usethe Shopify Theme Inspector.

Get support with online store speed

If you use afree theme from Shopify, then Shopify Support might be able to assist you with basic performance improvements.

If you use a third-party theme and need assistance, then you must contactyour theme developeror hire a Shopify Partner. Learn more abouthiring a Shopify Partner.

If you have a development team or agency partner, then you can also reach out to them for further assistance.