বর্ণনা
DevTools-এ রেকর্ডার প্যানেল কাস্টমাইজ করতে chrome.devtools.recorder API ব্যবহার করুন।
ডেভেলপার টুল এপিআই ব্যবহার করার জন্য সাধারণ পরিচিতির জন্য DevTools API-এর সারাংশ দেখুন।
উপস্থিতি
ধারণা এবং ব্যবহার
chrome.devtools.performance API ডেভেলপারদের Chrome DevTools-এ পারফরম্যান্স প্যানেলের রেকর্ডিং বৈশিষ্ট্যগুলির সাথে ইন্টারঅ্যাক্ট করতে দেয়৷ রেকর্ডিং শুরু বা বন্ধ হলে বিজ্ঞপ্তি পেতে আপনি এই API ব্যবহার করতে পারেন।
দুটি ইভেন্ট উপলব্ধ:
- onProfilingStarted : যখন পারফরম্যান্স প্যানেল পারফরম্যান্স ডেটা রেকর্ড করা শুরু করে তখন এই ইভেন্টটি বরখাস্ত হয়।
- onProfilingStopped : যখন পারফরম্যান্স প্যানেল পারফরম্যান্স ডেটা রেকর্ড করা বন্ধ করে তখন এই ইভেন্টটি বরখাস্ত হয়। অবস্থান যা বর্তমান স্ট্যাক ট্রেসকে cre এর সাথে সংযুক্ত করে উভয় ইভেন্টের কোনো সংশ্লিষ্ট পরামিতি নেই।
এই ইভেন্টগুলি শোনার মাধ্যমে, বিকাশকারীরা পারফরম্যান্স প্যানেলে রেকর্ডিং স্থিতিতে প্রতিক্রিয়া জানাতে পারফরম্যান্স প্রোফাইলিংয়ের সময় অতিরিক্ত অটোমেশন প্রদান করে এমন এক্সটেনশন তৈরি করতে পারে।
উদাহরণ
এইভাবে আপনি রেকর্ডিং স্ট্যাটাস আপডেট শুনতে API ব্যবহার করতে পারেন
chrome.devtools.performance.onProfilingStarted.addListener(() => {
// Profiling started listener implementation
});
chrome.devtools.performance.onProfilingStopped.addListener(() => {
// Profiling stopped listener implementation
})
প্রকারভেদ
RecorderExtensionPlugin
একটি প্লাগইন ইন্টারফেস যা রেকর্ডার প্যানেল রেকর্ডার প্যানেল কাস্টমাইজ করতে আহ্বান করে।
বৈশিষ্ট্য
- আবার দেখাও
অকার্যকর
Chrome 112+এক্সটেনশনকে কাস্টম রিপ্লে কার্যকারিতা বাস্তবায়নের অনুমতি দেয়।
replayফাংশনটি এরকম দেখাচ্ছে:(recording: object) => {...}- রেকর্ডিং
বস্তু
পৃষ্ঠার সাথে ব্যবহারকারীর ইন্টারঅ্যাকশনের একটি রেকর্ডিং। এটি Puppeteer এর রেকর্ডিং স্কিমার সাথে মেলে।
- stringify
অকার্যকর
রেকর্ডার প্যানেল বিন্যাস থেকে একটি রেকর্ডিংকে একটি স্ট্রিংয়ে রূপান্তর করে।
stringifyফাংশনটি এরকম দেখাচ্ছে:(recording: object) => {...}- রেকর্ডিং
বস্তু
পৃষ্ঠার সাথে ব্যবহারকারীর ইন্টারঅ্যাকশনের একটি রেকর্ডিং। এটি Puppeteer এর রেকর্ডিং স্কিমার সাথে মেলে।
- stringifyStep
অকার্যকর
রেকর্ডার প্যানেল বিন্যাস থেকে রেকর্ডিংয়ের একটি ধাপকে একটি স্ট্রিংয়ে রূপান্তর করে।
stringifyStepফাংশনটি এরকম দেখাচ্ছে:(step: object) => {...}- পদক্ষেপ
বস্তু
পৃষ্ঠার সাথে ব্যবহারকারীর মিথস্ক্রিয়া রেকর্ডিংয়ের একটি ধাপ। এটি Puppeteer এর স্টেপ স্কিমার সাথে মেলে।
RecorderView
রেকর্ডার প্যানেলের ভিতরে এম্বেড করার জন্য এক্সটেনশন দ্বারা তৈরি একটি দৃশ্যের প্রতিনিধিত্ব করে।
বৈশিষ্ট্য
- উপর লুকানো
ইভেন্ট<functionvoidvoid>
দৃশ্য লুকিয়ে থাকলে গুলি করা হয়।
onHidden.addListenerফাংশনটি এরকম দেখাচ্ছে:(callback: function) => {...}- কলব্যাক
ফাংশন
callbackপ্যারামিটারটি এর মত দেখাচ্ছে:() => void
- দেখানো হয়েছে
ইভেন্ট<functionvoidvoid>
দৃশ্য দেখানো হলে গুলি চালানো হয়।
onShown.addListenerফাংশনটি এরকম দেখাচ্ছে:(callback: function) => {...}- কলব্যাক
ফাংশন
callbackপ্যারামিটারটি এর মত দেখাচ্ছে:() => void
- প্রদর্শন
অকার্যকর
নির্দেশ করে যে এক্সটেনশনটি রেকর্ডার প্যানেলে এই দৃশ্যটি দেখাতে চায়৷
showফাংশনটি এরকম দেখাচ্ছে:() => {...}
পদ্ধতি
createView()
chrome.devtools.recorder.createView(
title: string,
pagePath: string,
)
রিপ্লে পরিচালনা করতে পারে এমন একটি দৃশ্য তৈরি করে। এই দৃশ্যটি রেকর্ডার প্যানেলের ভিতরে এমবেড করা হবে।
পরামিতি
- শিরোনাম
স্ট্রিং
ডেভেলপার টুলস টুলবারে এক্সটেনশন আইকনের পাশে প্রদর্শিত শিরোনাম।
- পৃষ্ঠাপথ
স্ট্রিং
এক্সটেনশন ডিরেক্টরির সাথে সম্পর্কিত প্যানেলের HTML পৃষ্ঠার পাথ।
রিটার্নস
registerRecorderExtensionPlugin()
chrome.devtools.recorder.registerRecorderExtensionPlugin(
plugin: RecorderExtensionPlugin,
name: string,
mediaType: string,
)
একটি রেকর্ডার এক্সটেনশন প্লাগইন নিবন্ধন করে।
পরামিতি
- প্লাগ লাগানো
RecorderExtensionPlugin ইন্টারফেস বাস্তবায়নের একটি উদাহরণ।
- নাম
স্ট্রিং
প্লাগইন এর নাম.
- আমি আজ খুশি
স্ট্রিং
স্ট্রিং বিষয়বস্তুর মিডিয়া প্রকার যা প্লাগইন তৈরি করে।