[JQUERY] 머리글 또는 바닥 글에서해야 jQuery 코드의 이동?

머리글 또는 바닥 글에서해야 jQuery 코드의 이동?

해결법

1. ---

   1.모든 스크립트는 마지막으로로드해야

   모든 스크립트는 마지막으로로드해야

   거의 모든 경우, 직전 , 페이지의 끝에서 모든 스크립트 참조를 배치하는 것이 가장 좋습니다.

   당신으로 인해 문제와 이것 저것을하는 주형에 그렇게 할 수없는 경우, 브라우저가 HTML을 다운로드 한 후 스크립트를 다운로드 알 수 있도록하는 연기 속성을 가진 스크립트 태그를 장식 :

   <script src="my.js" type="text/javascript" defer="defer"></script>
   

   에지의 경우

   일부 가장자리 경우 그러나, 당신은 페이지 깜박임 또는 일반적으로 단순히 연기 속성없이 <헤드> 태그에 jQuery를 스크립트 참조를 배치하여 해결할 수있는 페이지로드시 다른 유물이 발생할 수 있습니다 경우가 있습니다. 이러한 경우 jQuery를 UI와 그 기능의 일부로서 DOM을 수정 같은 jCarousel 또는 트 리뷰와 같은 다른 애드온을 포함한다.

   또한주의

   같은 polyfills로 DOM 또는 CSS 전에로드해야합니다 일부 라이브러리가있다. 모더 나이저는 head 태그에 배치해야합니다 하나의 라이브러리입니다.

2. ---

   2.하단에 넣어 스크립트

   하단에 넣어 스크립트

   편집 : 파이어 폭스는 버전 3.6 이후 DEFER 속성을 지원합니다.

   출처 :

3. ---

   3.만 물론 CDN을 통해 머리에 jQuery를 자체를로드.

   만 물론 CDN을 통해 머리에 jQuery를 자체를로드.

   왜? 일부 시나리오에서는 임베디드 jQuery를 의존하는 코드 부분 템플릿 (예를 들어, 아약스 로그인 양식 조각)를 포함 할 수 있습니다; jQuery를이 페이지 하단에 장착되어있는 경우, 당신은 좋은를 오류 "$가 정의되지 않은"얻을.

   물론이 문제를 해결하는 방법이있다 (예를 들면 어떤 JS를 내장하고 부하에서 바닥 번들 JS에 추가하지), 그런데 왜 당신을 어디에서든지 jQuery를 의존하는 코드를하시기 바랍니다 배치 할 수있는의, 느리게로드 JS의 자유를 잃게? 너무 오래 (jQuery를로드하는 등) 의존성과 DOM의 코드 생활이 만족되는 경우 자바 스크립트 엔진은 상관하지 않는다.

   당신의 일반적인 / 공유 JS 파일, 그래, 전에 장소를 들면 하지만, 정말 그냥 HTML에서 그 시점에서 바로 거기에 jQuery를 따라 조각 또는 파일 참조를 부착하는 것이 응용 프로그램 유지 보수 현명하게 예외에 대한 이렇게.

   머리에는 성능 저하 로딩 JQuery와는 없습니다; 지구상의 어떤 브라우저가 이미 캐시 jQuery를 CDN 파일이하지 않는 이유는 무엇입니까?

   헛소동은 머리에 jQuery를 고수하고 JS 자유의 통치를 할 수 있습니다.

4. ---

   4.에서 Nimbuzz 관련된 문제에 대한 매우 좋은 설명을 제공하지만, 나는 최종 답변은 귀하의 페이지에 따라 생각 : 사용자가 빨리해야하는 더 중요한 것 - 스크립트 또는 이미지를?

   에서 Nimbuzz 관련된 문제에 대한 매우 좋은 설명을 제공하지만, 나는 최종 답변은 귀하의 페이지에 따라 생각 : 사용자가 빨리해야하는 더 중요한 것 - 스크립트 또는 이미지를?

   이미지없이 이해하지만, 사소한, 중요하지 않은 스크립트가없는 일부 페이지가 있습니다. 이 경우는 사용자가 빨리 이미지를 볼 수 있으며 페이지의 감각을 만들기 시작 할 수 있도록 하단에 스크립트를 넣어 의미가 있습니다. 다른 페이지 작업에 스크립팅에 의존하고 있습니다. 이 경우 그것은 상단에 스크립트를 넣어 의미가 있으므로, 이미지가 아닌 작업 페이지가 아닌 이미지없이 작동하는 페이지를하는 것이 좋습니다.

   고려해야 할 또 다른 점은 스크립트 이미지에 비해 일반적으로 작은 것입니다. 물론,이 일반화 있으며, 당신은 당신의 페이지에 적용 여부를 확인해야합니다. 그것은 나에게 엄지 손가락의 규칙으로 먼저 퍼팅에 대한 인수입니다 (예. 그렇지 않으면 할 수있는 좋은 이유가 아니라면), 이미지가 스크립트를 지연하는 것처럼 그들이만큼 이미지를 지연하지 않기 때문에 다음 않는 경우. 당신은 당신이 그들을 사용해야 할 때이 아직로드하고 있는지에 대해 걱정할 필요가 없기 때문에 마지막으로, 상단에 스크립트가 단지 훨씬 쉽다.

   요약하면, 나는 기본적으로 상단에 스크립트를 넣어 만 페이지를 완료 한 후 아래로 이동 가치의 여부를 고려하는 경향이있다. 그것은 최적화 - 그리고 나는 일찍 그렇게하고 싶지 않아요.

5. ---

   5.어쨌든 페이지가 끝날 때까지 발생하지 않습니다 준비 문서에있는 대부분의 jQuery 코드를 실행합니다. 그것의 가장 좋은 방법은 페이지 하단에있는 모든 자바 스크립트를 넣어, 그래서 또한, 페이지 렌더링은, 자바 스크립트 구문 분석 / 실행에 의해 지연 될 수 있습니다.

   어쨌든 페이지가 끝날 때까지 발생하지 않습니다 준비 문서에있는 대부분의 jQuery 코드를 실행합니다. 그것의 가장 좋은 방법은 페이지 하단에있는 모든 자바 스크립트를 넣어, 그래서 또한, 페이지 렌더링은, 자바 스크립트 구문 분석 / 실행에 의해 지연 될 수 있습니다.

6. ---

   6.표준 방법은 페이지 하단에있는 귀하의 모든 스크립트를 넣어,하지만 난 jQuery를 플러그인의 번호와 ASP.NET MVC를 사용하고 난의 섹션에 내 jQuery를 스크립트를 넣어 만약 내가 모든 작품 더 나은 것을 찾을 마스터 페이지.

   표준 방법은 페이지 하단에있는 귀하의 모든 스크립트를 넣어,하지만 난 jQuery를 플러그인의 번호와 ASP.NET MVC를 사용하고 난의 섹션에 내 jQuery를 스크립트를 넣어 만약 내가 모든 작품 더 나은 것을 찾을 마스터 페이지.

   내 경우, 스크립트는 페이지 하단에있는 경우 페이지가로드 될 때 발생하는 유물이있다. 내가 jQuery를 트 리뷰 플러그인을 사용하고, 그리고 스크립트 시작 부분에로드되지 않은 경우, 나무는 플러그인하여 부과 필요한 CSS 클래스없이 렌더링됩니다. 페이지가 처음로드가 TreeView에의 적절한 렌더링 뒤에 때이 재미 보는 혼란을 얻을 수 있도록. 찾고 아주 나쁜. 의 에 jQuery를 플러그인 퍼팅 마스터 페이지의 섹션은이 문제를 제거합니다.

7. ---

   7.거의 모든 웹 사이트는 여전히 jQuery를 헤더에 다른 자바 스크립트 배치 있지만 : D를, 심지어 stackoverflow.com을 확인합니다.

   거의 모든 웹 사이트는 여전히 jQuery를 헤더에 다른 자바 스크립트 배치 있지만 : D를, 심지어 stackoverflow.com을 확인합니다.

   나는 또한 당신이 신체의 끝 태그 앞에 넣어하는 것이 좋습니다. 당신도 장소에 배치 한 후 로딩 시간을 확인할 수 있습니다. 스크립트 태그는 더로드 웹 페이지를 일시 중지됩니다.

   그것은 당신의 헤더 섹션에 장소 CSS를, 그래서 자바 스크립트를로드 할 때까지 바닥 글에 자바 스크립트를 배치 한 후, 당신은 당신의 웹 페이지의 특이한 외모를받을 수 있습니다.

8. ---

   8.직전 은 의미가 있습니다, 귀하의 웹 사이트 링크를 가속화하기위한 야후 개발자 네트워크의 모범 사례에 따라 최적의 장소입니다.

   직전 은 의미가 있습니다, 귀하의 웹 사이트 링크를 가속화하기위한 야후 개발자 네트워크의 모범 사례에 따라 최적의 장소입니다.

   가장 좋은 것은 직접 테스트하는 것입니다.

9. ---

   9.나를 위해 jQuery를 조금 특별하다. 아마 규범에 대한 예외입니다. 의도 한대로 나중에 올 다른 스크립트가 작동 할 수 있도록 조기으로로드는 매우 중요하므로에 의존하는 다른 많은 스크립트가 있습니다. 다른 사람은 머리 부분에도이 페이지로드 jQuery를 지적.

   나를 위해 jQuery를 조금 특별하다. 아마 규범에 대한 예외입니다. 의도 한대로 나중에 올 다른 스크립트가 작동 할 수 있도록 조기으로로드는 매우 중요하므로에 의존하는 다른 많은 스크립트가 있습니다. 다른 사람은 머리 부분에도이 페이지로드 jQuery를 지적.

from https://stackoverflow.com/questions/2105327/should-jquery-code-go-in-header-or-footer by cc-by-sa and MIT license