Nội dung trên thế giới là gì trong Google Pagespeed là gì?

Cho đến gần đây, trang web của tôi (www.heatexchangers.ca) đã ghi được 98% trên Google Page Speed. Có một vài điều tôi không thể làm gì được, chẳng hạn như chuỗi truy vấn từ phông chữ web. Tôi rất hài lòng với điều này vì nó đại diện cho tất cả những gì tôi có thể làm.

Gần đây, Google đã thêm một số thứ khác ảnh hưởng đến điểm tốc độ trang và hiện tôi chỉ nhận được 89% trên Tốc độ trang và nhận được đề xuất này:

• Loại bỏ JavaScript và CSS chặn kết xuất bên ngoài trong nội dung trong màn hình đầu tiên.

Đề xuất để khắc phục điều này dường như liên quan đến việc troll qua tất cả các tệp .css và .js của tôi và tách một số phần của chúng và thêm chúng vào dòng html của tôi. Điều này gây cho tôi một số nhầm lẫn vì tôi có ấn tượng rằng chúng ta phải giữ càng nhiều mã JavaScript và CSS ra khỏi HTML càng tốt.

Chính xác nội dung "Trên màn hình" là gì? Nếu đó là một vài phong cách như phông chữ, màu nền vv; sau đó tôi có thể thấy nó có thể không phải là một thỏa thuận quá lớn để bao gồm nội tuyến. Tôi đã không thể tìm thấy một danh sách chính xác đây là gì.

Điều này là do Google gần đây đã thay đổi công cụ tốc độ trang để phản ánh tốt hơn một web ngày càng di động. Mạng dữ liệu di động có các đặc tính hiệu suất khác với mạng có dây hoặc wifi, vì vậy bạn cần làm những việc khác nhau để tối ưu hóa cho chúng.

Trên màn hình đầu tiên (ATF) chỉ đơn giản là giá trị của màn hình đầu tiên - bất cứ điều gì bạn không cần phải cuộn để xem. Rõ ràng, điều này thay đổi tùy thuộc vào thiết bị và hướng của thiết bị, vì vậy bạn có thể cần khái quát hóa và có thể tìm thấy một số tùy chọn phổ biến khả thi, có thể là một điện thoại thông minh nhắm mục tiêu, một cho máy tính bảng và một cho máy tính để bàn lớn hơn.

Đối với CSS mà họ đang nói đến, họ thực sự có ý định tất cả CSS cần thiết để tạo kiểu hoàn toàn cho bất kỳ nội dung nào được hiển thị ATF. Để xác định thời gian tải nội dung ATF của bạn, họ sẽ chụp ảnh màn hình của phiên bản cuối cùng và so sánh trực quan với trang khi nó tải và khi nó đủ giống nhau, họ sẽ xem xét điểm đó có nội dung ATF Nó đã nạp đầy.

Đây là một bài thuyết trình video từ Google về chủ đề này:

http://www.youtube.com/watch?v=YV1nKLWoARQ

Trọng tâm là khiến người dùng phải làm gì đó trong giây đầu tiên. Lý do đằng sau việc đưa CSS cho nội dung ATF trực tiếp vào HTML phản ánh nghiên cứu của họ về hiệu suất dữ liệu di động cho thấy rằng nếu CSS không có ở đó, nó sẽ không được tải đủ sớm trong giây đầu tiên.

Họ cũng cung cấp các liên kết đến các công cụ có thể tự động hóa một số điều này. Tôi chưa thử chúng và YMMV.

thông tin chi tiết về trang google sẽ cho bạn biết rõ có bao nhiêu% css giới thiệu nội dung trên màn hình đầu tiên đang được tải quá muộn và trang có thể được hiển thị trước đó. Hơn bạn có thể di chuyển các phần của css để đạt được kết quả xanh. tôi có thể làm điều đó cho bạn: goo.gl/GsRxNc

một liên kết từ Google mô tả 'trên màn hình đầu tiên https://developers.google.com/speed/docs/insights/OptizesCSSDelivery

Nội dung trong màn hình đầu tiên là phần của trang web hiển thị trong cửa sổ trình duyệt khi trang tải lần đầu tiên. Google muốn xem CSS nội tuyến được trích xuất từ ​​tệp CSS chính của bạn và được thêm vào thẻ đầu, cho phép mọi thứ bạn thấy đầu tiên được tải trước tiên.

nguồn - https://www.c2experience.com/blog/passing-googles-abovethefold-css#:~:text=Above%2Dthe%2Dfold%20content%20is,first%20to%20be%20loaded%20first .

Họ đề cập đến các js chặn kết xuất, chẳng hạn như phân tích hoặc mã theo dõi, đó là lý do tại sao họ khuyên bạn nên đặt các tập lệnh "tải tôi trước mọi thứ khác" vào chân trang khi chúng sẽ được tải khi người dùng có trang web trên màn hình.