JavaScript 파일은 어떻게로드되고 실행됩니까?

Question

자바 스크립트 파일로드/실행 순서에 대해 자주 이야기하거나 연구하지 않습니다. JavaScript가 어떻게 처리되는지 설명하는 사이트에 관심이 있습니다. 내가

<script src="a.js"></script> 
<script src="b.js"></script> 
<script src="c.js"></script> 

이있는 경우 특히, 나는 그 b.js, a.js 먼저 다운로드 가정 그리고 마지막으로 c.js 또는 동시에 다운로드하는거야? 실행은 어떨까요? 헤더의 스크립트는 본문의 스크립트보다 선호됩니까?

내가이 주제에 너무 흥미를 느낀 주된 이유는이 스크립트의 동적 로딩을 사용하는 자바 스크립트 소프트웨어를 작성하고 x가 정의되지 않았기 때문에 오류가 발생하기 때문입니다 (다른 스크립트보다 먼저로드되지 않았습니다. 스크립트), 일반적으로 이러한 오류는 발생하지 않습니다. 나는 왜 그런지 이해하지 못한다.

Answer 1

스크립트는 병렬로 다운로드되지만 구문 분석되고 HTML에 나타나는 순서대로 실행되며 실행될 때까지 페이지의 다른 작업 (렌더링 포함)을 차단합니다. 예를 들어 DOM을 통해 JavaScript 코드에 의해 스크립트가 추가되거나, 최신 버전의 Firefox에 async attribute이있는 경우 스크립트를 비 차단으로 처리 할 수 ​​있습니다.

Answer 2

JavaScript 다운로드를 제어하는 ​​것은 주로 브라우저입니다. 위에서 수행 한 것처럼 동일한 도메인에서 모두로드하면로드 된 순서대로로드되므로 지정한 순서대로로드됩니다.

간단한 테스트로 각 파일에서 함수를 지정하고 목록의 다음 파일에서 함수를 호출하여로드 순서를 볼 수 있습니다.

로딩의 우선 순위와 관련하여 대부분의 웹 사이트 최적화 도서는 페이지 하단을 빠르게로드하고 js 파일을 필요한 마지막 리소스로로드하므로 맨 아래에 js 파일을로드하도록 알려줍니다 . 이 작업은 조심스럽게 수행해야합니다. 페이지가 로딩 할 때 JavaScript에 직접 의존하면 끝나는 js 오류가 발생할 수 있습니다.

jquery와 같은 라이브러리는 많은 도움이됩니다. DOM을 사용할 수있게되면 js 액션 만 수행되므로 js가 HTML의 맨 아래에로드되면 js 오류가 발생하지 않습니다.

또 다른 흥미있는 일은 js 파일을 적절하게 축소 된 상태로 유지하고 최소한의 파일을 유지해야한다는 것입니다. 이렇게하면 서버 요청을 몇 번만하고 JavaScript 적은 시간에 쉽게 사용할 수 있습니다.

희망이 도움이됩니다.