DevTools
Chrome DevTools, वेब डेवलपर टूल का एक सेट है. यह सीधे Google Chrome ब्राउज़र में पहले से मौजूद होता है. DevTools की मदद से, पेजों में तुरंत बदलाव किए जा सकते हैं और समस्याओं का तुरंत विश्लेषण किया जा सकता है. इससे, तेज़ी से और बेहतर वेबसाइटें बनाने में आपको मदद मिलती है.
DevTools, वेब डेवलपमेंट से जुड़े कई सामान्य टास्क के साथ काम करता है. इस पेज पर आगे बढ़ें और DevTools की कुछ मुख्य सुविधाओं के बारे में जानें. क्या आपको नहीं पता कि कहां से शुरू करना है या DevTools का इस्तेमाल पहली बार किया जा रहा है? DevTools के बारे में जानकारी देने वाला वीडियो देखें.
एआई से मदद पाना
कंसोल की अहम जानकारी और एआई की मदद से, JavaScript की गड़बड़ियों, परफ़ॉर्मेंस, और स्टाइल को बेहतर तरीके से डीबग और ठीक किया जा सकता है.
परफ़ॉर्मेंस के बारे में जानकारी
अपने पेज की परफ़ॉर्मेंस के बारे में पूरी जानकारी पाएं और उस पर कार्रवाई करें.
संसाधनों की जांच करना
अपने पेज पर लोड किए गए संसाधनों की जांच करने और अपने ब्राउज़र से उनमें बदलाव करने का तरीका जानें.
नेटवर्क का विश्लेषण करना
नेटवर्क अनुरोधों और जवाबों का तुरंत विश्लेषण करें और उन्हें बदलें.
एआई की मदद और कंसोल की अहम जानकारी
जानें कि DevTools में एआई के इनोवेशन की मदद से, ज़्यादा और तेज़ी से काम कैसे किया जा सकता है.
शुरू करना
Gemini की मदद से, अपनी वेबसाइट की स्टाइल, नेटवर्क, सोर्स, और परफ़ॉर्मेंस का विश्लेषण करें और उन्हें बेहतर बनाएं.
प्रेरणा लें
Chrome DevTools में एआई असिस्टेंस के इस्तेमाल के उदाहरण देखें. साथ ही, जानें कि यह स्टाइल, परफ़ॉर्मेंस वगैरह के लिए, डीबग करने के वर्कफ़्लो में कैसे मदद कर सकता है.
कंसोल मैसेज को समझना
DevTools में कंसोल मैसेज और गड़बड़ियों को समझें. साथ ही, उन्हें कॉपी-पेस्ट किए बिना ठीक करने का तरीका जानें.
DevTools से जुड़ी सलाह
वेब डेवलपमेंट से जुड़ी सामान्य समस्याओं को हल करने के लिए, DevTools का इस्तेमाल करने का तरीका बताने वाली हमारी हर महीने की वीडियो सीरीज़ देखें.
परफ़ॉर्मेंस ट्रेस रिकॉर्ड करना और उसका विश्लेषण करना
DevTools में परफ़ॉर्मेंस ट्रेस रिकॉर्ड करने और परफ़ॉर्मेंस से जुड़ी समस्याओं की पहचान करने और उन्हें ठीक करने के लिए, उनका विश्लेषण करने का तरीका जानें.
वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी को लाइव मॉनिटर करना
LCP से जुड़ी समस्याओं को डीबग करें और CrUX डेटा का इस्तेमाल करके देखें कि क्या आपने उपयोगकर्ताओं के अनुभव से जुड़ी समस्या को डीबग किया है
कैश मेमोरी में सेव करने की सुविधा के बारे में जानकारी
ब्राउज़र कैश के अलग-अलग टाइप के बारे में जानें. साथ ही, Chrome DevTools में उनकी जांच करने और उन्हें मैनेज करने का तरीका जानें!
स्क्रीन को फ़्रीज़ करना और गायब होने वाले एलिमेंट की जांच करना
क्या किसी एलिमेंट की जांच करते समय, वह अचानक से गायब हो गया? ऐसा लगता है कि आपका कोड आपसे छिप-छिपाकर खेल रहा है!
परफ़ॉर्मेंस के बारे में अहम जानकारी पाना
रनटाइम की परफ़ॉर्मेंस के अलग-अलग पहलुओं को मेज़र और ऑप्टिमाइज़ करने में मदद करने के लिए, कई तरह के टूल: परफ़ॉर्मेंस पैनल, Lighthouse वगैरह.
परफ़ॉर्मेंस टूल के बारे में खास जानकारी
परफ़ॉर्मेंस पैनल की सभी सुविधाओं के बारे में जानें: परफ़ॉर्मेंस ट्रेस को रिकॉर्ड करने, ट्रेस को देखने और उसका विश्लेषण करने का तरीका वगैरह.
परफ़ॉर्मेंस टूल का भविष्य
परफ़ॉर्मेंस पैनल, डेवलपर को 15 साल से ज़्यादा समय से, अपने ऐप्लिकेशन के रनटाइम की परफ़ॉर्मेंस को मेज़र करने और उसे ऑप्टिमाइज़ करने में मदद कर रहा है. जानें कि आने वाले समय में इसमें क्या बदलाव होंगे.
परफ़ॉर्मेंस ट्रेस में एनोटेट करना
ट्रेस में एनोटेट करें और उन्हें सीधे ट्रेस फ़ाइल में सेव करें, ताकि उन्हें आसानी से शेयर किया जा सके.
खबरें और अपडेट
संसाधनों की जांच करना और उनमें बदलाव करना
सुविधा के बारे में जानकारी
सोर्स पैनल की सभी सुविधाओं के बारे में जानें: फ़ाइलों को देखने और उनमें बदलाव करने, JavaScript को डीबग करने, और वर्कस्पेस सेट अप करने का तरीका.
फ़ाइल फ़ोल्डर सेट अप करना
Workspace की मदद से, DevTools में किए गए बदलावों को कंप्यूटर पर सेव किए गए सोर्स कोड में सेव किया जा सकता है. अपने प्रोजेक्ट में वर्कस्पेस सेट अप करने का तरीका जानें.
नेटवर्क पर की गई गतिविधि का विश्लेषण करना
नेटवर्क पैनल
नेटवर्क पैनल में मौजूद सभी सुविधाओं के बारे में जानें: रिस्पॉन्स और अनुरोध के मुख्य हिस्सों की जांच करना, हेडर को बदलना वगैरह.
नेटवर्क पर की गई गतिविधि की जांच करें
नेटवर्क पैनल में सामान्य टास्क करने के बारे में बताने वाला ट्यूटोरियल.
और टूल
DevTools में अन्य सभी सुविधाओं और क्षमताओं के बारे में जानें.
एलिमेंट
पेज के DOM को देखने और उसमें बदलाव करने का तरीका जानें.
शैलियां
किसी पेज की सीएसएस को देखने और बदलने का तरीका जानें.
बदलाव
एचटीएमएल, सीएसएस, और JavaScript में किए गए बदलावों को ट्रैक करें.
कंसोल
मैसेज लॉग करें और JavaScript चलाएं.
परफ़ॉर्मेंस मोड
वेबसाइट की परफ़ॉर्मेंस का आकलन करें.
डिवाइस की मेमोरी
मेमोरी से जुड़ी उन समस्याओं का पता लगाएं जिनका असर पेज की परफ़ॉर्मेंस पर पड़ता है. इनमें मेमोरी लीक वगैरह शामिल हैं.
ऐप्स
वेब ऐप्लिकेशन की जांच करें, उनमें बदलाव करें, और उन्हें डीबग करें, कैश मेमोरी की जांच करें, स्टोरेज देखें वगैरह.
ऐनिमेशन
ऐनिमेशन की जांच करें और उनमें बदलाव करें.
Recorder
यूज़र फ़्लो को रिकॉर्ड करना, उसे फिर से चलाना, मेज़र करना, और उसके कदमों में बदलाव करना.
रेंडर हो रहा है
ऐसे विकल्पों के कलेक्शन के बारे में जानें जो वेब कॉन्टेंट रेंडरिंग पर असर डालते हैं.
ऑटोमैटिक भरना
सेव किए गए पतों की जांच करें और उन्हें डीबग करें.
समस्याएं
अपनी वेबसाइट की समस्याएं ढूंढें और उन्हें ठीक करें.
गोपनीयता और सुरक्षा
पक्का करें कि पेज को एचटीटीपीएस से पूरी तरह सुरक्षित किया गया हो.
मीडिया
हर ब्राउज़र टैब के हिसाब से जानकारी देखें और मीडिया प्लेयर को डीबग करें.
सेंसर
डिवाइस के सेंसर को एम्युलेट करें.
WebAuthn
पुष्टि करने वालों को एम्युलेट करें.