Concerned about your store’s performance?
Your store’s page speed is an important consideration, but don’t be too alarmed if you have a low performance score. We’re going to walk through what that number means, and give you some tools to get the most performance out of your online store.
Before we begin however, there is important context to remember. It’s best to focus on steadily growing your brand through engagement, conversions and retention with a long term vision. Performance is an important piece of that puzzle, but not the entire picture.
Consider this: a store with no features or media will likely have perfect performance scores and sell nothing, while the world’s most successful brands will have high conversion rates but varying mobile performance scores:
- Amazon: 54
- Apple: 48
- Lululemon: 27
- Yeti: 41
- Fashion Nova: 14
- Zara: 53
These stores are also hand built with a dedicated development team. While Shopify themes are built to accommodate a wide range of businesses with various settings. Those unused settings still have to exist in the code, adding some overhead to the store.
The most successful storefronts balance a mix of features and media that keeps potential customers engaged and moving through the purchasing funnel. In particular, ensuring performance is highest when your potential customer first visits your store, and adding features to drive a conversion when they express more interest—such as on the product page.
Although a score in the 35-65 range seems like cause for concern, you’ll be happy to know speed scores from Shopify or Lighthouse represent how fast your store runs on a slow 3G connection, simulating Android on a Moto G4 phone (which is about 13x slower than an iPhone 12).
How to improve your page speed
1. Only add apps if they improve conversions
Apps are the number one culprit when it comes to slowing down Shopify stores. Speedboostr found that Lighthouse performance scores dropped by 50% after installing only 4 apps in a storefront.
Some apps are better than others, so it’s important to determine how well the app is made and installed. Before deciding to add an app:
- Read reviews to see if they have a reputation for poor performance
- Observe your speed scores a week before, and a week after installing the app to determine if its benefits outweigh its performance costs
- See if you can replace the app with a native feature, such as translations or quick-add buttons
- Consider if you can add the feature without an app using a Shopify Expert like HeyCarson
2. Limit the amount of sections or HTML on each page
Stores with many sections are made with more HTML, and more HTML means more information to transfer, and render on screen.
That’s an important fact to remember as consumers increasingly consume media faster. That’s why the goal of your home page should be to quickly deliver content and grab their attention.
By limiting the number of sections on the home page you can prioritize speed when your consumer is undecided; leaving call-to-actions to lead them to the collection and product pages.
Another way to reduce HTML is to limit the number of products or images you include inside a slideshow or grid section.
3. Consider performance intensive features
Our themes include features such as Buy It Now buttons, Quick Add buttons, and Shopify Markets (country selectors). Although these can be powerful tools for your store, you have to always consider the impacts each of these has on performance.
For example, the Quick Add button can remove friction from the customer journey, but if most of your conversions are via the Buy It Now button then the performance cost of the former might not be worth it.
Similarly if 95% of your sales are from 3 markets, it might not be worth the performance cost of a country selector with 100 markets when you could cover your basis with just a few.
4. Reduce the usage of large videos
One of the biggest things to load on an e-commerce store are videos, and unfortunately that means they’re slowing you down a lot. However like everything else, there are trade-offs.
Videos can be a useful story telling tool once you have a user’s attention. This makes the product page a natural fit using the Featured Video section or a product video itself.
If you are going to use an autoplay video on the homepage, ensure it’s something that isn’t too long and loops so that it plays indefinitely without skipping.
5. Hire an expert to audit your theme
There are times when you need to have your cake and eat it too. Performance, apps, features, media, the works.
At this point, you need to get under the hood of the theme so that your code can load and run in an optimal way. We recommend you reach out to a Shopify Expert like HeyCarson so that they can personalize your store.
Performance considerations inside your theme
We are constantly thinking of ways we can make our themes more performant while balancing out the types of features and user experience we can provide. Among the things we are doing are as follows:
- Lazyloading images, videos, and scripts out of the box, and will move to native lazyloading once Safari has more support
- Making JavaScript and CSS more modular, so that extra resources aren’t loaded if they aren’t needed
- Integrating new browser technologies into existing features
We’ll continue to add settings and improve our code to make our themes faster over time. Only you, however, can determine how you want to configure the theme to find that balance of performance, features, apps and media.