App Ecosystem Compatibility Matrix: Shopify Liquid vs Hydrogen

By nuwudorder | September 23, 2025

Introduction

One of the hardest parts of migrating to Hydrogen is app compatibility. Many Shopify apps were built for Liquid themes, relying on DOM injection or checkout.liquid hooks. Hydrogen is API-first — which means some apps work seamlessly, others need wrappers, and some simply don’t fit.

Agencies can save merchants pain by publishing a compatibility matrix before any migration.

Why Apps Break in Hydrogen

  • ❌ DOM injection → apps that drop widgets into theme templates can’t touch Hydrogen’s React runtime.
  • ❌ Checkout.liquid reliance → not supported in Hydrogen.
  • ❌ Legacy customer auth → incompatible with the new Customer Account API.

👉 Merchants discover these issues too late without a compatibility audit.

Compatibility Categories

Category Status in
Hydrogen		 Example
Apps		 Notes
Subscriptions ✅ Supported Recharge, Skio, Bold API-first, SDK-based.
Personalization ✅ Supported Rebuy, Algolia, Nosto API + SDK integrations.
Analytics ✅ Supported GA4, Triple Whale, Elevar Prefer server-side integrations.
Reviews ⚠️ Partial Yotpo, Okendo, Judge.me API works, widgets break (needs wrap).
Loyalty ⚠️ Partial Smile.io, Yotpo Loyalty SDK works, DOM widgets fail.
Pop-ups/
Widgets		 ❌ Unsupported Privy, Justuno DOM injection only.
Checkout
Mods		 ❌ Unsupported Checkout scripts Checkout.liquid not in Hydrogen.

Workarounds

  1. SDK Integrations → Recharge, Algolia, Nosto.
  2. React Wrappers → wrap reviews/loyalty UIs in React components.
  3. Hybrid Builds → keep Liquid for unsupported apps during Phase 2 migrations.
  4. Replacements → swap DOM-heavy apps for API-first alternatives.

Case Example: Mid-Market Retailer

  • Pre-migration: 20 apps.
  • Audit outcome:
    • 10 compatible.
    • 4 wrapped.
    • 6 replaced with API-first equivalents.
  • Result: faster PDP load times, lower recurring app costs.

Guardrails

  • ✅ Run app audits before starting a Hydrogen build.
  • ✅ Maintain an internal compatibility matrix.
  • ✅ Replace unsupported apps proactively.
  • ✅ Educate clients that fewer apps ≠ less functionality (often means more flexibility).

Conclusion

Hydrogen isn’t app-hostile — it’s just API-first. Merchants that prepare with a compatibility matrix avoid surprises, reduce costs, and streamline their stack.

In Hydrogen, apps don’t break — assumptions do.

Posted in Blog

About nuwudorder