How Bloated Shopify Themes Can Limit Technical SEO and AI Visibility

What makes a Shopify theme bloated?

The usual causes, most of them named in Shopify's theme performance guide:

Themes in Shopify's Theme Store must reach an average Lighthouse performance score of at least 60 and an accessibility score of at least 90 on the home, collection and product pages. A theme can start there and lose much of it once apps and customisations pile up.

Why does bloat affect AI visibility?

Research by Vercel and MERJ found that the major AI crawlers, including OpenAI's, Anthropic's and Perplexity's, do not execute JavaScript. Google's crawler does render, and so do the systems behind Gemini and AI Overviews. So the same page can look complete to Google and half-empty to ChatGPT's crawler.

On Shopify, the most common gap is reviews. Many review apps add star ratings and review text with JavaScript. The ratings then miss both the initial HTML and the Product structured data, so AI systems that read the raw page do not see them. The same happens with size charts, specifications in tabs loaded on click, and prices changed by currency or discount apps.

To check, open a product page, view the page source rather than the element inspector, and search for your price, review count and key specifications. If they are not in the source, many AI crawlers will not see them. Which fields matter most is covered in which Shopify metafields matter for AI search.

Can AI tools fix a bloated theme?

They can help diagnose, not repair. Coding assistants can read theme files, list scripts, suggest where to defer loading and rewrite a loop. But the deep problems are structural: which apps the store depends on, how sections were built, and what content was moved into JavaScript. Fixing them means decisions about apps and design, testing on real devices, and often rebuilding templates. Treat AI output as a draft for a developer to check, not a fix to paste in.

What should you fix first?

1. Audit apps. List every app that adds code to the storefront. Remove those you no longer use, and check that their code went with them.
2. Remove or defer render-blocking scripts. Shopify's guide recommends deferring non-critical scripts and loading some only when a shopper interacts.
3. Move key content into Liquid. Prices, specifications, reviews and menus should arrive in the HTML. Many review apps offer a server-side or structured data option.
4. Fix the main image. Never lazy-load it, give it a high fetch priority and serve correctly sized files.
5. Simplify heavy loops in collection and product templates.
6. Measure with field data. Use the Web Performance dashboard in Shopify admin and Google's Core Web Vitals report, not only a single Lighthouse run.

Basic settings that already help AI visibility are covered in whether Shopify's default settings improve AI visibility, and the wider link between SEO basics and AI answers in how traditional SEO fundamentals affect AI visibility.

Shopify Hydrogen vs traditional themes for AI accessibility and speed

Hydrogen is Shopify's React-based framework for headless storefronts, usually hosted on Shopify's Oxygen platform. Shopify's performance guide suggests Hydrogen for server-side rendering when a store needs a JavaScript framework.

Hydrogen is not automatically better for AI. It removes theme and app bloat, but a team can still build client-only components that crawlers never see, and it makes the team responsible for SEO basics. Check also whether features Shopify adds to standard stores, such as its automatic agent instructions and commerce endpoints, work on your headless domain. For most merchants, a disciplined Liquid theme with fewer apps gets most of the benefit at a fraction of the cost. Hydrogen suits large brands with engineering teams and needs a theme cannot meet.

We have not benchmarked Hydrogen against Liquid themes for AI citations. This page is based on Shopify's theme performance guide, Theme Store requirements and Hydrogen SEO documentation, and published research on AI crawler rendering.

What might this look like in practice?

Consider an illustrative skincare store, Stavquay Botanics, with 23 apps and a mobile Lighthouse score of 31. Its product pages loaded reviews, ingredients and the price in a subscription widget through JavaScript, so the raw HTML showed only a title and an image. The team removed nine unused apps, switched the review app to its server-rendered option, moved ingredient lists into metafields rendered in Liquid, and stopped lazy-loading the main product image. The mobile score rose above 60, and when the team checked ChatGPT's answers about their best-selling serum some weeks later, the answers quoted the ingredient list and review rating correctly.

What do people ask about Shopify themes and AI?

Do AI crawlers render JavaScript on Shopify stores?

Most do not. Content added by JavaScript after the page loads is often invisible to them.

Are Shopify's own free themes good enough?

Shopify's own themes are built to its Theme Store standards and render content in Liquid. Problems usually come from apps and customisations.

Should I move to Hydrogen for AI visibility?

Usually not for that reason alone. Fixing apps and rendering in your current theme is cheaper and often enough.

How many apps is too many?

There is no set number. What matters is how much code each adds to every page and whether it blocks rendering.