HEAD의 AngularJS와 BODY의 비교

HEAD의 AngularJS와 BODY의 비교

모든 Angular에서JS 예제에서는 Angular 라이브러리가 문서의 HEAD 태그에 배치됩니다.HTML5 보일러 플레이트 레이아웃에 구축된 기존 프로젝트가 있습니다.이것은 JS 라이브러리가 DOM의 맨 아래에 배치되어야 한다는 것을 정의합니다.</BODY>태그를 붙입니다.

각도 설정JS를 HEAD에 배치해야 합니까?

AngularJS는 HEAD에 배치할 필요가 없습니다.또한 HTML 로딩이 차단되기 때문에 실제로는 그렇지 않습니다.

그러나 Angular를 로드하는 경우페이지 하단의 JS에서는 "컴파일되지 않은 콘텐츠의 플래시"를 피하기 위해 ng-cloak 또는 ng-bind를 사용해야 합니다.ng-cloak/ng-bind는 "index.html" 페이지에서만 사용할 수 있습니다.ng-include, ng-view 또는 기타 Angular 구성 요소를 사용하여 초기 페이지 로드 후 추가 내용을 가져올 경우 해당 내용은 표시되기 전에 Angular에 의해 컴파일됩니다.

https://stackoverflow.com/a/14076004/215945 도 참조해 주세요.

Google Groups에 대한 이 답변은 저에게 완벽한 통찰력을 주었습니다(간단).

랜딩 페이지의 내용에 따라 달라집니다.대부분의 경우 Angular가 거의 없는 정적 상태일 경우JS 바인딩이 yes보다 낫다는 것은 동의합니다. 페이지 하단이 가장 좋습니다.그러나 완전히 역동적인 콘텐츠의 경우 Angular를 로드합니다.가능한 한 빨리 JS[머리]

따라서 콘텐츠의 대부분이 Angular를 통해 생성된다면 추가 CSS를 절약할 수 있습니다.ng-cloak머리에 Angular를 넣는 것만으로 지시를 내릴 수 있습니다.

https://groups.google.com/d/msg/angular/XTJFkQHjW5Y/pbSotoaqlkwJ

꼭 그렇다고 할 수는 없죠.

이 http://plnkr.co/edit/zzt41VUgR332IV01KPsO?p=preview 를 봐 주세요.각 js는 페이지 하단에 배치되며 맨 위에 배치되는 경우에도 동일한 출력을 렌더링합니다.

페이지 하단에 Angular JS를 로드하면 보기 흉한 {{ something }} html이 깜박입니다.본문 태그에 ng-cloak 지시어를 사용하면 JS가 로드될 때까지 빈 플래시가 생성되므로 Angular만 로드해도 아무런 이점이 없습니다.헤드 요소의 JS.ng 디렉티브가 포함된 모든 요소에 ng-cloak을 추가할 수 있지만 결과적으로 빈 요소의 플래시가 발생합니다.따라서 Angular 설명서에서 권장하는 대로 Angular 및 app.js 파일을 헤드 요소에 로드하십시오. "최적의 결과를 얻으려면 angular.js 스크립트는 html 문서의 머리 부분에 로드해야 합니다."

언급URL : https://stackoverflow.com/questions/15538125/angularjs-in-head-vs-body