2011-02-02 8 views
3

저는 ASP.NET MVC에서 개발 중이며 여러 개의 JavaScript 파일을 사용하고 있습니다. 예 : jQuery, jQuery UI, Google지도, 내 자신의 JavaScript 파일 등여러 JavaScript 파일을 하나로 결합하십시오.

성능을 위해 이들을 하나로 결합해야합니까? 그렇다면 어떻게?

+2

[자바 스크립트를 하나의 .js 파일에 넣거나 여러 .js 파일로 분리 할 수 ​​있습니까?] (http://stackoverflow.com/questions/555696/put-javascript-in-one-js-file- – Shoban

답변

10

하나에 여러 파일을 결합 할 이유는 설정의 대기 시간을 최소화 할 수 있도록하고 http 요청이 끊어지면 더 적게 만들 수 있습니다. 그러나 많은 최신 브라우저에서 JavaScript 파일을 병렬로 다운로드하고 있습니다 (여전히 순차적으로 실행 중입니다). 결과적으로 단일 1Mb 파일 다운로드는 3 개의 350KB 파일보다 느려질 수 있습니다. (여러 페이지 공유)

  • 페이지 특정 파일

    • 외부 라이브러리 파일 (JQuery와, FLOT, 플러그인)
    • 내부 라이브러리 파일 : 내가 뭘 왔어요 세 가지 번들로 내 파일을 분리하는 것입니다 (그 페이지에 의해서만, 아마 2 페이지에 의해)

    이 방법으로, 나는 두 세계의 최고를 얻는다 : 시작할 때 과도한 수의 http 요청이 아니라, 병렬 다운로드의 이점

    CSS에도 동일하게 적용되며, 각 페이지는 3 개의 CSS 번들을로드합니다. 따라서 총 6 개의 번들 파일과 기본 HTML 파일을 다운로드합니다. 나는 이것이 좋은 타협이라고 생각한다. 당신은 파일의 다른 그룹이 당신을 위해 더 잘 작동하는 것을 알지만, 한 페이지 앱이 아니라면 내 조언은 단일 번들을 만들지 않습니다. 동일한 파일을 다른 번들에 많이 넣는다면 동일한 콘텐츠를 여러 번 다운로드하기 때문에 번들링 전략을 다시 생각해 볼 차례입니다.

    무엇을 사용합니까? Martijn의 제안은 돈에 있습니다.YUI는 제 경험에서 가장 널리 사용되는 것으로, 이전 및 현재의 직무에서 사용했습니다.

  • 0

    모두가 귀하의 모든 페이지에 포함될 예정이라면 실제로 변화가 없습니다. 그러나 일부 페이지에만 관련성이있는 경우 기술적으로 더 이상 구분하여 관련 페이지에만 관련 페이지를 포함시키는 것이 좋습니다.

    -1

    내가 아는 한 실제로 파일을 적게 사용하면 페이지를로드 할 때 사용자가 얻게되는 HTTP 성능이 줄어들어 페이지를로드 할 때 성능이 향상됩니다. 그래서 그들은 첫 페이지에 대한 귀하의 페이지에 올 것이다 초를 저장합니다. 그러나 후에,이 파일은 현금화되고, 그때 아무런 차이가 없습니다 ...

    자바 스크립트 엔진을 파고 들지는 않았지만 한 파일의 함수는 동일한 방식으로 처리됩니다 큰 파일이나 작은 파일 따라서 실행에 차이가 없습니다.

    그래서, 시간을 절약, 아무것도 변경되지 않습니다 는 (특히 당신이 JQuery와의 최신 버전을 원하는 발견 할 때, 너무 적은 보상을 당신에게 새를 너무 많은 시간을 요 하겠지만 버전이 오늘 나왔다.) 그리고 당신은 모든 것을 다시 연결해야만한다. ...

    +0

    js 파일을 하나의 파일로 연결할 때 두 파일이 서로 다른 파일에있는 경우 변수에 문제가있을 수 있습니다. 다른 파일이나 하나의 파일에서 변수의 범위가 동일하지 않습니다. – Cedric

    +3

    파일 범위 변수가 없으며 전역 또는 함수의 로컬 변수입니다. Cedric이 언급 한 문제는 존재하지 않습니다. –

    관련 문제