মেমরি ইন্সপেক্টর: ArrayBuffer, TypedArray, DataView এবং Wasm মেমরি পরিদর্শন করুন।

জাভাস্ক্রিপ্টে ArrayBuffer , TypedArray , এবং DataView মেমরি পরিদর্শন করতে মেমরি ইন্সপেক্টর ব্যবহার করুন সেইসাথে WebAssembly.Memory C++ এ লেখা Wasm অ্যাপ্লিকেশনের মেমরি।

ওভারভিউ

মেমরি ইন্সপেক্টর মেমরি বিষয়বস্তু সংগঠিত করে এবং আপনাকে দ্রুত বড় অ্যারে নেভিগেট করতে সাহায্য করে। আপনি মেমরি বিষয়বস্তুর ASCII মানগুলি সরাসরি বাইটের পাশে দেখতে পারেন এবং বিভিন্ন প্রান্তিকতা নির্বাচন করতে পারেন। একটি দক্ষ কর্মপ্রবাহের জন্য আপনার ওয়েব অ্যাপ ডিবাগ করার সময় মেমরি ইন্সপেক্টর ব্যবহার করুন।

মেমরি ইন্সপেক্টর খুলুন

মেমরি ইন্সপেক্টর খোলার কয়েকটি উপায় রয়েছে।

মেনু থেকে খুলুন

  1. DevTools খুলুন
  2. আরও বিকল্পে ক্লিক করুন আরও > আরো টুল > মেমরি ইন্সপেক্টরমেমরি পরিদর্শক মেনু

ডিবাগিংয়ের সময় খুলুন

  1. JavaScript ArrayBuffer দিয়ে একটি পৃষ্ঠা খুলুন। আমরা এই ডেমো পৃষ্ঠাটি ব্যবহার করব।
  2. DevTools খুলুন
  3. উত্স প্যানেলে ডেমো-js.js ফাইলটি খুলুন, লাইন 18 এ একটি ব্রেকপয়েন্ট সেট করুন।
  4. পৃষ্ঠাটি রিফ্রেশ করুন।
  5. ডান ডিবাগার প্যানে স্কোপ বিভাগটি প্রসারিত করুন।
  6. আপনি মেমরি পরিদর্শক খুলতে পারেন:

    • আইকন থেকেbuffer সম্পত্তির পাশের আইকনে ক্লিক করা, বা
    • প্রসঙ্গ মেনু থেকেbuffer সম্পত্তিতে ডান ক্লিক করুন এবং মেমরি ইন্সপেক্টর প্যানেলে প্রকাশ নির্বাচন করুন।

    মেমরি ইন্সপেক্টর প্যানেলে প্রকাশ করুন

একাধিক বস্তু পরিদর্শন করুন

  1. আপনি DataView বা TypedArray পাশাপাশি পরিদর্শন করতে পারেন। উদাহরণস্বরূপ, b2 একটি TypedArray । এটি পরিদর্শন করতে, b2 প্রপার্টিতে ডান ক্লিক করুন এবং মেমরি ইন্সপেক্টর প্যানেলে প্রকাশ নির্বাচন করুন ( TypedArray বা DataView এর জন্য এখনও কোন আইকন নেই)।
  2. মেমরি ইন্সপেক্টরে একটি নতুন ট্যাব খোলা হয়। দয়া করে মনে রাখবেন যে আপনি একবারে একাধিক বস্তু পরিদর্শন করতে পারেন। মেমরি ইন্সপেক্টরে নতুন ট্যাব

স্মৃতি পরিদর্শক

স্মৃতি পরিদর্শক

মেমরি পরিদর্শক 3টি প্রধান ক্ষেত্র নিয়ে গঠিত:

নেভিগেশন বার

  1. ঠিকানা ইনপুটটি হেক্স ফরম্যাটে বর্তমান বাইট ঠিকানা দেখায়। আপনি মেমরি বাফারে একটি নতুন অবস্থানে যেতে একটি নতুন মান ইনপুট করতে পারেন। উদাহরণস্বরূপ, 0x00000008 টাইপ করার চেষ্টা করুন।
  2. মেমরি বাফার একটি পৃষ্ঠার চেয়ে দীর্ঘ হতে পারে। স্ক্রোল করার পরিবর্তে, আপনি নেভিগেট করতে বাম এবং ডান বোতাম ব্যবহার করতে পারেন।
  3. বাম দিকের বোতামগুলি একটি ফরোয়ার্ড/পেছনগামী নেভিগেশনের অনুমতি দেয়।
  4. ডিফল্টরূপে, ধাপে ধাপে বাফার স্বয়ংক্রিয়ভাবে আপডেট হয়। যদি তা না হয়, রিফ্রেশ বোতাম আপনাকে মেমরি রিফ্রেশ করার এবং এর বিষয়বস্তু আপডেট করার বিকল্প দেয়।

মেমরি বাফার

মেমরি বাফার

  1. বাম থেকে, ঠিকানাটি হেক্স বিন্যাসে প্রদর্শিত হয়।
  2. মেমরিটি হেক্স ফরম্যাটেও দেখানো হয়, প্রতিটি বাইট একটি স্পেস দ্বারা পৃথক করা হয়। বর্তমানে নির্বাচিত বাইট হাইলাইট করা হয়েছে। আপনি বাইট ক্লিক করতে পারেন বা কীবোর্ড দিয়ে নেভিগেট করতে পারেন (বাম, ডান, উপরে, নিচে)।
  3. মেমরির একটি ASCII উপস্থাপনা ডানদিকে দেখানো হয়েছে। একটি হাইলাইট বাইটের নির্বাচিত বিটগুলির সাথে সম্পর্কিত মান দেখায়। মেমরির মতো, আপনি বাইট ক্লিক করতে পারেন বা কীবোর্ড (বাম, ডান, উপরে, নিচে) দিয়ে নেভিগেট করতে পারেন।

মান পরিদর্শক

মান পরিদর্শক

  1. একটি শীর্ষ টুলবারে বড় এবং ছোট এন্ডিয়ানের মধ্যে স্যুইচ করতে এবং সেটিংস খুলতে একটি বোতাম রয়েছে। ইন্সপেক্টরে ডিফল্ট প্রতি তারা কোন ধরনের মান দেখতে চায় তা নির্বাচন করতে সেটিংস খুলুন। টুলবার বোতাম
  2. প্রধান এলাকা সেটিংস অনুযায়ী সমস্ত মান ব্যাখ্যা দেখায়। ডিফল্টরূপে, সব দেখানো হয়.
  3. এনকোডিং ক্লিকযোগ্য। আপনি পূর্ণসংখ্যার জন্য dec, hex, oct এবং sci, floats-এর জন্য dec-এর মধ্যে স্যুইচ করতে পারেন। এনকোডিং সুইচ

মেমরি পরিদর্শন

আসুন একসাথে স্মৃতি পরিদর্শন করি।

  1. ডিবাগিং শুরু করতে এই পদক্ষেপগুলি অনুসরণ করুন৷
  2. ঠিকানা ইনপুট 0x00000027 এ ঠিকানা পরিবর্তন করুন। ঠিকানা ইনপুট
  3. ASCII উপস্থাপনা এবং মান ব্যাখ্যাগুলি পর্যবেক্ষণ করুন। এই মুহূর্তে সমস্ত মান খালি।
  4. Pointer 32-bit এবং Pointer 64-bit পাশে নীল জাম্প টু অ্যাড্রেস বোতামটি লক্ষ্য করুন। আপনি ঠিকানায় লাফ দিতে এটিতে ক্লিক করতে পারেন। ঠিকানাগুলি বৈধ না হলে বোতামগুলি ধূসর হয়ে যায় এবং ক্লিকযোগ্য নয়৷ ঠিকানা বোতামে ঝাঁপ দাও
  5. কোডের মাধ্যমে ধাপে ধাপে স্ক্রিপ্ট এক্সিকিউশন রিজুমে ক্লিক করুন। স্ক্রিপ্ট এক্সিকিউশন পুনরায় শুরু করুন
  6. লক্ষ্য করুন ASCII উপস্থাপনা এখন আপডেট করা হয়েছে। সমস্ত মান ব্যাখ্যা পাশাপাশি আপডেট করা হয়. সমস্ত মান ব্যাখ্যা আপডেট করা হয়
  7. শুধুমাত্র ফ্লোটিং পয়েন্ট দেখানোর জন্য ভ্যালু ইন্সপেক্টর কাস্টমাইজ করা যাক। সেটিংস বোতামে ক্লিক করুন এবং শুধুমাত্র ফ্লোট 32-বিট এবং 64-বিট ফ্লোট চেক করুন। মান পরিদর্শক কাস্টমাইজ করার জন্য সেটিংস
  8. এনকোডিংকে dec থেকে sci তে পরিবর্তন করা যাক। লক্ষ্য করুন মান উপস্থাপনা সেই অনুযায়ী আপডেট করা হয়েছে। এনকোডিং পরিবর্তন করুন।
  9. আপনার কীবোর্ড বা নেভিগেশন বার ব্যবহার করে মেমরি বাফার নেভিগেট করার চেষ্টা করুন। মান পরিবর্তনগুলি পর্যবেক্ষণ করতে ধাপ 4 পুনরাবৃত্তি করুন।

WebAssembly মেমরি পরিদর্শন

WebAssembly.Memory অবজেক্ট হল একটি ArrayBuffer যা অবজেক্ট মেমরির কাঁচা বাইট ধারণ করে। মেমরি ইন্সপেক্টর প্যানেল আপনাকে C++ এ লেখা Wasm অ্যাপ্লিকেশনগুলিতে এই ধরনের বস্তুগুলি পরিদর্শন করতে দেয়।

WebAssembly.Memory পরিদর্শনের সম্পূর্ণ সুবিধা নিতে:

  • Chrome 107 বা তার পরে ব্যবহার করুন। chrome://version/ এ আপনার সংস্করণ পরীক্ষা করুন।
  • C/C++ DevTools Support (DWARF) এক্সটেনশন ইনস্টল করুন। এটি DWARF ডিবাগ তথ্য ব্যবহার করে C/C++ WebAssembly অ্যাপ্লিকেশন ডিবাগ করার জন্য একটি প্লাগইন।

একটি বস্তুর WebAssembly.Memory পরিদর্শন করতে:

  1. এই ডেমো পৃষ্ঠায় DevTools খুলুন
  2. উত্স প্যানেলে, demo-cpp.cc খুলুন এবং লাইন 15 এ main() ফাংশনে একটি ব্রেকপয়েন্ট সেট করুন : x[i] = n - i - 1; .
  3. অ্যাপ্লিকেশন চালানোর জন্য পৃষ্ঠাটি পুনরায় লোড করুন। ডিবাগার ব্রেকপয়েন্টে বিরতি দেয়।
  4. ডিবাগার প্যানে, স্কোপ > স্থানীয় প্রসারিত করুন।
  5. ক্লিক করুন মেমরি ইন্সপেক্টরে প্রকাশ করুন। x: int[10] অ্যারের পাশের আইকন।

    বিকল্পভাবে, অ্যারেতে ডান-ক্লিক করুন এবং মেমরি ইন্সপেক্টর প্যানেলে প্রকাশ নির্বাচন করুন।

মেমরি ইন্সপেক্টরে এক্স অ্যারে খোলা হয়েছে।

অবজেক্ট মেমরি হাইলাইট করা বন্ধ করতে, মেমরি ইন্সপেক্টর প্যানেলে, অবজেক্ট ব্যাজের উপর হোভার করুন এবং x বোতামে ক্লিক করুন।

অবজেক্ট মেমরি হাইলাইট করা বন্ধ করুন।

আরও জানতে, দেখুন: