Chrome DevTools, वेब डेवलपर टूल का एक सेट है. यह सीधे Google Chrome ब्राउज़र में पहले से मौजूद होता है. DevTools की मदद से, पेजों में तुरंत बदलाव किए जा सकते हैं और समस्याओं का तुरंत विश्लेषण किया जा सकता है. इससे, तेज़ी से और बेहतर वेबसाइटें बनाने में आपको मदद मिलती है.
शुरू करना जानें कि नया क्या है
DevTools, वेब डेवलपमेंट से जुड़े कई सामान्य टास्क के साथ काम करता है. इस पेज पर आगे बढ़ें और DevTools की कुछ ������्�� ������ि��ाओं के बारे में जानें. क्या आपको नहीं पता कि कहां से शुरू करना है या DevTools का इस्तेमाल पहली बार किया जा रहा है? DevTools के बारे में जानकारी देने वाला वीडियो देखें.
कंसोल की अहम जानकारी और एआई की मदद से, JavaScript की गड़बड़ियों, परफ़ॉर्मेंस, और स्टाइल को बेहतर तरीके से डीबग और ठीक किया जा सकता है.
अपने पेज की परफ़ॉर्मेंस के बारे में पूरी जानकारी पाएं और उस पर कार्रवाई करें.
अपने पेज पर लोड किए गए संसाधनों की जांच करने और अपने ब्राउज़र से उनमें बदलाव करने का तरीका जानें.
नेटवर्क अनुरोधों और जवाबों का तुरंत विश्लेषण करें और उन्हें बदलें.

एआई की मदद और कंसोल की अहम जानकारी

Image for: एआई की मदद और कंसोल की अहम जानकारी
जानें कि DevTools में एआई के इनोवेशन की मदद से, ज़्यादा और तेज़ी से काम कैसे किया जा सकता है.
Gemini की मदद से, अपनी वेबसाइट की स्टाइल, नेटवर्क, सोर्स, और परफ़ॉर्मेंस का विश्लेषण करें और उन्हें बेहतर बनाएं.
Chrome DevTools में एआई असिस्टेंस के इस्तेमाल के उदाहरण देखें. साथ ही, जानें कि यह स्टाइल, परफ़ॉर्मेंस वगैरह के लिए, डीबग करने के वर्कफ़्लो में कैसे मदद कर सकता है.

कंसोल मैसेज को समझना

DevTools में कंसोल मैसेज ��र गड़बड़ियों को समझें. साथ ही, ��न्हें ��������-पे��्ट किए बिना ठीक करने का तरीका जानें.

DevTools से जुड़ी सलाह

Image for: DevTools से जुड़ी सलाह
वेब डेवलपमेंट से जुड़ी सामान्य समस्याओं को हल करने के लिए, DevTools का इस्तेमाल करने का तरीका बताने वाली हमारी हर महीने की वीडियो सीरीज़ देखें.
DevTools में परफ़ॉर्मेंस ट्रेस रिकॉर्ड करने और परफ़ॉर्मेंस से जुड़ी समस्याओं की पहचान करने और उन्हें ठीक करने के लिए, उनका विश्लेषण करने का तरीका जानें.

वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी को लाइव मॉनिटर करना

LCP से जुड़ी समस्याओं को डीबग करें और CrUX डेटा का इस्तेमाल करके देखें कि क्या आपने उपयोगकर्ताओं के अनुभव से जुड़ी समस्या को डीबग किया है
ब्राउज़र कैश के अलग-अलग टाइप के बारे में जानें. साथ ही, Chrome DevTools में उनकी जांच करने और उन्हें मैनेज करने का तरीका जानें!
क्या किसी एलिमेंट की जांच करते समय, वह अचानक से गायब हो गया? ऐसा लगता है कि आपका कोड आपसे छिप-छिपाकर खेल रहा है!

परफ़ॉर्मेंस की अहम जानकारी पाना

Image for: परफ़ॉर्मेंस की अहम जानकारी पाना
रनटाइम की परफ़ॉर्मेंस के अलग-अलग पहलुओं को मेज़र और ऑप्टिमाइज़ करने में मदद करने के लिए, कई तरह के टूल: परफ़ॉर्मेंस पैनल, Lighthouse वगैरह.
परफ़ॉर्मेंस पैनल की सभी सुविधाओं के बारे में जानें: परफ़ॉर्मेंस ट्रेस को रिकॉर्ड करने, ट्रेस को देखने और उसका विश्लेषण करने का तरीका वगैरह.
सीपीयू थ्रॉटलिंग कैलिब्रेशन जैसी DevTools की नई सुविधाओं के बारे में जानें. इससे, आपको असल डेटा के आधार पर परफ़ॉर्मेंस डीबग करने के फ़ैसले लेने में मदद मिलेगी
DevTools के परफ़ॉर्मेंस पैनल में, परफ़ॉर्मेंस की नई अहम जानकारी और लाइ��हाउस की सुविधाओं के बारे में जानें.

खबरें और अपडेट

Image for: खबरें और अपडेट

रिसॉर्स की जांच करना और उनमें बदलाव करना

Image for: रिसॉर्स की जांच करना और उनमें बदलाव करना
सोर्स पैनल की सभी सुविधाओं के बारे में जानें: फ़ाइलों को देखने और उनमें बदलाव करने, JavaScript को डीबग करने, और वर्कस्पेस सेट अप करने का तरीका.
शुरू करना
Workspace की मदद से, DevTools में किए गए बदलावों को कंप्यूटर पर सेव किए गए सोर्स कोड में सेव किया जा सकता है. अपने प्रोजेक्ट में वर्कस्पेस सेट अप करने का तरीका जानें.
ट्यूटोरियल पढ़ें

नेटवर्क गतिविधि का विश्लेषण करना

Image for: नेटवर्क गतिविधि का विश्लेषण करना
नेटवर्क पैनल में मौजूद सभी सुविधाओं के बारे में जानें: रिस्पॉन्स ��र अ������ो�� के मुख्य हिस्सों की जांच करना, हेडर को बदलना वगैरह.
शुरू करना
नेटवर्क पैनल में सामान्य टास्क करने के बारे में बताने वाला ट्यूटोरियल.
ट्यूटोरियल पढ़ें

और टूल

Image for: और टूल
DevTools में अन्य सभी सुविधाओं और क्षमताओं के बारे में जानें.
पेज के DOM को देखने और उसमें बदलाव करने का तरीका जानें.
किसी पेज की सीएसएस को देखने और बदलने का तरीका जानें.
एचटीएमएल, सीएसएस, और JavaScript में किए गए बदलावों को ट्रैक करें.
मैसेज लॉग करें और JavaScript चलाएं.
वेबसाइट की परफ़ॉर्मेंस का आकलन करें.
मेमोरी से जुड़ी उन समस्याओं का पता लगाएं जिनका असर पेज की परफ़ॉर्मेंस पर पड़ता है. इनमें मेमोरी लीक वगैरह शामिल हैं.
वेब ऐप्लिकेशन की जांच करें, उनमें बदलाव करें, और उन्हें डीबग करें, कैश मेमोरी की जांच करें, स्टोरेज देखें वगैरह.
ऐनिमेशन की जांच करें और उनमें बदलाव करें.
यूज़र फ़्लो को रिकॉर्ड करना, उसे फिर से चलाना, मेज़र करना, और उसके कदमों में बदलाव करना.
ऐसे विकल्पों के कलेक्शन के बारे में जानें जो वेब कॉन्टेंट रेंडरिंग पर असर डालते हैं.
सेव किए गए पतों की जांच करें और उन्हें डीबग करें.
अपनी वेबसाइट की समस्याएं ढूंढें और उन्हें ठीक करें.
पक्का करें कि पेज को एचटीटीपीएस से पूरी तरह सुरक्षित किया गया हो.

मीडिया

हर ब्राउज़र टैब के हिसाब से जानकारी देखें और मीडिया प्लेयर को डीबग करें.
डिवाइस के सेंसर को एम्युलेट करें.
पुष्टि करने वालों को एम्युलेट करें.