11 Lazyload plugin tốt nhất dành cho WordPress

Nếu bạn đang tìm kiếm giải pháp để cải thiện tốc độ trang web, thì lazyload chắc chắn là một giải pháp hoàn hảo. Kỹ thuật này làm trễ yêu cầu HTTP trong khi nạp các tài nguyên ảnh với mục đích giảm tải yêu cầu load cùng 1 lúc, nhường nội dung hiển thị trước để tăng tốc thời gian tải trang.

Điều này sẽ làm giảm dung lượng của trang mang đến cho bạn thời gian tải trang nhanh hơn . WordPress có nhiều plugin giúp bạn tạo tính năng lazyload.

Và trong hướng dẫn này, mình đã chọn ra 1 vài plugin tốt nhất để tích hợp lazyload cho wordpress. Bạn sẽ tìm được plugin đơn giản cài đặt với chỉ một cú nhấp chuột và plugin phức tạp hơn mà  hỗ trợ cả video, gallery và hình ảnh trên cùng một trang.

1. BJ Lazy Load

Với BJ Lazy Load Plugin  cho bạn toàn quyền kiểm soát hoàn toàn cách thức tải nội dung trên trang của bạn. Điều này có thể áp dụng với nội dung bình luận của người dùng, hình ảnh trong trang, và thậm trí cho iframe  & video nhúng.

Plugin cho bạn các tùy chọn, do đó bạn kiểm soát các tính năng mà bạn muốn. Nó cũng không ảnh hưởng đến trải nghiệm người dùng quá nhiều đến nỗi bạn cảm thấy như không có gì đang xẩy ra.

Lưu ý plugin hoạt động dựa trên JavaScript giống như rất nhiều plugins lazyload khác trong WP plugin repo. Điều này có nghĩa bạn sẽ không nhận được hiệu ứng tương tự với người dùng vô hiệu hóa JS trên trình duyệt của họ, và thay vào đó là hình ảnh tải bên trong một thẻ noscript.

Hầu hết người dùng WordPress thích plugin này vì nó dễ dàng thiết lập, dễ tùy chỉnh, và một mạng lưới rộng hỗ trợ cho nhúng và CDN hình ảnh.

2. a3 Lazy Load

      

Đối với các trang web có nhiều nội dung bạn có thể thử plugin  a3 Lazy Load để tối ưu hình ảnh.

Đây là một plugin mới hơn nhiều và được cập nhật thường xuyên từ các nhà phát triển. Nó được tạo ra để hỗ trợ điện thoại di động cho các trang web tải hàng trăm hoặc hàng ngàn hình ảnh trên một trang.

Nó được xây dựng dựa trên thư viện jquery Lazy Load XT  đáng tin cậy trên github.

Một điều thú vị về plugin a3 là cách bạn có thể chọn/chỉ định thành phần được sử dụng layzload có trên trang. Bạn có thể chọn giữa các hình ảnh trên bài viết, trang, và có thể áp dụng trên cả nội dung bình luận & avatar.

3. Lazy Load XT

Nếu bạn muốn nhanh như chớp hãy thử plugin miễn phí Lazy Load XT, một trong những plugin lazyload nhẹ nhất bạn có thể tìm cho WordPress.

Plugin ra phiên bản chắc chắn ít nhiều cập nhật và nó hiện đang được lưu hành ở bản v0.5 mà không cần bất kỳ bản cập nhật mới trong vòng hai năm. Vì vậy chúng ta có thể yên tâm sử dụng.

Và nó cũng được đánh giá khá tốt trên WordPress.org với 5 sao (90%) và rất nhiều ý kiến ​​tuyệt vời từ người dùng.

Nó cũng dựa trên thư viện jQuery Lazy Load XT. Tuy nhiên, nó nhẹ hơn có nghĩa đi kèm với các tính năng ít hơn, vì vậy tôi khuyên các bạn nên cài đặt plugin này nếu không muốn làm chậm website nếu bạn đang sử dụng với nhiều plugins khác.

4. WP Lazy Load

Nhà phát triển Mohammad Jangda phát hành plugin lazload như một thêm lựa chọn cho người dùng WordPress. Nó được xây dựng trên CODE phát hành từ nhóm phát triển WordPress một vài năm trở lại.

plugin đơn giản này dựa trên jQuery Sonar để phát hiện khi một thành phần có thể được xem bằng mắt trên trang. Plugin sử dụng thư viện này để chạy Ajax cho các hình ảnh để giảm kích thước và thời gian tải trang.

Một điều cộng khác là nó không có quá nhiều tùy chọn làm khó chịu người dùng.

5. Speed ​​Up – Lazy Load

Dưới đây là một ví dụ khác của plugin chỉ có kích thước vẻn vẹn 5KB . Với Speed ​​Up – Lazy load bạn sẽ có được tất cả các tính năng mặc định của lazyload ảnh và JS với tính năng phát hiện khi người dùng cuộn trang.

Plugin này cũng được cập nhật thường xuyên hơn so với plugin khác. Bản cập nhật mới nhất là khoảng 6 tháng trước khi viết bài này và nó được thử nghiệm với WordPress v4.7.6 (phiên bản hiện tại là 4.8.2).

6. Lazy Loading Images Responsive

Nếu bạn đang tìm một cái gì đó với nhiều tùy chỉnh hơn , hãy thử plugin Lazy Loading Images Responsive . Nó được phát triển để đáp ứng xử lý nội dung responsive với kịch bản script lazyload trên mọi thiết bị.

Lưu ý nó không yêu cầu JavaScript giống như các plugin khác, nhưng nó cũng sử dụng tag <noscript> như một dự phòng. Nó vẫn tải hình ảnh như bạn mong muốn và nó sử dụng responsive placeholders cho đến khi người dùng cuộn xuống phía xa hơn ở trên trang.

Và như các plugin khác, nhà phát triển sẽ cập nhật thay đổi về plugin cho bổ xung các tính mới hoặc đưa ra bản vá lỗi. Vì vậy, đây là plugin đáng tin cậy và có thể sử dụng trong nhiều năm tới.

7. JCH Optimize

JCH Optimize thực sự là một gói tính năng lớn mà giúp cải thiện thời gian tải trang của bạn. Bạn có thể cài đặt plugin này trên bất kỳ trang web WordPress và ngay lập tức nhận thấy những lợi ích mà nó mang lại.

Plugin sẽ tự động kết hợp CSS / JS để giảm tổng số các yêu cầu HTTP. Nó cũng tối ưu HTML của bạn và thậm chí tạo ra các file sprite cho hình ảnh trên nền CSS một cách Khéo léo!

Tính năng lazyload được dấu bên trong trang cài đặt và nó sẽ được kích hoạt chỉ bằng một cú nhấp chuột. Vì vậy, plugin này là một lựa chọn tuyệt vời để tăng tốc trang web của bạn.

Nhưng nó không phải là tất cả và bạn vẫn sẽ cần những thứ khác như tạo bộ đệm (cache)  bên cạnh JCH Optimize.

8. Smart4y Lazy Load

Nếu bạn cần một tính năng lazy hiện đại hãy mua plugin Smart4y Lazy Load . Với chế độ lazyload siêu nhanh, nhẹ, và hỗ trợ lazyload cho mọi phần tử HTML media.

Plugin này đã vừa phát hành một vài tháng trước khi viết bài này vì vậy nó là một trong những plugin mới nhất.

Các thành phần được áp dụng trên trang:

• Iframes hoặc nội dung nhúng
• Hình ảnh trên bài viết / trang
• Nhắm mục tiêu chỉ bài viết, chỉ các trang, hoặc cả hai
• Tạo loading của riêng bạn

9. Lazy Load for Video

Lazyload chỉ dành cho video. Nếu bạn đang vận hành một trang web video, thì đây là plugin bạn không thể bỏ qua.

Plugin này rất hữu ích trong hai trường hợp: giúp webmaster tạo lazyload cho video nhúng mà không cần dùng đến hình ảnh, hoặc sử dụng cùng với một plugin lazyload khác.

Hiểu Nguyên lý cơ bản, nó hiển thị hình ảnh placeholder cho video trước khi video được tải. Vì vậy, nó sẽ lấy thumbnail từ video để giữ tỉ lệ HTML. Thêm vào đó nó cho phép bạn tùy chỉnh nhúng trình player với các nút điều khiển hoặc chú thích nào đó.

Tải trên GitHub repo nếu bạn muốn tìm hiểu thêm về plugin này, hoặc nếu bạn muốn đóng góp cho dự án open source tuyệt vời này.

10. Zedna WP Image Lazy Load

Không phải tất cả plugin lazy loading hỗ trợ ảnh nền CSS. Đã đến lúc bạn phải để ý tới  Zedna WP Image Lazy Load .

Đương nhiên plugin này nhắm vào tất cả hình ảnh trên trang và đối tượng nhúng trong iframe. Nhưng nó cũng được khai thác tốt cho hình ảnh nền CSS nếu bạn muốn chúng được tích hợp lazyload.

Và nó hoạt động trên HTML5 video element , do đó thậm chí bạn có thể sử dụng cho cả video nhúng của riêng bạn. Thật Tuyệt!

Các tùy chọn khác cho phép bạn cấu hình chuyển động animation, ngưỡng tải nội dung, …

11. Crazy Lazy

Không nhiều người sử dụng WP biết về Crazy Lazy bởi vì nó không có mặt ở phía trên cùng của kết quả tìm kiếm cho “lazyload plugin”. Nhưng, đó lại là plugin đáng sử dụng vì kích thước nhỏ gọn và tối ưu trong plugin jQuery.

Crazy Lazy sử dụng một trong hai plugin jQuery rất phổ biến: Unveil.js với nhiều theme động hoặc Lazyload.js cho các theme nhỏ hơn.

Nó cung cấp cho bạn toàn quyền kiểm soát mã CSS trước khi hình ảnh được tải & hiển thị trên trang. Thêm vào đó bạn có thể thêm các thuộc tính  data-crazy-lazy vào mã của bạn để loại trừ các hình ảnh nhất định từ hiệu ứng lazyload.

Có lẽ đây là một sự lựa chọn thông minh với một codebase nhỏ nhưng ổn định.