Shopify Theme Performance Tips

1. Limit Nested Loops

Liquid is rendered on Shopify's servers. If you put a loop inside a loop inside a loop, you can hit the Liquid render limits and cause server timeouts.

2. Conditionally Load Scripts

Don't load your massive slider JavaScript library on every single page. Load it conditionally based on the template.

{% if template.name == 'index' or template.name == 'product' %}
  <script src="{{ 'slider.js' | asset_url }}" defer></script>
{% endif %}

3. Preconnect to Key Origins

Ensure Shopify's CDN is preconnected in your theme.liquid head section.

<link rel="preconnect" href="https://cdn.shopify.com" crossorigin>

4. Use Section Rendering API

If you are building quick-view modals or dynamic cart drawers, don't fetch the entire HTML page. Use Shopify's Section Rendering API to only request the specific HTML snippet you need.

5. Clean Schemas

Keep schemas tidy—unused settings bloat theme JSON. Generate lean schemas with the Schema Generator.

6. Audit with the Cheat Sheet

Use our Performance category for lazy loading, pagination, and nested-loop warnings before launch.