JavaScript có nên được tham chiếu trong phần đầu nên được phục vụ từ cùng tên máy chủ với tài liệu chính không?

Tôi có ấn tượng rằng để có hiệu suất tốt nhất, Javascript nên được coi là nội dung tĩnh và được phục vụ từ một miền không nấu ăn cùng với các tệp CSS, hình ảnh, v.v.

Nhưng Google nói ở đây: Không phục vụ các tệp JS bên ngoài được tải sớm từ miền vô dụng

Đối với JavaScript được tham chiếu trong phần đầu của tài liệu và cần thiết để khởi động trang, nó phải được phục vụ từ cùng tên máy chủ với tài liệu chính. Bởi vì hầu hết các trình duyệt chặn các tải xuống và kết xuất khác cho đến khi tất cả các tệp JavaScript đã được tải xuống, phân tích cú pháp và thực thi, tốt hơn hết là tránh rủi ro tìm kiếm DNS bổ sung tại điểm xử lý này.

Vì vậy, bây giờ tôi bị xung đột. Tôi không rõ "cần thiết cho khởi động trang" nghĩa là gì.

Tôi thường có hai tham chiếu JavaScript, JQuery được cung cấp từ ajax.googleapis.com và tệp master.js chứa hầu hết các trình xử lý sự kiện trong hàm $ (document). Yet (). Đây có phải là cần thiết để khởi động trang?

Đưa ra các tùy chọn có sẵn, (ajax.googleapis.com, tên miền không nấu ăn tĩnh, tên máy chủ gốc) nên phục vụ JavaScript của tôi ở đâu?

Vì vậy, bây giờ tôi bị xung đột. Tôi không rõ "cần thiết cho khởi động trang" nghĩa là gì.

Điều này rất nhiều phụ thuộc vào cách chức năng trang web của bạn. Về cơ bản, đó là JavaScript cần chạy trước khi ai đó có thể sử dụng trang web.

Ví dụ: nếu bạn truy cập http://www.weather.com/ , bạn có thể thấy rằng những người tốt đã quyết định sử dụng một số phép thuật JavaScript để cung cấp gợi ý cho biểu mẫu tìm kiếm thời tiết. Tức là các từ Enter Zip, City or Place (e.g. Disney World)xuất hiện trong trường nhập văn bản. Thật không may, có một chút chậm trễ khi trang đang tải, ít nhất là về phía tôi. Vì vậy, nếu trang đủ chậm để tải và bạn đủ nhanh để bắt đầu nhập văn bản nhập trước khi JavaScript thực thi - không phải là một đoạn - thì đầu vào của bạn có thể bị khóa bởi JavaScript mà đặt một cách mù quáng gợi ý đó văn bản trong hộp đầu vào.

Cấp, điều này có thể tránh được bằng cách kiểm tra đầu vào của người dùng trong hộp văn bản trước hoặc đơn giản là từ bỏ kỹ thuật lỗi thời này. Tuy nhiên, sau đó nó sẽ không phải là một ví dụ rất tốt.

Đưa ra các tùy chọn có sẵn, (ajax.googleapis.com, tên miền không nấu ăn tĩnh, tên máy chủ gốc) nên phục vụ JavaScript của tôi ở đâu?

Điều này thực sự không thể được trả lời mà không biết JavaScript của bạn làm gì. Ngoài ra, như bpeterson76 ám chỉ, nó phụ thuộc vào tình huống cụ thể của trang web của bạn. Tức là trang này rộng bao nhiêu? nhu cầu đáp ứng máy chủ của bạn tốt như thế nào? Có bao nhiêu tệp CSS, hình ảnh, vv nó tải? Có bao nhiêu tài nguyên bên ngoài đang tải?

Tùy thuộc vào tình huống cụ thể của bạn, đây có thể là tối ưu hóa sớm.

Các "bất cứ điều gì cần thiết trước khi trang sẽ bắt đầu vẽ nên từ cùng một máy chủ" quy tắc chung áp dụng cho bạnmáy chủ hoặc các tài nguyên nhỏ hơn khác - các tình huống trong đó việc tra cứu DNS có thể chiếm một phần đáng chú ý trong một giây (có thể tăng lên nhanh chóng nếu các đối tượng của bạn bị ném xung quanh nhiều tên miền). Với các tài nguyên công cộng phổ biến như bộ đệm jQuery của jQuery và các thư viện khác, rất có thể trình duyệt của khách truy cập của bạn đã thực hiện tra cứu DNS ngày hôm nay (vì các trang web khác đang tham chiếu nội dung từ dịch vụ đó) và có lẽ cũng có tệp trong bộ đệm. chuyển cần phải được thực hiện (hoặc nếu một yêu cầu được thực hiện, nó có thể chỉ nhận lại phản hồi "304 - không sửa đổi" ngắn). Ngay cả khi cần tải xuống đầy đủ cho đối tượng, mạng phân phối nội dung của Google sẽ nhanh hơn đối với hầu hết người dùng so với hoạt động quy mô nhỏ hơn của bạn.

Một quy tắc liên quan: các đối tượng không được yêu cầu cho chức năng chính xác của trang (như người dùng nhìn thấy) nên được gọi càng muộn càng tốt trong phản hồi HTTP chính. Ví dụ: những thứ như tập lệnh được yêu cầu cho dịch vụ quảng cáo / thống kê (ví dụ Google Analytics và ilk của nó) - cung cấp cho người dùng nội dung của bạn càng nhanh càng tốt, sau đó tải nội dung nền chỉ thực sự khiến bạn quan tâm. Tôi đã chặn một vài dịch vụ quảng cáo / thống kê (bằng cách ánh xạ chúng tới 127.0.0.1 trong tệp máy chủ của tôi) vì chúng thường quá chậm và các trang web đề cập đến chúng sớm chỉ cho tôi một trang trống trong khi các tập lệnh được chờ thay thế về việc đề cập đến họ muộn để tôi có thể đọc nội dung tôi đang ở đó trong khi các công cụ khác nằm trên nền.

Tính hữu ích của miền không có cookie đối với nội dung tĩnh là vấn đề quy mô. Nếu tất cả những gì bạn có là một ID phiên 10 byte trong cookie và mười nghìn khách truy cập mỗi ngày yêu cầu ~ 20 đối tượng tĩnh mỗi lần truy cập, bạn chỉ tiết kiệm ~ 118Mbyte băng thông mỗi tháng (20 * 20 * 10000 * 31/1024/1024). Mặt khác, trang web của bạn giữ một hoặc hai thứ có giá trị Kbyte trong cookie, sự khác biệt có thể quan trọng hơn nhiều, đặc biệt là nếu bất kỳ người dùng nào của bạn truy cập trang web thông qua các kết nối chậm (ví dụ: GPRS thông qua kết nối với điện thoại di động hoặc qua liên kết wifi bị chặn trong khu vực có nhiễu cao) hoặc nếu bạn nhận được hàng triệu lượt truy cập mỗi ngày.

Tóm lại, đối với các tập lệnh phải được tải trước khi trang có thể hiển thị tùy chọn của tôi sẽ là:

1. ajax.googleapis.com hoặc tương tự
2. tên máy chủ ban đầu của trang gọi
3. tên miền không có cookie tĩnh

Đối với các tài nguyên không cần thiết cho kết xuất trang ban đầu, hãy tham khảo chúng càng muộn càng tốt và đảo ngược danh sách ưu tiên ở trên (mặc dù sự khác biệt giữa tên máy chủ ban đầu và tên miền không có cookie rất có thể không đáng kể trừ khi bạn đang hoạt động ở quy mô lớn ).

Google điều hành một mạng nội dung khổng lồ được phân phối trên toàn thế giới, đặt nội dung gần với người dùng hơn bất kỳ máy chủ nào mà bạn có khả năng đang chạy (nghĩ là Akami, nhưng thuộc sở hữu của Google) Vì vậy, từ quan điểm tốc độ, lý do là Google sẽ chuyển tệp của bạn đến người dùng nhanh hơn máy chủ cục bộ của bạn ... trừ khi họ ở rất gần máy chủ cá nhân của bạn.

Câu hỏi này đã được đưa ra xung quanh tại Stackoverflow, và câu trả lời ở trên dường như luôn luôn là sự đồng thuận. Nhưng từ quan điểm thực tế, lợi ích đạt được bằng cách lưu trữ ở mức này so với mức khác sẽ khá tối thiểu trong thời gian dài. Bạn sẽ nhận được lợi ích tốt hơn nhiều từ việc giảm thiểu, tối ưu hóa và giảm các yêu cầu http tổng thể hơn là bạn sẽ xem xét kỹ lưỡng nơi mọi thứ được định vị. Trong những tình huống bắt đầu có vấn đề (tôi đã làm một công việc trong đó một trang đang tải hơn 1,5 triệu lần / ngày, vì vậy cải thiện 5k có nghĩa là tiết kiệm 5 băng thông) thường có một nhóm các nhà ra quyết định được giao nhiệm vụ xem xét các quyết định này.

Cá nhân, tôi thường lưu trữ tại Google vì lý do duy nhất là họ sẽ cung cấp cho tôi bản sao cập nhật nhất về những gì tôi đang tìm kiếm.

Một điều quan trọng cần nhớ là các trình duyệt có giới hạn về số lượng tài nguyên sẽ tải xuống đồng thời từ cùng một tên miền, thường là từ 2 đến 6 tùy thuộc vào trình duyệt. Sử dụng một tên miền khác cho phép trình duyệt tải xuống nhiều thứ cùng lúc từ miền của bạn.

Vì vậy, giải pháp tốt nhất là sử dụng một CDN phổ biến như ajax.googleapis.com vì cách đó không có cookie. Người dùng có thể đã thực hiện tra cứu DNS và thậm chí có thể lưu trữ tài nguyên. CDN được tối ưu hóa cho tốc độ và có thể có một máy chủ gần với người dùng của bạn.

Nếu CDN không phải là một tùy chọn thì nếu bạn có nhiều cookie hoặc có nhiều tài nguyên để tải xuống (hình ảnh, v.v.) thì hãy sử dụng tên miền không có cookie (chỉ cần thực hiện tra cứu DNS một lần nào đó).

Nếu bạn có ít tài nguyên (chỉ một tệp javascript tùy chỉnh) và một vài cookie (chỉ một id phiên nhỏ) từ cùng một tên miền.

Tài nguyên tốt:

http://www.phpied.com/free-falling-water thác /

http://www.stevesouders.com/blog/2009/04/27/loading-scripts-without-blocking/

http://developer.yahoo.com/performance/rules.html

Mặc dù các câu trả lời ở trên đã phân tích hầu hết câu hỏi của bạn, tôi sẽ đóng góp vào "cần thiết cho khởi động trang". Tôi dịch cái này sang: tập lệnh này có cần thiết để sử dụng trang web không? Từ kinh nghiệm, thường thì câu trả lời là không. Tuy nhiên, trường hợp khi tôi sẽ:

• Xác nhận mẫu
• Điều hướng dựa trên JavaScript (dù sao không lý tưởng)
• Nếu bố cục phụ thuộc vào JavaScript
• Nếu JavaScript hoặc thư viện (như jQuery) được sử dụng cho các sửa đổi DOM rất quan trọng

Và hướng dẫn hiệu suất YSlow của Yahoo để tham khảo.