Cải thiện hiệu suất cuộn bằng trình nghe sự kiện thụ động
Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Mới đối với Chrome 51, trình nghe sự kiện thụ động là một tiêu chuẩn web mới xuất hiện, giúp tăng đáng kể hiệu suất cuộn, đặc biệt là trên thiết bị di động. Hãy xem video bên dưới để xem bản minh hoạ song song về những điểm cải tiến trong thực tế:
Cách hoạt động
Khi bạn cuộn một trang và có độ trễ đến mức trang đó không cảm thấy được gắn vào ngón tay bạn, thì hiện tượng này được gọi là hiện tượng giật khi cuộn. Nhiều khi bạn gặp hiện tượng giật khi cuộn, thủ phạm chính là trình nghe sự kiện chạm. Trình nghe sự kiện chạm thường hữu ích để theo dõi hoạt động tương tác của người dùng và tạo trải nghiệm cuộn tuỳ chỉnh, chẳng hạn như huỷ hoàn toàn thao tác cuộn khi tương tác với Google Maps được nhúng.
Hiện tại, các trình duyệt không thể biết liệu trình nghe sự kiện chạm có huỷ thao tác cuộn hay không. Vì vậy, các trình duyệt luôn đợi trình nghe hoàn tất trước khi cuộn trang.
Trình nghe sự kiện thụ động giải quyết vấn đề này bằng cách cho phép bạn đặt cờ trong tham số options
của addEventListener
để cho biết trình nghe sẽ không bao giờ huỷ thao tác cuộn. Thông tin đó cho phép trình duyệt cuộn trang ngay lập tức, thay vì sau khi trình nghe hoàn tất.
Tìm hiểu thêm
Xem blog Chromium để biết thông tin tổng quan ở cấp cao về cách hoạt động của trình nghe sự kiện thụ động:
Các API mới giúp nhà phát triển cải thiện hiệu suất cuộn
Và kho lưu trữ của quy cách để tìm hiểu cách triển khai trình nghe sự kiện thụ động:
Thông tin giải thích về trình nghe sự kiện thụ động
Trừ phi có lưu ý khác, nội dung của trang này được cấp phép theo Giấy phép ghi nhận tác giả 4.0 của Creative Commons và các mẫu mã lập trình được cấp phép theo Giấy phép Apache 2.0. Để biết thông tin chi tiết, vui lòng tham khảo Chính sách trang web của Google Developers. Java là nhãn hiệu đã đăng ký của Oracle và/hoặc các đơn vị liên kết với Oracle.
Cập nhật lần gần đây nhất: 2016-06-05 UTC.
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"Thiếu thông tin tôi cần"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"Quá phức tạp/quá nhiều bước"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"Đã lỗi thời"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"Vấn đề về bản dịch"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"Vấn đề về mẫu/mã"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"Khác"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"Dễ hiểu"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"Giúp tôi giải quyết được vấn đề"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"Khác"
}]
{"lastModified": "C\u1eadp nh\u1eadt l\u1ea7n g\u1ea7n \u0111\u00e2y nh\u1ea5t: 2016-06-05 UTC."}
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2016-06-05 UTC."],[],[]]