【Shopify.dev和訳】Themes/Dev tools/Theme Inspector/Overview
この記事について
この記事は、Themes/Developer tools/Theme Inspector/Overviewの記事を和訳したものです。
記事内で使用する画像は、公式ドキュメント内の画像を引用して使用させていただいております。
Shopify アプリのご紹介
Shopify アプリである、「商品ページ発売予告アプリ | リテリア Coming Soon」は、商品ページを買えない状態のまま、発売日時の予告をすることができるアプリです。Shopify で Coming Soon 機能を実現することができます。
Shopify アプリである、「らくらく日本語フォント設定｜リテリア Font Picker」は、ノーコードで日本語フォントを使用できるアプリです。日本語フォントを導入することでブランドを演出することができます。
Chrome 用 Shopify テーマインスペクター
Shopify Theme Inspector for Chrome は、リキッドレンダリングのプロファイリングデータを炎のグラフで視覚化するブラウザプラグインです。このグラフとプロファイリングデータを使って、オンラインストアの速度を低下させているテーマコードの部分を特定することができます。
パフォーマンスを考慮して設計されたテーマであっても、テーマコードに加えられたアプリやカスタマイズによって、オンラインストアの速度が低下することがあります。Liquid のカスタマイズは、これらのスローダウンの原因となることがよくあります。Liquid のテンプレートが遅いと、サーバーの応答時間に影響を与え、ページのレンダリング開始までの時間が長くなります。
速度低下の原因となっているコードを特定したら、それを最適化してストアを高速化し、より多くのビジターにコンバージョンさせることができます。
Chrome 用の Shopify Theme Inspector は、個人のストアや、コラボレーターがアクセスしているストアの Liquid を分析するのに使用できます。
Liquid のコードを最適化することで、オンラインストアの体験、コンバージョン率、発見性を向上させることができます。オンラインストアとテーマのパフォーマンスについて、詳しくはこちらをご覧ください。
Shopify Theme Inspector のインストール
Shopify Theme Inspector for Chrome は、Chrome ウェブストアで購入できます。
Shopify Theme Inspector を実行する
Shopify Theme Inspector を実行して炎のグラフを読み取る方法については、Identify Liquid render issues using Shopify Theme Inspectorを参照してください。
Shopify アプリのご紹介
Shopify アプリである、「商品ページ発売予告アプリ | リテリア Coming Soon」は、商品ページを買えない状態のまま、発売日時の予告をすることができるアプリです。Shopify で Coming Soon 機能を実現することができます。
Shopify アプリである、「らくらく日本語フォント設定｜リテリア Font Picker」は、ノーコードで日本語フォントを使用できるアプリです。日本語フォントを導入することでブランドを演出することができます。
Discussion