फ्रंट-एंड ऑप्टिमाइज़ेशन के लिए क्रोम एक्सटेंशन

फ्रंट-एंड ऑप्टिमाइज़ेशन के लिए इंस्टॉल करने योग्य और मानक Google Chrome एक्सटेंशन।

जेएस स्विच

यहां स्थापित करें - chrome.google.com/webstore/detail/quick-javascript-switcher/geddoclleiomckbhadiaipdggiiccfje
इसके साथ, वास्तव में, सब कुछ सरल है - जब हम बिना js के कुछ देखना चाहते हैं - दाहिने कोने में बटन पर क्लिक करें और वोइला।
अगला लॉट कुकीज़ होगा

chrome । आप देख सकते हैं, यदि आवश्यक हो तो आप इसे ठीक कर सकते हैं
और अगर पिछले 2 एक्सटेंशन और भी कम आम हैं, तो निम्नलिखित कुछ कारणों से भुला दिए जाते हैं:

PageSpeed

आपको फ्रंट-एंड साइड पर अपने एप्लिकेशन के प्रदर्शन में सुधार करने की अनुमति देता है।
Developers.google.com/speed/docs/insights/using_chrome - यहां आप इस अद्भुत प्लगइन को पढ़ और स्थापित कर सकते हैं।
संक्षेप में - Ctrl + Shift + J दबाएँ - आपका कंसोल खुलता है। स्थापना के बाद, एक अतिरिक्त पेजपीड आइकन दिखाई देगा। हम इच्छित पृष्ठ पर जाते हैं, और Pagespeed मेनू में विश्लेषण बटन पर क्लिक करते हैं। हम आपके पृष्ठ की प्रतीक्षा कर रहे हैं कि कैसे अनुकूलन के लिए युक्तियाँ पुनः लोड करें और पढ़ें। छवियों के आकार को कम करने के लिए भी महान सुझाव हैं, और पहले से ही संसाधित विकल्पों को कंसोल से सीधे, अद्वितीय लिंक के माध्यम से उठाया जा सकता है।


गति अनुचर

सीधे Google ओवन से, अभी भी गर्म- chrome.google.com/webstore/detail/speed-tracer-by-google/ognampngfcbddbfemdapefohjiobgbdl
इसे स्थापित करें - और ऊपरी दाहिने कोने में हरे रंग का टाइमर आइकन देखें। यह थोड़ा भ्रामक है, लेकिन यह पता लगाने के लिए बहुत सरल है। इच्छित पृष्ठ पर आइकन पर क्लिक करें। एक विंडो खुलती है जहां रिकॉर्डिंग शुरू हो चुकी है। फिर हम पुरानी विंडो पर लौटते हैं और वहां पृष्ठ पुनः लोड करते हैं। हम ट्रैकर के साथ खिड़की पर लौटते हैं और रिकॉर्डिंग को रोकते हुए लाल सर्कल को दबाते हैं। मेनू में आगे 3 आवर्धक ग्लास आइकन हैं। +, -, <>। हम अंतिम विकल्प पर क्लिक करते हैं - हमारे पास सभी गतिविधि बढ़ गई हैं। वोइला, आप अपने पृष्ठ के लोडिंग शेड्यूल का आनंद ले सकते हैं - जैसे कि कौन लोड कर रहा था (डोम, जेएस, एक लेआउट ड्राइंग और इसी तरह)। शीर्ष दाईं ओर एक आरेख के साथ एक आइकन भी है - सब कुछ पाई चार्ट पर दिखाया जाएगा।

बाएं से दाएं, संबंधित एक्सटेंशन के आइकन। पहचानने योग्य होना।
ये सभी इंस्टॉल करने योग्य और गैर-मानक प्लगइन्स थे - और हमारे पास बॉक्स में क्या है?
कंसोल खोलें और टैब देखें
नेटवर्क

एक अद्भुत टैब जो आपको एक मिलीसेकंड में बताएगा कि पृष्ठ का कौन सा तत्व आपको लोड करने में कितना समय लगा। हम इस पर जाते हैं और पृष्ठ को ताज़ा करते हैं। उदाहरण के लिए, आप स्पष्ट रूप से देख सकते हैं कि HTML कैसे लोड होने की प्रतीक्षा कर रहा है यदि इसे एसिंक्रोनस रूप से नहीं जोड़ा गया है, साथ ही यह ट्रैक करने के लिए कि कौन कमजोर लिंक है, कौन सी तस्वीर या स्क्रिप्ट दूसरों की तुलना में लंबे समय तक लोड की गई है, और इसी तरह।
और अंत में एक और मानक मॉड्यूल:
प्रोफाइल।

नेटवर्क टैब के बगल में, Google Chrome कंसोल में। यह मॉड्यूल js और css पर आँकड़े एकत्र कर सकता है - और css या js के प्रत्येक लोड किए गए भाग के प्रतिशत या ms (कॉलम में किसी भी मान पर 2 बार क्लिक करें) में मान दिखा सकता है।


Source: https://habr.com/ru/post/In161831/


All Articles