HTML để phân tích cú pháp/script thực hiện lệnh

Question

những dòng sau là từ chính thức jQuery website

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script>!window.jQuery && document.write('<script src="http://code.jquery.com/jquery-1.4.2.min.js"><\/script>');</script> 

Tôi không chắc chắn về thứ tự phân tích cú pháp HTML, hay tôi nên nói để thực hiện kịch bản.

Câu hỏi đặt ra là: Dòng 2 có chờ dòng 1 tải không? Tôi nghi ngờ điều đó.

Nếu dòng 1 vẫn đang được tải (nói là 3000KB và mất nhiều thời gian) và dòng 2 được thực thi. window.jQuery sẽ luôn là false và vì vậy js thứ hai luôn được bao gồm. Nếu đó là sự thật, thì dòng 1 là gì?

Answer 1

Các tập lệnh được thực thi theo thứ tự trong tài liệu. Trình duyệt chờ tập lệnh tải trước khi thực thi các tập lệnh theo sau nó.

Nếu trường hợp này không xảy ra, bạn không thể có hai tệp phụ thuộc lẫn nhau. Bạn sẽ phải đặt tất cả mọi thứ trong cùng một tập tin bởi vì nếu không thì lệnh thực thi tập lệnh sẽ thực tế là ngẫu nhiên.

Answer 2

Có, nó sẽ đợi với phân tích cú pháp bất kỳ html nào cho đến khi tập lệnh được tải và phân tích cú pháp. Đây là một trong những lý do tại sao bạn nên tải externa script ở cuối trang của bạn để kịch bản sẽ không chặn các rendering html.

Answer 3

Hãy nói về cách truyền thống hơn về xử lý mà không cần sử dụng thuộc tính defer hoặc async

Các trình duyệt sẽ:

1. Tải script s, ngăn chặn các nguồn lực khác từ tải

2. Phân tích các tập lệnh

3. Thực hiện các script

Xem Ch1, Bốc Thi từ High Performance JavaScript

Đây là một tài liệu tham khảo tốt 12,3. Thực hiện các Chương trình JavaScript từ JavaScript: The Definitive Guide, 4th Edition