Everyone is excited about the announcements from Shopify Unite, including Online Store 2.0 and sections everywhere (finally!) but what do they mean for site speed? Will their new Dawn theme help make stores load faster?

Let's start with clarifying what's been announced. Online Store 2.0 brings with it a host of new enhancements for website management and developer experience.

For website management, Shopify has finally given us something called "sections everywhere" which means every part of a storefront website can be customized by a non-developer using Shopify's Theme Editor interface by adding sections any place on the website (as long as theme permits this).

Prior to this update, sections could only be placed in certain spots and were usually limited in many ways. This "sections everywhere" update facilitates another important update relevant to this article: Theme App Extensions.

Theme App Extensions will help improve performance issues that plague Shopify Apps

The most common suggestion for how to improve storefront performance issues is reduce the number of Shopify apps and third party code that has to load. With Online Store 2.0, Shopify Apps may no longer be such a hurdle of performance issues (but third parties will still be). This is because prior to the update, the only way apps could change the way your website looked or behaved was mostly through JavaScript, which is a performance killer because JavaScript runs on your device, slowing it down as the page loads. With Online Store 2.0, apps can now utilize Shopify's Liquid code to add themselves to your website. Since Liquid code runs on Shopify's servers, that means your visitors will have less heavy code that slows down their devices.

This is, however not a panacea for web performance issues, and ultimately I believe will make only a marginal improvement.

Ok, what about their new Dawn theme? How does that help with site speed?

Another exciting announcement from Unite was Shopify's new Dawn theme. Shopify themes are the code and files that power Shopify websites, and when Shopify releases new themes, that helps everyone who builds Shopify websites have a foundation to build on top of. Not only does Dawn include the updates needed to utilize Online Store 2.0, but it also has been tuned for performance according to Shopify.

That's great! But Dawn doesn't use any new features that Shopify doesn't already offer for web performance. It simply has been written from the ground up to use modern web performance best practices. It therefore serves as a reference for other theme developers on how to write themes utilizing the latest and greatest features web browsers offer. So to take advantage of the performance updates in Dawn, merchants will need to use themes built on top of Dawn, and their developers will need continue the modern best practices set precedent by Shopify in Dawn.

Which brings us to our next big announcement during Unite. The Shopify gods have gifted us two very helpful tools that should help developers make performant themes by default.

New developer tools to help diagnose and prevent web performance issues

Nothing Shopify announced will automatically make Shopify websites load better by default, but new tools have just been released that help Shopify theme developers figure out why the code they're writing might slow down websites. This is great, because ultimately, developers are largely responsible for why websites are either performant or not.

The new tools to help developers create more performant themes are:

Theme Check

Theme Check is a tool that checks the theme code that developers write to ensure it doesn't have performance issues, amongst detecting other potential code issues. Think of it as spell checker for code.

Developers can get Theme Check here: https://github.com/shopify/theme-check

Shopify Lighthouse CI

Shopify Lighthouse CI is a performance checking tool that runs before a developer deploys a theme to a Shopify store. It acts as a gatekeeper to ensure new updates to a theme pass a certain threshold of performance, or otherwise rejects it. That way, developers can make sure they don't slow down a website when they push out new updates. Not only that, this tool also checks for SEO and accessibility issues as well, so it's very much worthwhile to use.

If you have a development team, you should absolutely ask your developers to implement these two new tools for your store's theme codebase. There's no downside at all to using these new free tools. They will help prevent many classes of site speed issues and make it a lot easier for developers to write better code.

Developers can check out Shopify Lighthouse CI here: https://github.com/Shopify/lighthouse-ci-action

We recommend theme developers to start using these two new tools immediately. They will become critical for developing performant and accessible themes going forward. It's kind of like having another developer on your team, giving you a second pair of eyes to make sure every piece of code is written with performance in mind.

Optimizing site speed is difficult

Web performance is one of the biggest concerns for ecommerce brands since reducing load times by even a few seconds can reduce bounce rates by 32%, helping to increase revenue and prevent wasted marketing spend. So important is this that Google has begun factoring web performance into search rankings with their Core Web Vitals update.

There's no free lunch when it comes to site speed, but the new announcements will certainly help make Shopify sites faster and more responsive. As a merchant, you're likely reading this blog post looking for answers. Ask your developers to check out this post and utilize the new features announced by Shopify so you can get the most out of Shopify.