C/C++ डीबग करने के लिए मेमोरी इंस्पेक्टर बढ़ाएं

Chrome 92 में, हमने मेमोरी इंस्पेक्टर की सुविधा दी है, जो लीनियर मेमोरी बफ़र की जांच करने वाला टूल है. इस लेख में हम बात करेंगे कि हमने C/C++ डीबग करने की प्रोसेस के दौरान आने वाली तकनीकी चुनौतियों से जुड़े इंस्पेक्टर की सुविधा को कैसे बेहतर बनाया है.

अगर आपने C/C++ डीबगिंग और मेमोरी इंस्पेक्टर का इस्तेमाल पहले कभी नहीं किया है, तो यहां कुछ काम की ब्लॉग पोस्ट दी गई हैं:

परिचय

मेमोरी इंस्पेक्टर, लीनियर मेमोरी बफ़र के लिए डीबग करने के ज़्यादा बेहतर विकल्प उपलब्ध कराता है. C/C++ के मामले में, WebAssembly मेमोरी में C/C++ मेमोरी ऑब्जेक्ट की जांच की जा सकती है.

आस-पास मौजूद WebAssembly मेमोरी में अपने ऑब्जेक्ट के बाइट को पहचानना मुश्किल था. आपको ऑब्जेक्ट का साइज़ पता होना चाहिए और ऑब्जेक्ट की शुरुआत से बाइट की गिनती करनी होगी. नीचे दिए गए स्क्रीनशॉट में, 10 एलिमेंट वाले int32 कलेक्शन का पहला बाइट चुना गया है. हालांकि, यह तुरंत पता नहीं चलता कि कौनसे अन्य बाइट कलेक्शन से जुड़े हैं. क्या यह अच्छा नहीं होगा, अगर ऑब्जेक्ट से जुड़े सभी बाइट को तुरंत पहचाना जा सके?

ओरिजनल मेमोरी इंस्पेक्टर का स्क्रीनशॉट, जिसमें एक हाइलाइट किया गया बाइट है

मेमोरी इंस्पेक्टर में ऑब्जेक्ट को हाइलाइट करना

Chrome 107 से, मेमोरी इंस्पेक्टर, C/C++ मेमोरी ऑब्जेक्ट के सभी बाइट को हाइलाइट करता है. इससे आपको उन्हें आस-पास की 'यादें' से अलग करने में मदद मिलती है.

अपडेट किए गए मेमोरी इंस्पेक्टर का स्क्रीनशॉट, जिसमें हाइलाइट किए गए ऐरे को दिखाया गया है

मेमोरी इंस्पेक्टर के काम करने का तरीका जानने के लिए, नीचे दिया गया वीडियो देखें. मेमोरी इंस्पेक्टर में ऐरे x को दिखाने पर, मेमोरी व्यूअर में हाइलाइट की गई मेमोरी दिखती है. साथ ही, उसके ठीक ऊपर एक नई चिप दिखती है. यह चिप, हाइलाइट की गई मेमोरी का नाम और टाइप याद दिलाती है. ऑब्जेक्ट की मेमोरी पर जाने के लिए, चिप पर क्लिक करें. चिप पर कर्सर घुमाने पर, आपको क्रॉस आइकॉन दिखेगा. हाइलाइट हटाने के लिए, उस पर क्लिक करें.

जब जांचे जा रहे ऑब्जेक्ट के बाहर कोई बाइट चुना जाता है, तो आपका ध्यान भटकने से बचाने के लिए, हाइलाइट हट जाती है. फ़ोकस को फिर से ऑब्जेक्ट पर ले जाने के लिए, ऑब्जेक्ट के किसी भी बाइट या चिप पर फिर से क्लिक करें.

ऑब्जेक्ट को हाइलाइट करने की सुविधा, सिर्फ़ ऐरे तक सीमित नहीं है. स्ट्रक्चर, ऑब्जेक्ट, और पॉइंटर की जांच भी की जा सकती है. इन बदलावों से, C/C++ ऐप्लिकेशन की मेमोरी को एक्सप्लोर करना पहले से ज़्यादा आसान हो गया है!

क्या आपको इसे आज़माना है? आपको ये काम करने होंगे:

  • आपके पास Chrome 107 या उसके बाद का वर्शन हो.
  • C/C++ DWARF एक्सटेंशन इंस्टॉल करें.
  • DevTools > सेटिंग पर टैप करें. सेटिंग > प्रयोग > WebAssemble डीबगिंग: DWARF सहायता चालू करें में जाकर, DWARF डीबगिंग की सुविधा चालू करें.
  • यह डेमो पेज खोलें.
  • पेज पर दिए गए निर्देशों का पालन करें.

डीबग करने का उदाहरण

इस सेक्शन में, एक छोटे बग के बारे में जानें. इससे आपको यह समझने में मदद मिलेगी कि C/C++ को डीबग करने के लिए, मेमोरी इंस्पेक्टर का इस्तेमाल कैसे किया जा सकता है. नीचे दिए गए कोड सैंपल में, प्रोग्रामर ने इंटेजर कलेक्शन बनाया है. साथ ही, आखिरी एलिमेंट चुनने के लिए पॉइंटर अंकगणित का इस्तेमाल करने का फ़ैसला लिया है. माफ़ करें, प्रोग्रामर ने पॉइंटर की गिनती में गलती की है और अब प्रोग्राम आखिरी एलिमेंट के बजाय, बेमतलब की वैल्यू प्रिंट करता है.

#include <iostream>

int main()
{
    int numbers[] = {1, 2, 3, 4};
    int *ptr = numbers;
    int arraySize = sizeof(numbers)/sizeof(int);
    int* lastNumber = ptr + arraySize;  // Can you notice the bug here?
    std::cout <<../ *lastNumber <<../ '\n';
    return 0;
}

प्रोग्रामर, समस्या को डीबग करने के लिए मेमोरी इंस्पेक्टर का इस्तेमाल करता है. इस डेमो को देखकर, इस बारे में ज़्यादा जानें! वे पहले मेमोरी इंस्पेक्टर में ऐरे की जांच करते हैं और देखते हैं कि numbers ऐरे में सिर्फ़ पूर्णांक 1, 2, 3, और 4 हैं, जैसा कि उम्मीद थी.

मेमोरी इंस्पेक्टर के खुले हुए स्क्रीनशॉट में, जांचा गया int32 कलेक्शन दिख रहा है. ऐरे के सभी एलिमेंट हाइलाइट हो जाते हैं.

इसके बाद, वे स्कोप पैनल से lastNumber वैरिएबल दिखाते हैं और देखते हैं कि पॉइंटर, ऐरे के बाहर मौजूद किसी पूर्णांक पर ले जाता है! इस जानकारी के आधार पर, प्रोग्रामर को पता चलता है कि उन्होंने लाइन 8 पर पॉइंटर ऑफ़सेट की गलत गिनती की है. यह ptr + arraySize - 1 होना चाहिए था.

मेमोरी इंस्पेक्टर का स्क्रीनशॉट, जिसमें हाइलाइट की गई मेमोरी दिख रही है. इस मेमोरी को &#39;lastNumber&#39; नाम के पॉइंटर से पॉइंट किया गया है. हाइलाइट की गई मेमोरी, पहले हाइलाइट किए गए ऐरे के आखिरी बाइट के ठीक बाद है.

यह एक छोटा उदाहरण है, लेकिन इससे पता चलता है कि ऑब्जेक्ट को हाइलाइट करने से, मेमोरी ऑब्जेक्ट का साइज़ और पोज़िशन असरदार तरीके से कैसे पता चलती है. इससे आपको यह समझने में मदद मिलती है कि आपके C/C++ ऐप्लिकेशन की मेमोरी में क्या हो रहा है.

DevTools यह कैसे तय करता है कि क्या हाइलाइट करना है

इस सेक्शन में, हम उन टूल के नेटवर्क के बारे में जानेंगे जिनकी मदद से C/C++ को डीबग किया जा सकता है. खास तौर पर, आपको यह जानकारी मिलेगी कि DevTools, V8, C/C++ DWARF एक्सटेंशन, और Emscripten, Chrome में C/C++ डीबग करने की प्रक्रिया को कैसे संभव बनाते हैं.

DevTools में C/C++ डीबगिंग की पूरी सुविधाएं पाने के लिए, आपको इन दो चीज़ों की ज़रूरत है:

  • Chrome में इंस्टॉल किया गया C/C++ DWARF एक्सटेंशन
  • C/C++ सोर्स फ़ाइलें, इस ब्लॉग पोस्ट में दिए गए निर्देशों के मुताबिक, नए Emscripten कंपाइलर की मदद से WebAssembly में कंपाइल की गई हों

लेकिन क्यों? Chrome का JavaScript और WebAssembly इंजन, V8, C या C++ को चलाने का तरीका नहीं जानता. C/C++ को WebAssembly कंपाइलर में बदलने वाले Emscripten की मदद से, C या C++ में बनाए गए ऐप्लिकेशन को WebAssembly के तौर पर कंपाइल किया जा सकता है और उन्हें ब्राउज़र में चलाया जा सकता है!

कंपाइल करने के दौरान, emscripten आपकी बाइनरी में DWARF डीबग डेटा को एम्बेड करेगा. यह डेटा, एक्सटेंशन को यह पता लगाने में मदद करता है कि आपके C/C++ वैरिएबल से कौनसे WebAssembly वैरिएबल मेल खाते हैं. इस तरह, DevTools आपको C++ वैरिएबल दिखा सकता है, भले ही V8 में WebAssembly चल रही हो. अगर आपको DWARF डीबग डेटा का उदाहरण देखना है, तो यह ब्लॉग पोस्ट देखें.

तो lastNumber को दिखाने पर क्या होता है? जैसे ही आप मेमोरी आइकॉन पर क्लिक करते हैं, DevTools यह जांच करता है कि आपको किस वैरिएबल की जांच करनी है. इसके बाद, यह एक्सटेंशन से lastNumber के डेटा टाइप और जगह के बारे में क्वेरी करता है. एक्सटेंशन से जानकारी मिलने के बाद, मेमोरी इंस्पेक्टर मेमोरी का काम का हिस्सा दिखा सकता है. साथ ही, ऑब्जेक्ट का साइज़ भी दिखा सकता है.

अगर आपने पिछले उदाहरण में lastNumber को देखा है, तो आपको पता चल सकता है कि हमने lastNumber: int * की जांच की है, लेकिन मेमोरी इंस्पेक्टर में मौजूद चिप में *lastNumber: int दिखता है. ऐसा क्यों है? आपको दिखाए गए ऑब्जेक्ट के टाइप की जानकारी देने के लिए, इंस्पेक्टर C++ स्टाइल के पॉइंटर डीरेफ़रंसिंग का इस्तेमाल करता है! अगर आपने किसी पॉइंटर की जांच की है, तो जांच करने वाला टूल आपको दिखाएगा कि वह पॉइंट क्या है.

डीबगर के चरणों पर हाइलाइट को बनाए रखना

मेमोरी इंस्पेक्टर में किसी ऑब्जेक्ट के दिखने और डीबगर के साथ जाने पर, इंस्पेक्टर उस हाइलाइट को बनाए रखता है जिसे लगता है कि वह अब भी लागू है. शुरुआत में, हमारे रोडमैप में यह सुविधा नहीं थी. हालांकि, हमें जल्द ही पता चल गया कि इससे डीबग करने के आपके अनुभव पर बुरा असर पड़ता है. कल्पना करें कि आपको हर चरण के बाद, ऐरे की फिर से जांच करनी पड़े, जैसा कि नीचे दिए गए वीडियो में दिखाया गया है!

जब डीबगर किसी नए ब्रेकपॉइंट पर पहुंचता है, तो मेमोरी इंस्पेक्टर, V8 और पिछले हाइलाइट से जुड़े वैरिएबल के एक्सटेंशन के लिए फिर से क्वेरी करता है. इसके बाद, यह ऑब्जेक्ट की जगहों और टाइप की तुलना करती है. अगर दोनों पैटर्न एक जैसे हैं, तो हाइलाइट बनी रहती है. ऊपर दिए गए वीडियो में, x कलेक्शन में एक फॉर-लूप टेक्स्ट दिखाया गया है. इन कार्रवाइयों से ऐरे का टाइप या पोज़िशन नहीं बदलती, इसलिए यह हाइलाइट रहता है.

आपको शायद यह जानना हो कि इससे पॉइंटर पर क्या असर पड़ता है. अगर आपके पास हाइलाइट किया गया कोई पॉइंटर है और उसे किसी दूसरे ऑब्जेक्ट पर फिर से असाइन किया जाता है, तो हाइलाइट किए गए ऑब्जेक्ट की पुरानी और नई पोज़िशन अलग-अलग हो जाती है. साथ ही, हाइलाइट हट जाती है. जिस ऑब्जेक्ट पर कर्सर ले जाया गया है वह WebAssembly मेमोरी में कहीं भी हो सकता है. साथ ही, हो सकता है कि उसका पिछली मेमोरी लोकेशन से कोई लेना-देना न हो. इसलिए, नई मेमोरी लोकेशन पर जाने के बजाय, हाइलाइट हटाना बेहतर होता है. स्कोप पैनल में, पॉइंटर के मेमोरी आइकॉन पर क्लिक करके, उसे फिर से हाइलाइट किया जा सकता है.

नतीजा

इस लेख में, C/C++ डीबगिंग के लिए, मेमोरी इंस्पेक्टर में किए गए सुधारों के बारे में बताया गया है. हमें उम्मीद है कि नई सुविधाएं, C/C++ ऐप्लिकेशन की मेमोरी को डीबग करना आसान बनाएंगी! अगर आपके पास इसे और बेहतर बनाने का कोई सुझाव है, तो गड़बड़ी की शिकायत करें और हमें बताएं!

अब क्या होगा

ज़्यादा जानने के लिए, ये देखें: