Dần dần cho phép bạn tải hình ảnh lười biếng với Vanilla JS

Mỗi trang web hiện đại cần phải nhanh chóng. Mặc dù có nhiều kỹ thuật và plugin để tăng tốc độ trang, tuy nhiên, bạn có thể không biết bắt đầu từ đâu.

Kịch bản lũy tiến là một tài nguyên tuyệt vời để tăng tốc độ trang. Nó hoạt động như một tập lệnh tải hình ảnh lười biếng tải hình ảnh liên tục khi người dùng cuộn xuống trang.

Đây là một dự án nguồn mở miễn phí để bạn có thể tải xuống và chạy nó trên bất kỳ trang web nào. Thêm vào đó chạy trên 100% vanilla JS vì vậy nó không phụ thuộc có thể làm bạn nặng nề.

Bạn có thể xem bản demo trực tiếp trên trang chủ lũy tiến.

Nó khác một chút so với các tập lệnh tải lười biếng khác vì nó giữ kích thước hình ảnh cố định cho toàn bộ trang. Điều này ngăn chặn việc nhảy trang gây phiền nhiễu mà bạn thấy bất cứ khi nào hình ảnh tải nhanh vào xem và tăng chiều cao nội dung.

Và trình giữ chỗ hình ảnh thực sự trông giống như hình ảnh bạn đang tải. Tuyệt vời!

Kỹ thuật gọn gàng này mang đến cho du khách cơ hội xem trước hình ảnh trông như thế nào trước khi chúng tải. Tất cả đều được xử lý thông qua JavaScript để kiểm tra vị trí của người dùng trên trang và tải trước hình ảnh khi chúng xuất hiện.

Dần dần có một API khá rộng rãi vì vậy nó là một lựa chọn tuyệt vời cho các nhà phát triển web. Việc thiết lập có thể có được kỹ thuật để nó hữu ích nếu bạn biết cách của mình xung quanh mã hóa lối vào cơ bản.

Nhưng bạn có thể tìm hiểu thêm trên trang GitHub chính bao gồm tài liệu API đầy đủ, hướng dẫn thiết lập và đoạn mã mẫu mà bạn có thể sao chép / dán cho các dự án của mình.

Nếu bạn cần một kịch bản hình ảnh tải lười biếng đáng tin cậy mà không có sự phụ thuộc khó chịu thì hãy tiến bộ. Nó hoàn toàn miễn phí và cung cấp nhiều tùy chỉnh cho các nhà phát triển.

Ngoài ra, hãy xem qua GitHub lũy tiến để tìm hiểu thêm và lấy mã nguồn có thể tải xuống.