すべてのAngularJSの例では、AngularライブラリはドキュメントのHEADタグに配置されています。HTML5ボイラープレートレイアウトに基づいて構築された既存のプロジェクトがあります。これは、JSライブラリをDOMの一番下の</BODY>
タグの前に配置する必要があることを定義しています。
AngularJSをHEADに配置する必要がありますか?
すべてのAngularJSの例では、AngularライブラリはドキュメントのHEADタグに配置されています。HTML5ボイラープレートレイアウトに基づいて構築された既存のプロジェクトがあります。これは、JSライブラリをDOMの一番下の</BODY>
タグの前に配置する必要があることを定義しています。
AngularJSをHEADに配置する必要がありますか?
AngularJS を HEAD に配置する必要はありません。また、HTML の読み込みがブロックされるため、実際には配置する必要はありません。
ただし、ページの下部で AngularJS をロードする場合は、「コンパイルされていないコンテンツのフラッシュ」を回避するためにng-cloakまたはng-bindを使用する必要があります。「index.html」ページでのみ ng-cloak/ng-bind を使用する必要があることに注意してください。ng-include または ng-view またはその他の Angular コンストラクトを使用して、最初のページの読み込み後に追加のコンテンツを取り込む場合、そのコンテンツは表示される前に Angular によってコンパイルされます。
Googleグループに関するこの1つの回答は、私に完璧な洞察を与えてくれました(短縮):
ランディングページの内容によって大きく異なります。そのほとんどが静的であり、AngularJS バインディングがほとんどない場合は、同意します。ページの下部が最適です。しかし、完全に動的なコンテンツの場合は、AngularJS を [頭に] できるだけ早くロードしたいと考えています。
したがって、コンテンツの大部分が Angular を介して生成されている場合、ng-cloak
Angular を head に含めるだけで余分な CSS とディレクティブを節約できます。
https://groups.google.com/d/msg/angular/XTJFkQHjW5Y/pbSotoaqlkwJ
必ずしも。
このhttp://plnkr.co/edit/zzt41VUgR332IV01KPsO?p=previewをご覧ください。Angular jsがページの下部に配置され、上部に配置された場合でも同じ出力をレンダリングする場合。
ページの下部で Angular JS をロードすると、見苦しい {{ something }} html が表示されます。body タグで ng-cloak ディレクティブを使用すると、JS がロードされるまで空のフラッシュが作成されるため、head 要素に AngularJS をロードするだけの利点はありません。ng ディレクティブを含むすべての要素に ng-cloak を追加することもできますが、空の要素がフラッシュすることになります。すっごく、Angular ドキュメントがドキュメントからのこの引用で推奨しているように、head 要素に Angular と app.js ファイルをロードするだけです。