Làm thế nào lớn là "quá lớn" cho một tập tin javascript

Question

Với tất cả các plugin jQuery tuyệt vời ra khỏi đó, nó rất hấp dẫn để chỉ bắt đầu bao gồm chúng trên tất cả các nơi để tăng cường giao diện của trang web của chúng tôi.

Tôi đang tìm một số ý kiến ​​về việc liệu tôi có nên quan tâm đến kích thước của các tập lệnh này hay không.

Giả sử chúng được lưu trữ ở cấp độ máy chủ web, vì vậy tôi đoán các mối quan tâm tiềm năng là băng thông cho các tập lệnh được phân phát từ máy chủ web, cũng như hiệu suất trên trình duyệt của khách hàng cần tải xuống tất cả các tập lệnh này .

Answer 1

Có hai vấn đề ở đây như bạn đã đề cập.

Đầu tiên là tải trên máy chủ. Nếu đây là vấn đề, bạn có thể sử dụng số Google AJAX Libs APIs và nhận lib trực tiếp từ CDN của Google.

Vấn đề thứ hai là thời gian tải phía máy khách. Vâng, bạn nên quyết định đối tượng mục tiêu của bạn là ai và bạn sẽ phải chờ bao lâu để người dùng chờ đợi. Theo nguyên tắc chung, hầu hết các trang web hiện tiêu thụ ~300KB băng thông trên mỗi trang, bao gồm tập lệnh, biểu định kiểu và hình ảnh.

Answer 2

Bao lâu là một đoạn chuỗi?

Tùy thuộc vào băng thông của đối tượng mục tiêu của bạn, băng thông của (các) máy chủ và giá trị tương đối mà JS cung cấp.

Answer 3

Bạn phải đặt nó trong phối cảnh. Xem thời gian tải trang của bạn và tỷ lệ phần trăm đó là javascript. Thông thường nó không phải là lớn.

Vì js thường thêm niceties vào một trang web, nó có thể không quan trọng nếu nó tải cuối cùng hoặc tương đối chậm, miễn là nó không chặn các phần tử khác được tải.

Theo cách tôi thấy, nếu bạn cần chức năng, bạn sẽ phải tải mã để không thể tránh khỏi. Nếu nó trang trí, sau đó tải js trang trí cuối cùng, và nó tốt hơn để có nó một chút muộn hơn là không có nó ở tất cả.

Answer 4

Như những người khác đã nói cho jQuery chính nó là tốt nhất để sử dụng bất kỳ bản sao lưu trữ CDN công cộng, tôi cũng khuyên bạn nên xem xét sử dụng một công cụ để gói các plugin/script tùy chỉnh của bạn thành một gói có ý nghĩa. Những điều này sẽ khác nhau tùy thuộc vào loại máy chủ của bạn nhưng 2 công cụ phổ biến là ASP.NET ScriptManager Control - Script Combining - What's the big deal? và Bundler - Bundler Now Supports Css And .less. Trên bài viết thứ hai có nhiều thông tin về chủ đề này nói chung.

Chỉnh sửa: Giải pháp hiện tại tôi sử dụng với .NET là http://getcassette.net/ Cassette cung cấp câu chuyện hay nhất để phát triển ASP.NET, bạn chỉ lưu trữ .debug. bản sao của các tệp JS trong giải pháp, các tệp javascript dễ dàng nhận được intellisense, khi bạn chạy trong gỡ lỗi bạn nhận được tất cả các tệp js gỡ lỗi và khi bạn chạy với debug = false, kết hợp và rút gọn. Trong cả hai trường hợp, chúng đều có chuỗi truy xuất bộ nhớ cache, do đó bạn không bao giờ phải lo lắng về shift + refresh để không sử dụng javascript cũ.

Answer 5

Tôi không nghĩ bạn nên lo lắng quá nhiều về điều đó. Thông thường, các hình ảnh sẽ tiêu thụ hầu hết băng thông của bạn và không phải tệp Javascript.

Nếu bạn muốn tăng tốc trang web của mình, việc giảm số lượng yêu cầu HTTP trong trang của bạn là nơi bắt đầu. Điều này có lẽ sẽ cung cấp cho một tăng hiệu suất tốt hơn nhiều. Hãy thử nén tất cả các tệp .js của bạn thành một và sử dụng các kỹ thuật CSS sprite để hiển thị hình ảnh của bạn.