How to understand (and improve) your store's page load speed

As an online merchant, you know how important speed is to the success of your store. Even a  two-second delay can drastically reduce page views, customer engagement, and conversions—not to mention the toll it can take on your search results.

Basically, it pays to invest the time to make your site as fast and accessible as possible. 

Gauging the speed of your store

There are some great tools out there for analyzing the speed of your store, but before we get to those, let's cover some basics. Like... what is the biggest factor contributing to page load speed?

In a word, size.

The more components on a page, the longer it takes to load. Each new feature you add (be it an app or a section or a fancy little embellishment you just have to have) requires a new script or stylesheet that weighs your site down just a little more. 

Remember: a fast site is a lean site. 

Speed tests

So, how do you know if your site is more of a rabbit or a hare? Well, besides breaking out your stopwatch and making your homepage do wind sprints, there are a bunch of online resources you can use.

Google's PageSpeed tools are some of the most popular, but services like GTmetrix and Website Grader will also give you a strong starting point. All of these will quickly analyze your store and tell you where you stand.

Here's an example of the results we see when we run one of our Launch demos through Google's PageSpeed Insights:

Note: Google's standards are incredibly high, and it can be daunting to complete everything the speed service recommends (heck, we're professionals, and we still have plenty of room for improvement!). The important thing is that you're thinking about these optimizations and working to improve the user experience for your customers!

Decreasing page load time

Okay, so now that you have an idea of what your page load speed is, what can you do to reduce it?

1. Optimize media

Images and videos make up the majority of weight on most online stores, but the good news is they're one of the easiest things to optimize.

If you're adding images to your store, make sure you scale them before you add them to your store. For example, if your theme displays product images at 600 x 600 pixels, scale down that 2000 x 2000 image so you don't force your site to load more than necessary.

Another thing you should do is compress your media. You can do this by saving your images for web in Photoshop (this compresses them down to the lowest acceptable file size) or using a tool like  Pixlr — a super user-friendly smartphone app that lets you edit and compress images on the go.

2. Keep plugins and apps to a minimum

The old adage "less is more" has never been more true than when it comes to site speed and plugins/apps. The fewer "extras" your site has to load, the faster your page will load and display.

Do an audit of your Shopify admin and delete any unused and unnecessary apps. A lot of the times we see stores with five apps that essentially do the same thing. Even if you aren't using them, they take up space in your scripts and stylesheets, and you're better off without 'em. Cut the deadweight! 

Note: Deleting an app isn't always as simple as clicking the trash button. Check your theme files to make sure there's no lingering code that could be dragging your site down from the sidelines.

3. Be selective with sections

Hey, we get it— sections are pretty great. They let you add all kinds of neat features to your store, including videos, slideshows, and signup forms. They're super customizable and powerful and fun, but they can add a ton of weight to your site if you're not careful. 

Just because our themes come with a ton of sections doesn't mean you have to use all of them. Be selective.

Rather than using a super hi-res carousel, consider replacing it with a single (optimized) image. Rather than stacking your homepage with bandwidth-sucking videos, use a short clip and only play it when a customer activates it. A good rule of thumb: don't include anything that isn't working hard to engage and convert customers.

4. Think beyond the homepage

Yes, your homepage is important. Yes, the above-the-fold area is extra important. But that doesn't mean you need to pack all your content into that single parcel of coveted real estate. 

If you have more videos and images than can reasonably fit, consider spreading them out onto other pages. There's no limit to the number of pages you can create and display on Shopify, so think about how you can divvy up your content while making it easy for customers to still access it.

Understanding Shopify's limitations

No matter how diligent you are at executing Google's recommendations, there are some things that are just really tricky to fix. Things like "render-blocking Javascript and CSS"—our developers have worked hard to improve this in our themes, but Google can still flag some of it.

If you're getting a Minify CSS or Minify JavaScript notification—our demo did!—you might want to check out the  Minifier app. (Minification essentially strips out all the extraneous information that make it easy for humans to read and write but that aren't needed by your browser).

And if you're getting any other warnings you don't understand, feel free to  reach out to our support team. We're always here to help!