HTML của bạn tải nhanh vì nó đến từ bộ đệm của trang web của bạn, nhưng các tài nguyên được tải qua CDN của Cloudflare (tệp CSS và JavaScript của bạn) sẽ mất nhiều thời gian hơn để tải. https. //www. kiểm tra trang web. org/result/200121_TT_8ed4f6914b25a528ab8b0e27e6500d20/ Show Tôi khuyên bạn nên liên hệ với bộ phận hỗ trợ của Cloudflare về điều này. https. //ủng hộ. đám mây. com/hc/en-us/articles/200172476-Contacting-Cloudflare-Support Trình bắt đầu chủ đề phương tiện chặn (@meanwood) Cảm ơn bạn, tôi vừa mở một vé ở đó, sẽ đăng kết quả ở đây Trình bắt đầu chủ đề phương tiện chặn (@meanwood) Được rồi, sau khi điều tra thêm về vấn đề này, hóa ra cloudflare không phải là nguyên nhân gây ra vấn đề này. Chúng tôi đã tạm thời vô hiệu hóa cloudflare cho trang web của mình và nhận thấy sự cố vẫn tiếp diễn. – Chúng tôi cũng đã nhận thấy rằng sự cố không xảy ra với trình duyệt chrome nhưng thực sự xảy ra với trình duyệt firefox, bạn có ý kiến nào khác không? Người điều hành James Huff (@macmanx) Người điều hành tình nguyện Các tệp tĩnh vẫn đến qua Cloudflare. Đây là một đoạn nhỏ từ nguồn của bạn Trình bắt đầu chủ đề phương tiện chặn (@meanwood) Vâng, tôi đã thử nghiệm nó và sau đó kích hoạt lại cloudflare, vì vậy bây giờ chúng lại đến từ đó, vâng Người điều hành James Huff (@macmanx) Người điều hành tình nguyện Ok, để thực sự đi sâu vào vấn đề này, bạn cần phải tắt Cloudflare đi, nó hơi cản trở. 🙂 Trình bắt đầu chủ đề phương tiện chặn (@meanwood) được rồi nó tắt Người điều hành James Huff (@macmanx) Người điều hành tình nguyện Tôi thực sự không thấy bất kỳ sự chậm trễ nào khi tắt Cloudflare và đó là trong Firefox 72. 0. 2 Có vẻ như sự chậm trễ có thể liên quan cụ thể đến bộ nạp tên lửa của Cloudflare Trình bắt đầu chủ đề phương tiện chặn (@meanwood) Ok, đã bật lại cloudflare và tắt bộ nạp tên lửa nhưng vẫn không khắc phục được Người điều hành James Huff (@macmanx) Người điều hành tình nguyện Vâng, vì vậy nó không phải là. Tôi thấy rất nhiều thẻ tải trước trong nguồn của bạn và tôi cho rằng thẻ đó đến từ bộ nạp tên lửa, nhưng hiện tại tôi không chắc lắm Bạn có đang sử dụng bất kỳ plugin tối ưu hóa nào không? mỗi https. //www. kiểm tra trang web. org/result/200210_ZX_b39a549f08e6aa4de8fcaf431340a203/ mà tôi đã chạy trên Firefox cho thấy CSS của bạn không tải cho đến khoảng mục 58, điều này đối với tôi có vẻ như một kỹ thuật viên tối ưu hóa đã sắp xếp sai thứ tự các mục Trình bắt đầu chủ đề phương tiện chặn (@meanwood) Hmm, plugin tối ưu hóa, tôi có thể thử tắt bộ nhớ đệm litespeed Sau đó tôi đã nhận Đã tắt tất cả chúng ngay bây giờ ngoại trừ ssl thực sự đơn giản
Người điều hành James Huff (@macmanx) Người điều hành tình nguyện Tôi chắc chắn không gặp sự cố ngay bây giờ và theo thác nước tại https. //www. kiểm tra trang web. org/result/200211_QK_52e4ce0250f4c60a3905c164f138a8d7/ CSS của bạn hiện đang tải đầu tiên Vì vậy, nó là một trong những. 🙂 Điều dễ dàng nhất để làm bây giờ là bật lại từng cái một và mỗi lần kiểm tra bằng https. //www. kiểm tra trang web. org (đảm bảo rằng bạn đã đặt Firefox làm trình duyệt thử nghiệm, vì đó là tất cả những gì nó luôn xảy ra) Bạn sẽ nhận thấy thác nước lần này, CSS của bạn được tải ở mục 3, trong khi lần trước nó tải ở mục 58, vì vậy đó là những gì bạn đang tìm kiếm cho mỗi bài kiểm tra Trình bắt đầu chủ đề phương tiện chặn (@meanwood) Được rồi, tôi đã có thể giải quyết vấn đề này với cài đặt cấu hình của plugin LiteSpeed. Bây giờ, ít nhất là khi tôi sử dụng webpagetest, có vẻ như css đang tải ở các hàng đầu tiên Làm cách nào để áp dụng CSS trước khi tải trang?Vì trình duyệt phải đợi tất cả CSS được tải nên điều quan trọng là phải cung cấp CSS càng nhanh càng tốt. Một cách rất đơn giản để đảm bảo trình duyệt nhận CSS sớm nhất có thể là đưa CSS vào phần HEAD của tài liệu HTML của bạn . Bằng cách này, trình duyệt sẽ bắt đầu tải CSS ngay khi có thể.
Điều gì xảy ra với CSS khi chúng tôi tải lên một trang web?Trình duyệt sẽ lấy cây hiển thị đó và cung cấp cho Công cụ định dạng trực quan . Công cụ định dạng trực quan sẽ tạo bố cục cuối cùng của trang sẽ tạo phiên bản trực quan cuối cùng của mã HTML và CSS của chúng tôi.
Tôi nên tải CSS hay JS trước?Khi nói đến việc sắp xếp CSS và JavaScript của bạn, bạn muốn CSS của mình được đặt lên hàng đầu . Lý do là chuỗi hiển thị có tất cả thông tin về kiểu mà nó cần để hiển thị trang. Nếu JavaScript bao gồm đến trước, công cụ JavaScript phải phân tích cú pháp tất cả trước khi tiếp tục với bộ tài nguyên tiếp theo.
Làm cách nào để tải JS và CSS nhanh hơn?Cách làm cho JavaScript của bạn tải nhanh hơn . tải chậm. Không phải tất cả JavaScript đều yêu cầu tải ngay lập tức khi người dùng truy cập trang web lần đầu tiên. . thu nhỏ. Giảm thiểu là một cách dễ dàng để cải thiện hiệu suất rất nhiều. . gói. Kích thước tập lệnh không phải là điều duy nhất quan trọng. . Tách mã. . rung cây. . Mô-đun ECMAScript. . CDN. . Bộ nhớ đệm |
