আপনার ওয়েবসাইটের কর্মক্ষমতা বিশ্লেষণ করতে পারফরম্যান্স প্যানেল ব্যবহার করুন।
ওভারভিউ
পারফরম্যান্স প্যানেল আপনাকে আপনার ওয়েব অ্যাপ্লিকেশনের CPU পারফরম্যান্স প্রোফাইল রেকর্ড করতে দেয়। সম্ভাব্য পারফরম্যান্সের বাধা খুঁজে পেতে প্রোফাইলগুলি বিশ্লেষণ করুন এবং আপনি সম্পদের ব্যবহারকে অপ্টিমাইজ করতে পারেন।
নিম্নলিখিত কাজ করতে পারফরম্যান্স প্যানেল ব্যবহার করুন:
- একটি কর্মক্ষমতা প্রোফাইল রেকর্ড করুন.
- ক্যাপচার সেটিংস পরিবর্তন করুন।
- একটি কর্মক্ষমতা রিপোর্ট বিশ্লেষণ.
আপনার ওয়েবসাইটের কর্মক্ষমতা উন্নত করার জন্য একটি বিস্তৃত গাইডের জন্য, রানটাইম কর্মক্ষমতা বিশ্লেষণ দেখুন।
পারফরম্যান্স প্যানেল খুলুন
পারফরম্যান্স প্যানেল খুলতে, DevTools খুলুন এবং উপরের ট্যাবগুলির একটি সেট থেকে পারফরম্যান্স নির্বাচন করুন৷
বিকল্পভাবে, কমান্ড মেনু দিয়ে পারফরম্যান্স প্যানেল খুলতে এই পদক্ষেপগুলি অনুসরণ করুন:
- DevTools খুলুন ।
- টিপে কমান্ড মেনু খুলুন:
- macOS: কমান্ড + শিফট + পি
- উইন্ডোজ, লিনাক্স, ক্রোমওএস: কন্ট্রোল + শিফট + পি
-
Performance panel
টাইপ করা শুরু করুন, পারফরম্যান্স প্যানেল দেখান নির্বাচন করুন এবং এন্টার টিপুন।
একটি কর্মক্ষমতা প্রোফাইল রেকর্ড করুন
আপনি যখন রেকর্ড করতে প্রস্তুত হন, তখন পারফরম্যান্স প্যানেল আপনাকে নিম্নলিখিত বিকল্পগুলি দেয়:
- রেকর্ড রানটাইম কর্মক্ষমতা
- রেকর্ড লোড কর্মক্ষমতা
- রেকর্ড করার সময় স্ক্রিনশট ক্যাপচার করুন
- রেকর্ড করার সময় জোর করে আবর্জনা সংগ্রহ করুন
- একটি রেকর্ডিং সংরক্ষণ করুন
- একটি রেকর্ডিং লোড করুন
- একটি রেকর্ডিং সাফ করুন
ক্যাপচার সেটিংস পরিবর্তন করুন
ক্যাপচার সেটিংস আপনাকে পরিবর্তন করতে দেয় যে কীভাবে DevTools পারফরম্যান্স রেকর্ডিং ক্যাপচার করে এবং প্রতিবেদনে আপনাকে অতিরিক্ত তথ্য দিতে পারে। ক্যাপচার সেটিংস মেনু অ্যাক্সেস করতে ক্যাপচার সেটিংস
ক্লিক করুন।ক্যাপচার সেটিংস মেনু থেকে নিম্নলিখিত বিকল্পগুলি নির্বাচন করুন:
- জাভাস্ক্রিপ্ট নমুনাগুলি নিষ্ক্রিয় করুন : রেকর্ডিংয়ের সময় কল করা প্রধান ট্র্যাকে প্রদর্শিত জাভাস্ক্রিপ্ট কল স্ট্যাকের রেকর্ডিং অক্ষম করে৷ ওভারহেড কর্মক্ষমতা কমিয়ে দেবে।
- উন্নত পেইন্ট ইন্সট্রুমেন্টেশন সক্ষম করুন (ধীরে) : উন্নত পেইন্ট ইন্সট্রুমেন্টেশন ক্যাপচার করে। উল্লেখযোগ্যভাবে কর্মক্ষমতা বাধা.
- CSS নির্বাচক পরিসংখ্যান সক্ষম করুন (ধীরে) : CSS নির্বাচক পরিসংখ্যান ক্যাপচার করে। উল্লেখযোগ্যভাবে কর্মক্ষমতা বাধা.
- CPU থ্রটলিং : ধীর CPU গতি অনুকরণ করুন।
- নেটওয়ার্ক থ্রটলিং : ধীর নেটওয়ার্ক গতি অনুকরণ করুন।
- হার্ডওয়্যার কনকারেন্সি :
navigator.hardwareConcurrency
দ্বারা রিপোর্ট করা মান কনফিগার করুন।
একটি কর্মক্ষমতা রিপোর্ট বিশ্লেষণ
পারফরম্যান্স প্যানেল কীভাবে ব্যবহার করবেন তার সম্পূর্ণ গাইডের জন্য একটি কর্মক্ষমতা রেকর্ডিং বিশ্লেষণ দেখুন।
নিম্নলিখিতটি গাইড থেকে বিষয়গুলির একটি গ্রুপিং এবং অন্যান্য সহায়ক ডকুমেন্টেশন উপস্থাপন করে:
প্রতিবেদনটি কীভাবে নেভিগেট করবেন তা শিখতে:
আপনার কর্মপ্রবাহের জন্য গুরুত্বপূর্ণ বিষয়গুলিতে কীভাবে ফোকাস করবেন তা শিখতে:
- ট্র্যাকগুলির ক্রম পরিবর্তন করুন এবং তাদের লুকান৷
- শিখা চার্টে ফাংশন এবং তাদের সন্তানদের লুকান
- ব্রেডক্রাম্ব তৈরি করুন এবং জুম লেভেলের মধ্যে লাফ দিন
বটম-আপ, কল ট্রি এবং ইভেন্ট লগ ট্যাব সম্পর্কে জানতে:
প্রতিবেদনটি কীভাবে বিশ্লেষণ করবেন তা শিখতে:
- প্রধান থ্রেড কার্যকলাপ দেখুন
- শিখা চার্ট পড়ুন
- একটি স্ক্রিনশট দেখুন
- মেমরি মেট্রিক্স দেখুন
- রেকর্ডিংয়ের একটি অংশের সময়কাল দেখুন
- স্টাইল ইভেন্টগুলি পুনরায় গণনা করার সময় সিএসএস নির্বাচক কর্মক্ষমতা বিশ্লেষণ করুন
- পারফরম্যান্স প্যানেলের সাথে প্রোফাইল Node.js পারফরম্যান্স
- প্রতি সেকেন্ডে ফ্রেম বিশ্লেষণ করুন (FPS)
- টাইমলাইন ইভেন্ট রেফারেন্স
এই প্যানেলগুলির সাথে কর্মক্ষমতা উন্নত করুন
আপনার ওয়েবসাইটের কর্মক্ষমতা উন্নত করতে সাহায্য করতে পারে এমন অন্যান্য প্যানেল আবিষ্কার করুন: