2009-06-30 10 views
5

사이트를 구축하고 있습니다. 어떤 단계에서 나는 IE 디스플레이가 약간 깨져서 크롬이 아무것도 보이지 않지만 바디 태그 (비어 있음)를 렌더링하고 FF는 모두 잘 보였다는 것을 알아 차렸다.자바 스크립트가 인라인 될 좋은 이유가 있습니까

방안에 키보드를 던지고 머리를 내 머리에 부딪 히자 문제를 발견했습니다. 나는 인라인 스크립트 블록에서 닫히지 않은 HTML 주석을 남겨 두었습니다 (어떻게 또는 왜, 번개 속도 감소 및 붙여 넣기 오류가 있었는지는 묻지 않음).

<script type="text/javascript"> 
     <!-- 
     ... 
    </script> 

나는 스크립트가 외부 있다면 문제는 하나 마련하지 않았거나 훨씬 더 눈에 띄는 방법으로 자신을 각성 것 (테스트하지) 같은데요. 어쨌든, 어쨌든 나는 생각해 보았습니다. 인라인 스크립트를 작성해야하는 정말 좋은 이유가 있습니까?

+4

스크립트 태그 내에 HTML 주석을 사용할 필요가 없습니다. 넷스케이프 네비게이터 2 (Netscape Navigator 2)가 새 버전이었을 때 (1996 년경) 구형 브라우저가 스크립트를 텍스트로 표시하지 못하도록 막았습니다. 이것은 10 년 넘게 문제가되지 않았기 때문에 걱정하지 마십시오. – NickFitz

+0

예. 알아요. 그것은 완전한 오류였다. 나는 js에서 그것들을 사용하지 않는다. 그래서 나는 그것이 잘라 붙이기 열풍의 결과 였음에 틀림 없다고 언급했다. :-(즉, DOH! –

+0

가능한 복제본 [인라인 대 외부 자바 스크립트는 사용해야합니까?] (http://stackoverflow.com/questions/138884/when-should-i-use-inline-vs-external-javascript) – outis

답변

9
+2

나는 눈에 잘 띄지 않는 자바 스크립트의 큰 팬이다. –

+2

jQuery, YUI, Prototype, MooTools, Dojo. – Travis

+0

좋은 프레임 워크없이 눈에 잘 띄지 않는 자바 스크립트를 작성하는 것은 불가능하다. 그러나 왜 당신이 원하는 것일까? :) –

3

자바 스크립트를 최대한 빨리 실행하려면 이 다른 HTTP 요청이 반드시 완료되기 전에 실행되므로 인라인 자바 스크립트를 포함하는 것이 좋습니다.

그리고 경우에 따라 타사 제공 업체의 자바 스크립트가 포함되어 있으며 실제로 선택권이 없습니다. Google 애널리틱스뿐만 아니라 특정 광고 시스템도 마음에 들었습니다.

+2

Google 애널리틱스 코드를 항상 별도의 파일에 저장합니다. 이유가 없습니다. – jeroen

2

스크립트가 동적으로

+0

서버에서 .phpjs와 같은 확장자를 설정하여 PHP에서 처리하고 text/javascript로 제공하십시오. 또는 성능이 걱정이되지 않는다면 .js를 완전히 처리하도록 PHP를 얻으십시오. – Macha

+1

여전히 적절한 헤더가있는 별도의 PHP 파일을 갖는 것이 훨씬 낫습니다. (PHP 코드를 위해 .js 파일을 읽는 방법도 있습니다.) 자바 스크립트가 실제로 페이지에 존재해야하는 경우는 거의 없으며, 대부분의 경우 JavaScript를 사용하는 경우이를 피할 수 있습니다. – cwallenpoole

+0

동적으로 생성 된 JavaScript가 필요한 상황이 발생하면 대신 Ajax를 사용하는 것이 좋습니다. –

0

대부분의 XSS 취약점은 인라인 자바 스크립트를 사용하여 악용 될 수 있습니다 :-) 인라인 그것을 가지고 하나의 이유가 될 것이다 (A PHP 또는 ASP.NET MVC 페이지에서 말) 생성해야합니다.

0

이유가 충분하지 않을 수도 있지만 페이지가 더 빨리로드됩니다. 이를 위해 스크립트를 다른 파일에 작성하는 경우에도 클라이언트 측에서 인라인으로 표시되기를 원할 때가 있습니다.

+0

많은 페이지에서이 기능이 필요하다면 언제든지 다시 다운로드하는 것을 취소 할 수 있습니다. 그것이 하나의 파일이라면 캐시 될 수 있습니다. 캐싱의 이점과 비교하여 인라인은 최소화됩니다. – Macha

+0

일반적으로 페이지 관련 사항 만 인라인 될 수 있지만 사이트의 처리량과 netlag에 따라 다릅니다. 대부분의 브라우저는 요청에 따라 파일이 최신 버전인지 확인하므로 인라인을하지 않으면 파일이 약간 손상됩니다. 나는 주로 인라인을 사용하지 않는다. – stevedbrown

2

작성하려는 JS 양에 따라 다릅니다. 많은 지원 루틴 (유효성 검사, 텍스트 처리, 애니메이션 및 효과가 많이 있음)을 작성하는 경우 별도의 파일에 코드를 포함하는 것이 좋습니다. 이렇게하면 코드를 재사용하고 HTML 페이지에서 많은 정크를 제거 할 수 있습니다.

반면에 10 줄의 코드를 넣거나 별도의 파일에 단일 기능 (새로 고침 JS가 떠오른다)을 넣을 필요가 없습니다. 브라우저는 별도의 JS 파일을 다운로드하기 위해 추가 HTTP 요청을 할 필요가 없기 때문에 약간 더 빨리로드됩니다.

+0

많은 페이지에서 필요한 경우 언제든지 다시 다운로드하는 것을 취소 할 수 있습니다. 그것이 하나의 파일이라면 캐시 될 수 있습니다. – Macha

0

부분적으로 새로 고침 (예 : 새로 추가 된 양식 필드에 일부 이벤트 바인딩) 페이지 및/또는 다른 페이지에서 사용하지 않는 일부 고유 한 자바 스크립트를 사용하는 페이지에서 자바 스크립트를 인라인으로 배치하는 경우가 있습니다.

0

브라우저가 각 파일을 개별적으로 호출해야하므로 궁극적으로 많은 외부 스크립트가 페이지 속도를 저하시킬 수 있습니다. 자바 스크립트를 하나의 파일이나 페이지 자체에 결합하면 때로는이 문제를 완화 할 수 있습니다.

반면에 처음으로 호출 된 브라우저는 스크립트 파일을 캐시 할 수 있다고 생각합니다. 따라서 사이트 전체에서 동일한 코드가 많은 경우 외부로 이동하는 것이 좋습니다.

+0

모든 것이 한 페이지에로드되는 것에 대한 귀하의 생각을 좋아합니다. 이 작업을 위해 이미 언급 한 몇 가지 아이디어를 결합 할 수 있습니다. 예를 들어 여러 개의 .js 파일에있는 모든 JavaScript 파일을 만든 다음 PHP의 include_once를 사용하여 모든 파일을 한 페이지에로드 할 수 있습니다.따라서 여러 .js 파일을 편집 할 수있는 이점이 있지만 브라우저를 읽을 수있는 페이지가 한 페이지 만있는 이점이 있습니다. – cwallenpoole

0

저는 XML과 ActionScript를 결합하여 최종 바이트 코드를 만드는 Flex라는 제품을 사용합니다. 가능한 한 두 가지를 분리하는 가장 좋은 방법은 항상입니다.그렇게하면 컨트롤러 (스크립트의 경우)에서보기 (내 경우에는 HTML 또는 MXML)를 매우 명확하고 쉽게 구분할 수 있습니다.

또한 한 줄에 5 개의 파일을 살펴볼 필요가 없습니다. 코드 - 모든 코드가 한 곳에 있습니다.

관련 문제