لتحسين أداء التمرير/التكبير أو التصغير في wheel، ننصح المطوِّرين
بتسجيل أدوات معالجة أحداث wheel وmousewheel كأداة سلبية
من خلال ضبط الخيار {passive: true} على addEventListener(). إنّ تسجيل
أدوات معالجة الأحداث باعتبارها سلبية يخبر المتصفّح بأنّ مستمعي العجلة
لن تستدعي preventDefault() وأنّ المتصفّح يمكنه إجراء التمرير والتكبير/التصغير بأمان بدون حظر المستمعين.
تكمن المشكلة في أنّ أدوات معالجة أحداث العجلة غالبًا ما تكون سلبية من الناحية النظرية (لا تستدعي preventDefault()) ولكن لا يتم تحديدها صراحةً على هذا النحو،
ما يتطلّب من المتصفّح انتظار انتهاء معالجة حدث JavaScript قبل بدء التمرير/التكبير/التصغير على الرغم من أنّ الانتظار ليس ضروريًا. في الإصدار 56 من Chrome،
أصلحنا هذه المشكلة في touchstart وtouchmove،
وتم اعتماد هذا التغيير لاحقًا في كلٍّ من Safari وFirefox. يتّضح من الفيديو التوضيحي الذي أنشأناه في ذلك الوقت أنّ السلوك يؤدي إلى تأخير ملحوظ في استجابة التمرير. والآن في الإصدار 73 من Chrome، طبّقنا
التدخل نفسه على حدثَي wheel وmousewheel.
التدخل
هدفنا من هذا التغيير هو تقليل الوقت الذي يستغرقه تحديث الشاشة
بعد أن يبدأ المستخدم في التمرير بواسطة العجلة أو لوحة اللمس بدون حاجة المطورين
إلى تغيير الرمز. تُظهر مقاييسنا أنّ% 75 من المستمعين إلى الحدثَين wheel وmousewheel
المسجّلين في الأهداف الجذر (نافذة أو مستند أو نص)
لا يحدّدون أي قيم للخيار السلبي في حين أنّ أكثر من% 98 من هؤلاء
المستمعين لا يطلقون على الأسماء preventDefault(). في الإصدار 73 من Chrome، سنغيّر
أدوات معالجة البيانات wheel وmousewheel المسجّلة في الأهداف الجذر (نافذة أو
مستند أو نص) لتصبح سلبية تلقائيًا. هذا يعني أن المستمع
للحدث مثل:
window.addEventListener("wheel", func);
يصبح معادلاً لـ:
window.addEventListener("wheel", func, {passive: true});
وسيتم تجاهل طلب preventDefault() داخل المستمع مع التحذير التالي في "أدوات مطوري البرامج":
[Intervention] Unable to preventDefault inside passive event listener due
to target being treated as passive. See https://www.chromestatus.com/features/6662647093133312
الأعطال والإرشادات
في الغالبية العظمى من الحالات، لن يتم ملاحظة أي عطل. في حالات نادرة فقط (أقل من 0.3% من الصفحات وفقًا لمقاييسنا)، قد يحدث التمرير/التكبير/التصغير غير المقصود بسبب تجاهل طلب preventDefault() داخل المستمعين
التي يتم التعامل معها على أنها سلبية تلقائيًا. يمكن للتطبيق أن
يحدّد ما إذا كان يمكن أن ينفّذ هذه العملية بشكل تلقائي من خلال التحقّق مما إذا كان لاستدعاء
preventDefault() أي تأثير من خلال السمة defaultPrevented. يمكن إصلاح
الحالات المتأثرة بسهولة نسبيًا من خلال ضبط السمة {passive: false} إلى
addEventListener() لإلغاء السلوك التلقائي والحفاظ على حالة المستمع
للفعالية باعتباره محظورًا.