Ads Top

Hệ thống Khách sạn gần Sân bay giá rẻ | Phòng chờ bay

3 công cụ kiểm tốc độ trang web nhanh và dễ dàng

Tốc độ trang chậm làm ảnh hưởng đến thứ hạng tìm kiếm của Google của bạn? Tiến hành kiểm tra tốc độ trang sẽ giúp bạn tìm ra.

Nhưng bạn bắt đầu ở đâu?

Dưới đây là ba công cụ bạn có thể sử dụng để thực hiện kiểm tra tốc độ trang nhanh và toàn vẹn để giúp nỗ lực tối ưu hóa tốc độ trang của bạn.

1. Công cụ dành cho nhà phát triển của Google Chrome

Hãy bắt đầu với công cụ đơn giản và hữu ích nhất: Công cụ dành cho nhà phát triển của Google Chrome. Công cụ đi kèm với Chrome và bạn có thể truy cập nó bằng cách nhấp chuột phải vào bất kỳ trang nào trong Chrome, chọn kiểm tra và chuyển sang tab mạng.

Công cụ dành cho nhà phát triển Chrome
Đây là những gì mà bảng điều khiển mạng công cụ dành cho nhà phát triển trông giống như
Các loại thông tin chi tiết bạn có thể nhận được từ công cụ này là vô giá và có thể cung cấp cho bạn một ý tưởng tốt về nơi và những gì các khu vực có vấn đề trên trang web của bạn.

Dưới đây là một số mẹo khi chạy các bài kiểm tra của bạn:
  • Vô hiệu hoá bộ nhớ cache: Điều này cho phép bạn bắt chước trải nghiệm của một khách truy cập mới. Vì khách truy cập mới sẽ phải tải xuống tất cả nội dung của bạn để lưu trữ bộ nhớ cache, điều này cho phép bạn xem nơi mà trang web của bạn đứng về tốc độ tải.
  • Bật chụp màn hình: Nhấp vào biểu tượng máy ảnh. Thao tác này sẽ cung cấp cho bạn ảnh chụp nhanh tiến trình tải của trang. Bạn có thể thấy cách người dùng mới trải nghiệm trang web của bạn với số lần cho đến khi trang hoàn tất tải đầy đủ.
  • Chuyển đổi giữa các màn hình thiết bị di động khác nhau: Thanh công cụ của thiết bị chuyển đổi ở góc trên cùng bên trái cho phép bạn chuyển đổi giữa các thiết bị khác nhau. Chrome có một vài cài đặt thiết bị đã được đặt trước và cho phép bạn chỉnh sửa các thứ nguyên cụ thể. Bạn có thể xem trang của bạn tải như thế nào trên các độ phân giải màn hình khác nhau và nơi bạn có thể thiếu trải nghiệm máy tính để bàn hoặc di động.
  • Chuyển đổi giữa các tốc độ kết nối khác nhau: Các tùy chọn điều chỉnh này cho phép bạn kiểm tra cách trang của bạn thực hiện trên các loại kết nối internet khác nhau. Điều này đặc biệt có giá trị khi thử nghiệm cho thiết bị di động. Bạn có thể thấy chính xác cách người dùng mới trải nghiệm trang web của mình từ mạng wifi tại nhà và kết nối 4G hoặc 3G. Google đã đề cập rằng trang đích trung bình trên điện thoại di động tải trong 22 giây, có vẻ như không thể tin được lúc đầu, nhưng đã trở thành sự thật khi thử nghiệm một số trang web trên kết nối 3G.
Trong ví dụ về kinh nghiệm trên máy tính để bàn này, tôi đã kiểm tra 'Disable cache' và chọn 'Capture screenshots'. Tôi có thể bắt đầu kiểm tra tốc độ tải trang cơ bản từ thời điểm này, tất cả ở một nơi thuận tiện.

Làm theo hướng dẫn để tải lại trang bằng công cụ kiểm tra; Nếu bạn đang sử dụng Windows, đó là F5, và nếu bạn đang sử dụng Mac, đó là CMD-R.

Điều gì xảy ra bây giờ là trang web của bạn sẽ tải, chụp ảnh chụp màn hình và tạo biểu đồ thác nước về cách trang của bạn đang tải từng tài nguyên và thứ tự nào. Xuất sắc!

Hiện có rất nhiều thông tin để xử lý ngay bây giờ và chúng tôi sẽ tìm hiểu những vấn đề thường gặp mà bạn có thể gặp phải khi thực hiện nhiều việc này.

Footer sẽ cho bạn biết một số thông tin quan trọng bạn nên đăng nhập:
  • Yêu cầu của máy chủ
  • Bytes đã chuyển
  • Thời gian hoàn thành
  • DOMContentLoaded
  • Thời gian tải
Ví dụ của chúng tôi, tôi có thể thấy một ảnh chụp màn hình trong 2 giây, nơi hình ảnh anh hùng chính chưa được tải. Đây không phải là một kinh nghiệm lý tưởng. Nếu bạn tham khảo biểu đồ thác nước, bạn có thể thấy chính xác hình ảnh anh hùng chính là trong danh sách ưu tiên khi tải trang.

Điều tuyệt vời về công cụ này là nó đi kèm với một vài bật / tắt. Các nút bật này cho phép bạn lọc các tài nguyên được tải trên trang. Đây chỉ là một ví dụ, nhưng đối với các trang web tương đối lớn sử dụng rất nhiều hình ảnh, chúng có xu hướng bị chậm lại do thiếu hình ảnh nén hoặc chỉ là số lượng hình ảnh nói chung chiếm phần lớn các yêu cầu của máy chủ trên trang.

Với Công cụ dành cho nhà phát triển của Chrome, bạn có thể định lượng lượng không gian mà các yếu tố cụ thể đang chiếm lĩnh và đánh giá rõ nơi để cạo mỡ trên trang web của bạn.

Đối với trang web này, tôi đã chuyển sang hình ảnh và có thể thấy rằng hình ảnh cho trang này chiếm 29/33 yêu cầu máy chủ cho trang này và đóng góp 3,2 / 3.6MB tổng trọng lượng trang. Vì vậy, một nơi rõ ràng để bắt đầu ở đây sẽ là để nén các hình ảnh hoặc xem xét thậm chí loại bỏ một số hình ảnh nếu chúng ta muốn cải thiện hiệu suất tốc độ trang.

Bạn cũng có thể chuyển qua biểu đồ thác nước và xem những gì tải đầu tiên trên trang của bạn. Lý tưởng hơn, không muốn bất kỳ tệp JavaScript không cần thiết nào được đặt trước bất kỳ phần tử hình ảnh mong muốn nào của trang. Điều này gây ra sự chậm trễ trong việc hiển thị nội dung chính của trang; Nếu có thể, bạn sẽ muốn chuyển các tệp JavaScript xuống dưới cùng, dưới tất cả nội dung cơ thể, để không can thiệp vào việc hiển thị trang.

Để có được thông tin đầy đủ về cách khai thác tối đa công cụ này, hãy kiểm tra tài liệu của Google về Đo lường tải tài nguyên và xem công cụ này có thể giúp bạn hiểu rõ hơn về công cụ này như thế nào.

Bài kiểm tra tốc độ trang của Google

Chúng tôi có thể sử dụng Kiểm tra tốc độ trang của Google như là một nơi tốt để bắt đầu tìm ra các vấn đề chính xác mà Google cho rằng ảnh hưởng tiêu cực.

Như bạn thấy, có rất nhiều lĩnh vực để cải tiến được xác định bởi Google.
3 công cụ kiểm tốc độ trang web nhanh và dễ dàng

Điểm số cho trang này là 54/100 - chắc chắn không lý tưởng. Chúng tôi thấy các khuyến nghị bao gồm:
  • Bật nén
  • Tối ưu hóa hình ảnh
  • Tận dụng bộ nhớ đệm trình duyệt
  • Loại bỏ JavaScript ngăn chặn hiển thị và CSS trong nội dung trên màn hình đầu tiên
  • Giảm thiểu JavaScript
Bạn có thể đi sâu hơn vào từng đề xuất và tìm hiểu thêm về cách tối ưu hóa tốc độ trang web của bạn từ các tài liệu dành cho nhà phát triển của Google.

GT Metrix cho các bước khả thi

Một công cụ tuyệt vời khác để thực hiện một số phân tích trang nhanh là GT Metrix. GT Metrix xếp hạng trang của bạn dựa trên các Thử nghiệm tốc độ trang của Google và tiêu chí YSlow, nhưng các đề xuất có chi tiết hơn và tất cả ở một nơi - hữu ích cho việc kiểm tra nhanh.

Chúng tôi đã xác định rất nhiều vấn đề với trang web của chúng tôi bằng cách sử dụng Thử nghiệm tốc độ trang của Google. Nhưng Google không cung cấp cho bạn bất kỳ lời khuyên nào có thể thực hiện được về cách khắc phục những vấn đề đó.
Ví dụ: Google sẽ cho bạn biết bạn có thể tiết kiệm bao nhiêu không gian nếu bạn nén những hình ảnh này, nhưng chúng sẽ không cung cấp cho bạn một phiên bản nén của hình ảnh, chúng không cho bạn biết chính xác cách tối ưu hóa các hình ảnh đó hoặc kích thước chính xác Bạn cần phải quy mô xuống.

Rất may, các báo cáo của GT Metrix có chi tiết và có thể thực hiện được.

GT Metrix cung cấp các thông tin sau đây mà nhiều công cụ khác sẽ không cung cấp, bao gồm:
  • Chuỗi chuyển hướng JavaScript
  • Tối ưu hình ảnh để tải xuống
  • Kích thước hình ảnh chính xác cho việc chia tỷ lệ
  • Ghi lại hình ảnh nén
Để phục vụ hình ảnh thu nhỏ, chúng ta có thể thấy điều gì đang xảy ra với một số hình ảnh trên trang đang tạm thời thay đổi kích thước trước khi chúng được tải. Chúng tôi có thể thay đổi kích thước hình ảnh theo kích thước chính xác bằng cách sử dụng công cụ chỉnh sửa ảnh như Photoshop hoặc công cụ miễn phí như Bulk Resize Photos và tải chúng lên trang của chúng tôi để khắc phục sự cố này.

Kết Luận

Tốc độ trang có thể được áp đảo, đặc biệt là nếu bạn không có nhiều nền tảng kỹ thuật trong phát triển.

Điều quan trọng là phải hiểu nơi các khu vực có vấn đề với mã và đưa nó vào tay một nhà phát triển có thể làm việc với bạn để cải thiện hiệu suất tổng thể của trang web.
Được tạo bởi Blogger.