टच और व्हील इवेंट लिसनर, उपयोगकर्ता के इंटरैक्शन को ट्रैक करने और कस्टम स्क्रोलिंग अनुभव बनाने के लिए काम के होते हैं. हालांकि, इनकी वजह से पेज स्क्रोल होने में देरी हो सकती है. फ़िलहाल, ब्राउज़र यह नहीं जान सकते कि कोई इवेंट लिसनर, स्क्रॉल करने से रोकेगा या नहीं. इसलिए, वे पेज को स्क्रॉल करने से पहले, लिसनर के पूरा होने का इंतज़ार करते हैं. पैसिव इवेंट लिसनर इस समस्या को हल करते हैं. इनकी मदद से, यह बताया जा सकता है कि कोई इवेंट लिसनर कभी भी स्क्रोल करने से नहीं रोकेगा.
ब्राउज़र के साथ काम करना
ज़्यादातर ब्राउज़र, पैसिव इवेंट लिसनर के साथ काम करते हैं. अलग-अलग ब्राउज़र पर साइट की जांच करना देखें
लाइटहाउस के पैसिव इवेंट लिस्नर ऑडिट के काम न करने की वजह
Lighthouse, उन इवेंट लिसनर की शिकायत करता है जिनकी वजह से पेज को स्क्रोल करने में देरी हो सकती है:
Lighthouse, इवेंट लिसनर की पहचान करने के लिए इस प्रोसेस का इस्तेमाल करता है, जिससे स्क्रोल की परफ़ॉर्मेंस पर असर पड़ सकता है:
- पेज पर मौजूद सभी इवेंट लिसनर इकट्ठा करें.
- बिना टच और बिना व्हील वाले दर्शकों को फ़िल्टर करें.
preventDefault()को कॉल करने वाले दर्शकों को फ़िल्टर करें.- उन दर्शकों को फ़िल्टर करें जो पेज के होस्ट से अलग होस्ट से जुड़े हैं.
Lighthouse, अलग-अलग होस्ट से सुनने वालों को फ़िल्टर कर देता है, क्योंकि हो सकता है कि आपके पास इन स्क्रिप्ट को कंट्रोल करने का विकल्प न हो. ऐसा हो सकता है कि तीसरे पक्ष की कुछ स्क्रिप्ट आपके पेज की स्क्रोलिंग परफ़ॉर्मेंस पर असर डाल रही हों, लेकिन ये Lighthouse रिपोर्ट में शामिल न हों.
स्क्रोल परफ़ॉर्मेंस को बेहतर बनाने के लिए, इवेंट लिसनर को पैसिव बनाने का तरीका
Lighthouse की पहचान किए गए हर इवेंट लिसनर में passive फ़्लैग जोड़ें.
अगर आपको सिर्फ़ उन ब्राउज़र के साथ काम करना है जिनमें पैसिव इवेंट लिसनर की सुविधा काम करती है, तो सिर्फ़ फ़्लैग जोड़ें. उदाहरण के लिए:
document.addEventListener('touchstart', onTouchStart, {passive: true});
अगर आपको ऐसे पुराने ब्राउज़र के लिए काम करना है जिनमें पैसिव इवेंट लिसनर की सुविधा काम नहीं करती, तो आपको सुविधा का पता लगाने या पॉलीफ़िल का इस्तेमाल करना होगा. ज़्यादा जानकारी के लिए, WICG के पैसिव इवेंट लिसनर के बारे में बताने वाले दस्तावेज़ में, सुविधा का पता लगाना सेक्शन देखें.