डिबगबियर उपयोग शुरू करने में बस कुछ ही सेकंड लगते हैं। आप इसे सचमुच उस यूआरएल पर इंगित करें जिसे आप देखना चाहते हैं, और यह इसे देखना शुरू कर देगा। आप कुछ भी इंस्टॉल नहीं करें.
यह परीक्षण चलाना शुरू कर देगा, और आपको तुरंत प्रदर्शन चार्ट मिल जाएंगे जिन्हें आप देखना शुरू कर सकते हैं जिन्हें समय के साथ ट्रैक किया जाता है, केवल एकबारगी नहीं।
मुझे वहां पूरी लाइटहाउस रिपोर्ट मिल गई है, जिसमें मुझे वह चीजें दिखाई गई हैं जिन पर मुझे वास्तव में काम करने की जरूरत है।
क्योंकि इन सभी परिवर्तनों को समय के साथ ट्रैक किया जाता है, आप देख सकते हैं कि वास्तव में क्या और कब बदलाव हुआ। वह काफ़ी बड़ा है. क्या आपके जावास्क्रिप्ट बंडल का आकार बढ़ गया? कब? क्यों? क्या आपके SEO स्कोर में गिरावट आई? कब? क्यों?
एक और बढ़िया बात: जब आपके पास प्रतिगमन होगा तो डीबगबियर आपको ईमेल करेगा (या एक स्लैक संदेश भेजेगा)। इसलिए, भले ही चार्ट अद्भुत हैं, ऐसा नहीं है कि क्या हो रहा है यह देखने के लिए आपको हर बार लॉग इन करना होगा। आप इनके परीक्षण के लिए बहुत स्पष्ट प्रदर्शन बजट भी निर्धारित कर सकते हैं:
प्रदर्शन बजट तोड़ें? आपको सूचित किया जाएगा:
क्या आप अपनी साइट के विभिन्न क्षेत्रों/पृष्ठों की तुलना करना चाहते हैं? (वैसे, आप उनका परीक्षण करने से पहले उनमें लॉग इन कर सकते हैं।) या यह सुनिश्चित करने के लिए कि आप पीछे नहीं रह रहे हैं, अपने प्रतिस्पर्धियों से अपनी तुलना करें? कोई बात नहीं, उन पर भी नजर रखें:
उत्पादन का परीक्षण करना बहुत अच्छी बात है. यह वास्तविकता को माप रहा है और आप जल्दी से शुरुआत कर सकते हैं। लेकिन चीजों को मापना भी बहुत अच्छी बात हो सकती है से पहले वे एक समस्या बन जाते हैं. क्या आप जानते हैं कि आपको Netlify और Vercel जैसी सेवाओं पर परिनियोजन पूर्वावलोकन कैसे मिलते हैं? खैर, DebugBear में केवल जैसी सेवाओं के लिए एकीकरण बनाया गया है शुद्ध करना और वर्सेल.
अब, जब आपके पास परिनियोजन पूर्वावलोकन के साथ एक पुल अनुरोध है, तो आप देख सकते हैं ठीक GitHub पर यदि मेट्रिक्स इन-लाइन हैं।
यह बहुत कम काम के लिए बहुत अधिक मूल्य है। लेकिन सरलता से मूर्ख मत बनो - आप सभी प्रकार की उन्नत चीजें कर सकते हैं। आप कैश को गर्म कर सकते हैं. आप विभिन्न भौगोलिक स्थानों से परीक्षण कर सकते हैं. आप लॉगिन के लिए एक स्क्रिप्ट लिख सकते हैं जो इनपुट के लिए सीएसएस चयनकर्ताओं और उनमें डाले जाने वाले मूल्यों को लेती है। आप इसे परीक्षण के लिए तैयार करने के लिए विशेष कार्य करने के लिए अपनी स्वयं की जावास्क्रिप्ट निष्पादित भी करवा सकते हैं, जैसे ओपन मोडल्स, इंजेक्ट peformance.mark
मेट्रिक्स, या अन्य नेविगेशन करें। 🎉
स्रोत: https://css-tricks.com/monitoring-lighthouse-scores-and-core-web-vitals-with-debugbear/