Native Lazyload Plugin Load ảnh chính thức của Google

Giới thiệu chung

Vừa rồi Google đã phát triển Plugin Native Lazyload giúp tải ảnh khi cuộn trang, điều này cho phép giảm thời gian load web của bạn do trình duyệt web chỉ phải tải những phần nội dung đang được hiển thị trên màn hình thay vì tải tất cả cùng một lúc.

Tuy nhiên hôm nay mình mới viết được bài này do trong quá trình sử dụng, hỗ trợ các khách hàng và nhận được đánh giá thực tế rằng Plugin này rất tốt, giúp website load nhanh hơn và giảm được thời gian chờ.

Plugin rất dể sử dụng, việc bạn cần làm là cài đặt và kích hoạt là hoàn tất.

• Link download Native Lazyload

Trước khi cài đặt bạn nên vô hiệu lazyload hình ảnh của themes hoặc các Plugin tương tự để tránh xung đột.

Tại sao bạn nên chọn Native Lazyload?

Plugin Native Lazyload không có phần thiết lập và nó hoạt động theo nguyên tắc rất đơn giản:

• Nếu thuộc tính loading không được trình duyệt web hỗ trợ, plugin sẽ quay trở lại giải pháp JavaScript dựa trên IntersectionObserver.
• Đối với trường hợp JavaScript bị vô hiệu hóa, nhưng thuộc tính loading được trình duyệt web hỗ trợ, một biến thể noscript của phần tử tương ứng sẽ được thêm vào, bao gồm cả thuộc tính loading mà không có bất kỳ thay đổi nào khác.

Native Lazyload không sử dụng JavaScript để lazyload hình ảnh mà sử dụng chính tính năng có sẵn của trình duyệt web Google Chrome (đang chiếm khoảng gần 70% thị phần). Do đó, nó nhẹ và nhanh hơn rất nhiều so với các plugin hay code lazyload khác. Bạn hầu như không thể nhận ra tính năng lazyload đang hoạt động nếu tốc độ mạng và máy tính đủ nhanh (không thấy độ trễ khi load web). Chúng tôi cũng đang sử dụng plugin này trên tất cả hệ thống website của mình.

Kiểm tra xem plugin đã hoạt động hay chưa bằng cách click chuột phải vào 1 hình ảnh trên website của bạn, sau đó chọn Inspect (đối với trình duyệt Google Chrome). Nếu bạn thấy thẻ loading="lazy" xuất hiện trong mã nguồn HTML thì có nghĩa là plugin đã hoạt động bình thường.