We all want faster loading websites — every second delay increases bounce rates and site exits which hurts conversion and revenue.

If you sell on Shopify, choosing a fast performing theme is critical to keeping customers sticking around.

But that’s just the beginning. It’s also what you add into your Shopify store that impacts performance. And Shopify apps are the single biggest reason a theme performs slower than it should.

Why Shopify apps slow down your site

Along with CSS, JavaScript files are often “render-blocking” meaning that the browser must download, parse, compile and execute them before it can continue loading other site content.

When too many scripts compete with each other and your DOM (Document Object Model) is not configured to prioritize how these scripts load relative to other assets, you can get some serious slowdown that users can feel.

JavaScript can also hog browser memory, especially if it’s poorly coded.

How Shopify apps can add code bloat

Poor code quality

Not all apps are coded efficiently, meaning this code becomes part of your website experience. For example, they may contain large asset files or make a larger number of external requests to fetch data than necessary. They may also be using outdated, heavy JavaScript libraries.

Too much functionality

Apps may include more features than you actually need or aren’t even using, but the extra code loads anyway. Features may also overlap with other apps you’re using.

Too little functionality

On the flipside, you may be using 2-3 apps to achieve what a single app could do, increasing the risk of code conflicts while pages load.

How Shopify apps can impact Core Web Vitals and SEO

Google tracks your site experience through its Chrome browser and makes note of how fast your site renders content to your visitors.

It uses this data as part of its search algorithm. Poor user experience can cost you search rankings.

Google shares this data through Page Speed Insights for any given URL or site origin. Part of this report is its 3 “core” web vitals:

Largest Contentful Paint (LCP)

This is the largest above-the-fold element, which is often a hero banner or product image. But apps can also inject content that Google detects as the LCP, such as cookie banners and email pop-ups if not implemented correctly.

You want your LCP asset to load as fast as it can by compressing, preloading and eager loading these files, and ensuring unnecessary scripts (especially from apps) are loading before it.

Interaction to Next Paint (INP)

This measures the time lag between a user clicking something and seeing a visual update to the page. It’s reported as an average across interactive elements.

Poorly coded apps can contribute to this delay across interactions.

Cumulative Layout Shift (CLS)

You may be using app blocks to embed app content inside your header, template or footer sections of your theme to enhance user experience. But late-arriving JavaScript can cause other sections of your page to shift around as it pops in – aka “layout shift.”

Google doesn’t mind if a little shift happens occasionally, but if enough shifts happen at once, you’ll fail your “cumulative” layout shift score for any given page.

Tips for minimizing the page speed impact of Shopify apps

Find what’s slowing your page

It’s a good idea to take inventory of all your apps, remove any you’re not using and review those that show up in your Page Speed Insights report.

Expanding these accordions reveal more detailed information on what’s dragging your site speed, particularly the “Reduce JavaScript execution time” tab.

For instance, this report reveals pop-ups, marketing automation and live chat apps are causing excessive delays for a sample Shopify merchant:

Note that not all Shopify apps are problematic. Some merely extend your theme with HTML, CSS and Liquid with minimal JavaScript. The point is not to slash and burn your apps, but find candidates for removal, replacement or optimization (such as deferring their position in your DOM).

Make sure you’re on Shopify 2.0

With the Shopify 2.0 upgrade comes important performance improvements like code caching and asset optimization, as well as the ability for Shopify theme developers to build more native features into your theme that eliminate the need for many third party solutions.

Use native sections whenever possible

Beyond what’s available out of the box with your Shopify theme, developers can code custom sections into your theme. Whenever possible, try to get functionality using Liquid code solutions instead of third party apps.

Development costs more up front, but you’ll pay once versus monthly app fees and the improvement in site speed can translate to more store revenue.

Be careful when removing legacy apps

With the release of Shopify 2.0, Shopify also provided a new development framework for app developers that enables apps to be uninstalled cleanly without leaving bits of code behind that can continue to slow your site long after removal.

Apps available in the Shopify App Store today must be on the new framework to be installed fresh on a shop, but you may have legacy apps that are using the old framework.

This doesn’t mean you must remove these apps, but be aware that you need a thorough cleanup when you do. If you’re unsure which framework your app is using, reach out to your developer and ask.

Choose apps that use the Shopify CDN (and move the ones you can)

Shopify’s content delivery network (CDN) stores copies of all your important shop assets in multiple servers around the world by default, making it much faster to serve content to international visitors.

App developers can choose to host their files within Shopify’s own content delivery network (CDN) which minimizes the number of server requests browsers need to make to load scripts.

Ideally, all your site’s functionality would be hosted together within Shopify’s CDN to avoid additional HTTP connections that can slow page rendering. But some apps use their own CDNs, especially if they have a large number of non-Shopify customers.

The good news is some may enable you to port their CSS, JavaScript and images to Shopify’s CDN via the Theme editor. Consult each app’s documentation or contact support to see which of your apps allow this.

Looking for Shopify themes architected for web performance? Check out the Clean Canvas premium theme portfolio in the Official Shopify Theme Store.