Lazy load là gì

  -  

Ngày nay người ta thường quan tâm tới Lazy loading khi đăng ảnh lên. Tuy nhiên không phải ai cũng thực sự hiểu về Lazy loading cũng như bản chất và những ưu nhược điểm của nó. Chính vì vậy để giải quyết vấn đề nan giải này thì hãy cùng ceds.edu.vn xem qua bài viết sau để hiểu rõ hơn cũng như giải đáp những thắc mắc của các bạn.

Bạn đang xem: Lazy load là gì


*

Lazy Loading Images qua thuộc tính background-image

Với background-image , trình duyệt sẽ xây dựng cây DOM kèm theo CSSDOM và check xem kiểu CSS có áp dụng cho nút DOM hiện tại không.

Nếu DOM hiện tại có background-image thì trình duyệt sẽ load Image. Tương tự như src attr , trước tiên ta sẽ set cho DOM có giá trị background-image: none sau đó sẽ change giá trị khi cần thiết.


*

Ưu nhược điểm của Lazy Loading

Ưu điểm của Lazy Loading

Điểm cộng lớn của Lazy Loading là sự ảnh hưởng đến hiệu suất trang web bởi chức năng chỉ tải những dữ liệu cần thiết và trong tầm nhìn của users.Giúp hạn chế sự chậm trễ xảy ra khi tải đồng loạt dữ liệu trên trang.Lazy loading là kỹ thuật tải hiệu quả nhất được sử dụng phổ biến ngày nay. Bạn sẽ không bao giờ mất chi phí băng thông cho những gì bạn không tải xuống, không xem, không nhìn thấy. Nếu lưu lượng truy cập là mối quan tâm lớn nhất của bạn, thì lazy loading chính là một lựa chọn lí tưởng.

Nhược điểm của Lazy Loading

Cách tiếp cận này có thể dẫn đến sự nhấp nháy của phần nội dung bị thiếu.

Xem thêm: Chơi Game Plants Vs Zombies 2


Quá trình thực hiện lazy-loading đơn thuần là sự đòi hỏi nhiều Javascript hơn, phức tạp hơn, dễ xảy ra lỗi hơn. Khi các Javascript không được tải xuống do lỗi kết nối mạng hoặc các Javascript không thực hiện được, các dữ liệu được khởi lệnh lazy-loading sẽ không xuất hiện.


Một số lưu ý khi sử dụng Lazy Loading

Những cách sử dụng vừa nêu trên có những nét đặc thù riêng với từng đặc tính của các trình duyệt web hiện nay. Ví dụ đối với Internet Explorer, nếu bạn buộc phải sử dụng trình duyệt này để lazy-load các dữ liệu, bạn có thể dùng Polyfill để giả lập Intersection Observer API, sau đó sử dụng như bình thường.Khi dùng Intersection Observer API để lazy-load hình ảnh, lệnh scr sẽ trở thành data-scr và Googlebot không hiểu data-scr là gì.Nên tránh lazy-load các hình ảnh đầu trang để tránh tối thiểu layout shift. Trước khi dùng Lazy Loading, bạn nên chỉ ra chính xác kích thước bức ảnh sẽ xuất hiện để khi users lướt xuống thì bức ảnh sẽ được tải mà không xê dịch thông tin trên trang.

Sau đây là những nội dung về Lazy loading cũng như những ưu điểm và nhược điểm mà nó mang lại cho người dùng, hy vọng qua bài viết của ceds.edu.vn sẽ có ích và giúp bạn giải đáp thắc mắc cũng như những những vấn đề của bản thân đang mắc phải. Nếu có bất kì thắc mắc nào bạn có thể liên hệ với ceds.edu.vn đơn vị chuyên thiết kế website và cung cấp các giải pháp về website – hosting – VPS các giải pháp về Digital Marketing để giải đáp các thắc mắc nhé !


Trần Bình Trọng

Trần Bình Trọng, CEO tại ceds.edu.vn. Đam mê nghiên cứu Digital marketing. Với tôi, có 2 thứ không thể thiếu đối với mọi nhà tiếp thị trong kỉ nguyên số là nắm vững các nguyên lý nền tảng Marketing và am hiểu các công cụ số để tạo ra trải nghiệm tốt nhất cho khách hàng.Trong blog của mình chia sẻ các kiến thức về SEO - Inbound Marketing - Tối ưu chuyển đổi trên website, đúc kết từ nhiều năm xây dựng Agency, triển khai cho nhiều lĩnh vực - công ty từ quy mô start-up tới tập đoàn. Ngoài chia sẻ trên blog, mình cũng quay khá nhiều video hằng tuần trên youtube để chia sẻ các chủ đề tương tự. Hi vọng sẽ giúp ích cho bạn đọc.

Xem thêm: Plants Vs Zombies 2 For Android Free, Tải Game Plants‌ ‌Vs‌ ‌Zombies ‌2‌ ‌


Trả lời Hủy

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Bình luận *

Tên *

Email *

Trang web

Lưu tên của tôi, email, và trang web trong trình duyệt này cho lần bình luận kế tiếp của tôi.

Check Spam *

*
×=
*


ceds.edu.vn là đơn vị Digital Marketing Agency Giá rẻ Uy tín cung cấp dịch vụ thiết kế website, dịch vụ SEO, Đào tạo Seo, Google Ads, Facebook Ads