jQuery CDNの挿入場所（ファイル）についてご教示いただきたいです。

suzukikanako · ‎06-09-2021

いつもお世話になっております。

業界的に脱jqueryの流れがあり、Shopifyのテーマにもその波がきているそうです
ただ、アプリはjQueryありきのものもあるので、今後新テーマでアプリを入れたら動かない！という現象が発生する可能性はあります
そんな時は以下リンクよりjQuery CDNを読み込んであげてください

という情報を見かけました。そこで質問です。

————————————————————————
【種類について】

~~下記サイトでjQuery 3.xを選択するところまでは理解したのですが、~~

~~下記４種類のどのコードを選択すればよろしいでしょうか？~~

~~uncompressed, minified, slim, slim minified~~

minifiedで解決いたしました。

————————————————————————

【挿入場所】

theme.liquidの<head>の直下に挿入すればよろしいでしょうか？

————————————————————————

初歩的な質問で恐縮ですが、有識者の方いらっしゃいましたらご教示いただけますと幸いです。

どうぞよろしくお願いいたします。

toooru · ‎06-09-2021

<head>〜</head>の間か、または</body>の直前のどちらかとなりますが、HTMLのレンダリングが完了する前にJavaScriptを動かしたいかどうか、または利用するプラグインなどによって変わってくるかと思います。

レンダリング完了前にJavaScriptを実行する必要のある場合はhead内に記述しますが、そうでない場合は</body>の直前に挿入したほうがHTMLの読み込みをブロックせず高速化に繋がります。

また、jQueryの指示や､プラグインのオプションなどは、読み込んだjQuery本体よりも後に記述する必要があります。

toooru · ‎06-09-2021

<head>〜</head>の間か、または</body>の直前のどちらかとなりますが、HTMLのレンダリングが完了する前にJavaScriptを動かしたいかどうか、または利用するプラグインなどによって変わってくるかと思います。

レンダリング完了前にJavaScriptを実行する必要のある場合はhead内に記述しますが、そうでない場合は</body>の直前に挿入したほうがHTMLの読み込みをブロックせず高速化に繋がります。

また、jQueryの指示や､プラグインのオプションなどは、読み込んだjQuery本体よりも後に記述する必要があります。

コミュニティ・ブログ記事