ShopifyストアアセットのURL変更への対応

近いうちに、Shopifyは一部のストアアセット（画像、JS、CSSなど）を、ShopifyのCDNドメインではなく、各ショップのストアドメインから提供し始める予定です。これに伴い、URL形式も一部変更となります。これは、ストアのパフォーマンス向上、セキュリティ強化、Shopifyのブランディング軽減といったメリットを提供するための変更です。

1. 技術的課題の定義と現状分析

これまでShopifyのストアアセットはcdn.shopify.com/…というURL形式を使用していました。しかし、この形式では、ストアのページ読み込み速度やセキュリティ、ブランディングにおいて一部の問題が発生していました。

2. 技術的ソリューションの提案

新しいURL形式はshop.example.com/cdn/…となります。また、商品に関連する新しい画像は、これまでの/productsのパス形式から/filesのパス形式を使用するようになります。

3. 実装手順とコード例

新しいURL形式は、liquidタグから返され、ShopifyがレンダリングするストアフロントHTMLに含まれます。旧URL形式は、APIのレスポンスに引き続き使用されます。なお、ヘッドレスショップでは引き続きcdn.shopify.com/…が使用されます。

新しいURL形式のドメインは、リクエストコンテキストに依存します。これは、バイヤーが訪れるストアのパーマネントmyshopify.comドメインまたはカスタムドメインによります。旧URL形式に依存するコードは、両形式をサポートするように更新する必要があります。

4. パフォーマンス・コスト分析

この変更により、ストアフロントのページ読み込み時間が大幅に改善され、バイヤー体験の向上とコンバージョンレートの改善が期待できます。読み込み速度の改善は、数百ミリ秒のオーダーになる可能性があります。

5. 実装時の注意点・ベストプラクティス

この変更により、旧URL形式に固定的な仮定を持つアプリやテーマコードは適切な動作を行わない可能性があります。開発者は旧URL形式に依存するコードを新URL形式にも対応するように更新する必要があります。

6. 次のステップ・発展案

この変更は、ストアのパフォーマンスとセキュリティを向上させるための重要なステップです。今後もShopifyは、開発者が最高のバイヤー体験を提供できるように、プラットフォームの改善に努めています。

参考記事: Changes to Merchant Asset URLs