2010-12-09 6 views
5

나는 공개 된 웹 사이트를 구축하고 있으며 많은 jQuery와 jQueryUI를 사용하고 있습니다. 내가 알아챈 점은 jQuery와 jQueryUI를 사용하는 대부분의 사이트는 자신의 페이지에 이와 같은 코드가 없다는 것입니다.공용 웹 사이트에 JavaScript를 포함시키는 방법은 무엇입니까?

<script type="text/javascript"> 
    $(document).ready(function(){ 

    $("a").click(function(event){ 
     alert("Thanks for visiting!"); 
    }); 

    $("input:submit").button(); 
    }); 
</script> 

이것은 단순한 예이지만 대부분의 사이트는 모든 페이지에 대해 하나의 난독 화 된 js 파일 만 포함하고 있음을 알고 있습니다. 어디서나 $ (document) .ready를 사용하는 것처럼 보이지 않습니다. 내 현재 사이트에서는 각 페이지마다 js 파일을 포함해야 할 것처럼 보입니다. 내 질문은 그것이 어떻게 될 가정하고 페이지에서 자바 스크립트를 사용/포함하는 방법에 대한 모범 사례가 무엇입니까?

+0

단일 페이지와 관련이없는 많은 기능이있는 경우 외부 파일에 넣고 재사용을 위해 참조하십시오. –

답변

3

당신은 거의 모든 스크립트를 넣을 수있는 W3C에 따르면 http://www.w3schools.com/js/js_whereto.asp

그래서 당신이 그들 넣어해야합니까?

Ege는 '차단'스크립트를 사용하기 전에 브라우저가 병렬로 더 많이로드 할 수있게하기 위해 가능한 한 페이지 아래쪽에 배치해야한다고 말하기 쉽습니다. 자세한 내용은 여기를 참조하십시오. http://developer.yahoo.com/performance/rules.html#js_bottom

또한 스크립트 (및 CSS)를 외부 파일에 저장하는 것이 좋습니다. 브라우저는 사용자가 페이지를 다운로드 할 필요없이 저장하도록 할 수 있습니다. 시각.

필자는 개인적으로 jQuery와 같은 스크립트 프레임 워크에 항상 CDN을 사용하므로 사용자가 할 수있는 것보다 더 빨리 외부 리소스를 제공 할 수 있습니다. 또한 동일한 CDN의 다른 사이트에 이미 jQuery를 캐싱 한 브라우저의 가능성이 훨씬 더 높습니다. 자세한 내용은 여기를 참조하십시오 : http://code.google.com/apis/libraries/devguide.html

마지막으로 $ (document) .ready를 사용하는 데는 문제가 없지만 사이트의 응답성에 영향을 미칠 수 있으며 전문가가 장단점을 초과 할 수 없음을 알고 있어야합니다. 다시 한 번 자세한 내용을 여기에 : http://encosia.com/2010/08/18/dont-let-jquerys-document-ready-slow-you-down/

희망이 도움이되었습니다.

4

대부분의 코드가 캐싱 목적으로 하나의 큰 파일로 압축되기 때문에 유명한 document.ready가 표시되지 않습니다. 본문 끝에 다음과 같이 js를 넣으십시오 :

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

이렇게 모든 페이지마다 한 번만 캐시 될 수 있습니다.

+0

왜 SO site.js 파일이 상단과 하단에 포함되어 있습니까? – Lukasz

+0

는 Delimited가 그의 대답에서 말한 것을 보았습니다. –

1

상단 또는 하단에 'site.js'파일을 포함할지 여부는 javascript가 document.write를 수행하여 페이지에 내용을 넣지 않는 한 중요하지 않습니다. 물론 꼭대기에서 원하는 것은 원할 것입니다. 페이지의 나머지 부분이 js 파일을 다운로드하기 전에로드되므로 대용량 파일 인 경우 페이지로드가 지연되는 경우도 있습니다.

관련 문제