ক্লিপবোর্ড পরিবর্তন ইভেন্টটি পরীক্ষা করুন—ক্লিপবোর্ড নিরীক্ষণের আরও কার্যকর উপায়।

রোহান রাজা
Rohan Raja
প্যাট্রিক ব্রসেট
Patrick Brosset

প্রকাশিত: ২৩ সেপ্টেম্বর, ২০২৫

clipboardchange ইভেন্ট হল মাইক্রোসফ্ট এজ টিম দ্বারা Chrome-এ যোগ করা একটি নতুন বৈশিষ্ট্য। এটি আপনাকে পোলিং এর পারফরম্যান্স ওভারহেড ছাড়াই ক্লিপবোর্ড পরিবর্তনগুলি দক্ষতার সাথে পর্যবেক্ষণ করতে দেয়।

আপনি এখন Chrome এবং Edge উভয় সংস্করণেই অরিজিন ট্রায়ালের মাধ্যমে clipboardchange ইভেন্টটি পরীক্ষা করতে পারবেন, যা ১৪০ সংস্করণ থেকে শুরু হবে। এই নতুন বৈশিষ্ট্যটি পরীক্ষা করার সময় আপনার যেকোনো প্রতিক্রিয়া আমরা স্বাগত জানাই কারণ আমরা শেষ পর্যন্ত এটিকে মানসম্মত করার আশা করি।

পরিবর্তনগুলি সনাক্ত করার জন্য ক্লিপবোর্ডে ভোটগ্রহণের চ্যালেঞ্জগুলি

সিস্টেম ক্লিপবোর্ডে কোন কন্টেন্ট আছে তা জানতে, আপনাকে অদক্ষ পোলিং পদ্ধতি ব্যবহার করতে হবে। উদাহরণস্বরূপ, টেক্সট এডিটিং ওয়েব অ্যাপগুলি ক্লিপবোর্ডে টেক্সট, ছবি বা HTML কন্টেন্ট আছে কিনা তার উপর ভিত্তি করে বিভিন্ন "পেস্ট" বোতাম সক্ষম করতে চাইতে পারে।

এটি অর্জনের বর্তমান পদ্ধতিতে আপনাকে বারবার navigator.clipboard.read() পদ্ধতিতে কল করে ক্লিপবোর্ডের বিষয়বস্তু পরীক্ষা করতে হবে, যেমনটি নিম্নলিখিত কোড স্নিপেটে দেখানো হয়েছে:

// Inefficient polling approach
setInterval(async () => {
  try {
    const clipboardItems = await navigator.clipboard.read();
    updatePasteButtons(clipboardItems);
  } catch (err) {
    console.error('Failed to read clipboard:', err);
  }
}, 1000); // Poll every second

যদিও এটি কাজ করে, এর উল্লেখযোগ্য অসুবিধাও রয়েছে।

কর্মক্ষমতা প্রভাব

ক্লিপবোর্ডে ক্রমাগত পোলিং করলে অপ্রয়োজনীয় ওভারহেড তৈরি হয়। navigator.clipboard.read() এ প্রতিটি কলের জন্য সিস্টেম-স্তরের ক্লিপবোর্ড অ্যাক্সেস প্রয়োজন, যা আপনার অ্যাপ্লিকেশনের কর্মক্ষমতাকে নেতিবাচকভাবে প্রভাবিত করতে পারে, বিশেষ করে রিসোর্স-সীমাবদ্ধ ডিভাইসগুলিতে। পোলিং ফ্রিকোয়েন্সি প্রতিক্রিয়াশীলতা এবং কর্মক্ষমতার মধ্যে একটি বিনিময় হয়ে ওঠে।

ব্যাটারির চার্জ শেষ হয়ে গেছে

মোবাইল ডিভাইসে, ঘন ঘন ক্লিপবোর্ড পোলিং ব্যাটারি নিষ্কাশনে অবদান রাখতে পারে কারণ অ্যাপ্লিকেশনটি ক্রমাগত সিস্টেম রিসোর্স অ্যাক্সেস করে, এমনকি যখন ব্যবহারকারী সক্রিয়ভাবে কন্টেন্ট কপি বা পেস্ট করছেন না।

ব্যবহারকারীর অভিজ্ঞতার অসঙ্গতি

পোলিং ব্যবধান কন্টেন্ট কপি করার সময় এবং নতুন ক্লিপবোর্ড অবস্থা প্রতিফলিত করার জন্য UI আপডেট করার মধ্যে বিলম্ব সৃষ্টি করে। ব্যবহারকারীরা পুরানো পেস্ট বোতামের অবস্থা দেখতে পারেন অথবা সংক্ষিপ্ত সময়ের সম্মুখীন হতে পারেন যেখানে সঠিক বিকল্পগুলি উপলব্ধ থাকে না।

অতিরিক্ত ভোটগ্রহণের সাথে গোপনীয়তার উদ্বেগ

ঘন ঘন ক্লিপবোর্ড অ্যাক্সেস গোপনীয়তা সংক্রান্ত উদ্বেগ বাড়াতে পারে, কারণ অ্যাপ্লিকেশনগুলি ক্রমাগত ক্লিপবোর্ড ডেটা পড়ছে, এমনকি যখন এটি পরিবর্তিত হয়নি। এটি তাদের ক্লিপবোর্ডের বিষয়বস্তু সম্পর্কে গোপনীয়তা-সচেতন ব্যবহারকারীদের কাছে হস্তক্ষেপকারী বলে মনে হতে পারে।

clipboardchange ইভেন্ট

এই চ্যালেঞ্জগুলি মোকাবেলা করার জন্য, আমরা clipboardchange নামে একটি নতুন ইভেন্ট বাস্তবায়ন করেছি এবং Edge এবং Chrome উভয় ক্ষেত্রেই একটি অরিজিন ট্রায়াল চালু করছি, যাতে আপনি এটি আপনার অ্যাপগুলিতে পরীক্ষা করতে পারেন।

এই ইভেন্টটি ওয়েব অ্যাপ্লিকেশনগুলিকে ক্লিপবোর্ডের পরিবর্তনগুলির জন্য সক্রিয়ভাবে ভোট দেওয়ার পরিবর্তে প্রতিক্রিয়াশীলভাবে প্রতিক্রিয়া জানাতে দেয়। কোনও অ্যাপ্লিকেশন থেকে কন্টেন্ট কপি বা কাট ক্লিপবোর্ডে করা হলে, ক্লিপবোর্ড সাফ করা হলে, অথবা কন্টেন্ট পেস্ট করা হলে (যা কিছু ক্ষেত্রে ক্লিপবোর্ড সাফ করতে পারে) এটি স্বয়ংক্রিয়ভাবে সক্রিয় হয়। ডকুমেন্টে ফোকাস থাকলেই ইভেন্টটি সক্রিয় হয়।

আপনি এখানে দেখানো navigator.clipboard ইন্টারফেসে একটি listener যোগ করে clipboardchange ইভেন্টটি শুনতে পারেন:

navigator.clipboard.addEventListener('clipboardchange', event => {
  console.log('Clipboard content changed!');
  console.log('Available MIME types:', event.types);

  // Update UI based on available formats
  updatePasteButtons(event.types);
});

মূল সুবিধা

clipboardchange ইভেন্টটি পোলিং-এর তুলনায় বেশ কিছু সুবিধা প্রদান করে:

  • দক্ষ : ইভেন্টগুলি কেবল তখনই কার্যকর হয় যখন পরিবর্তনগুলি আসলে ঘটে।
  • গোপনীয়তা-সংরক্ষণ : ইভেন্টটি শুধুমাত্র স্থানীয় MIME প্রকারগুলিকে প্রকাশ করে, প্রকৃত সামগ্রী নয়।
  • কোনও অনুমতির প্রম্পট নেই : যেহেতু কোনও সংবেদনশীল তথ্য প্রকাশ করা হয় না, তাই ব্যবহারকারীর অনুমতির প্রয়োজন হয় না।
  • রিয়েল-টাইম রেসপন্সিভনেস : ক্লিপবোর্ডের কন্টেন্ট পরিবর্তন হলেই UI তাৎক্ষণিকভাবে আপডেট হয়।
  • ফোকাস-অ্যাওয়ার : ডকুমেন্টে ফোকাস থাকলেই ইভেন্টগুলি কার্যকর হয়।

types সম্পত্তি

clipboardchange ইভেন্ট অবজেক্টে একটি types প্রোপার্টি থাকে, যার মধ্যে ক্লিপবোর্ডে উপলব্ধ MIME টাইপের একটি অ্যারে থাকে:

navigator.clipboard.addEventListener('clipboardchange', event => {
  // Example types array: ['text/plain', 'text/html', 'image/png']
  const hasText = event.types.includes('text/plain');
  const hasImage = event.types.includes('image/png');
  const hasHtml = event.types.includes('text/html');

  // Enable/disable paste buttons accordingly
  document.getElementById('paste-text').disabled = !hasText;
  document.getElementById('paste-image').disabled = !hasImage;
  document.getElementById('paste-html').disabled = !hasHtml;
});

মনোযোগের আচরণ

ডকুমেন্টটি ফোকাসে না থাকাকালীন যদি ক্লিপবোর্ডে পরিবর্তন ঘটে, তাহলে ডকুমেন্টটি সিস্টেম ফোকাস ফিরে পেলে একটি একক clipboardchange ইভেন্ট চালু হয়। ঐতিহাসিক ক্লিপবোর্ড পরিবর্তনের তথ্য উপলব্ধ থাকবে না, শুধুমাত্র পৃষ্ঠাটি ফোকাস অর্জন করার সময় উপলব্ধ প্রকারগুলি types সদস্যে অন্তর্ভুক্ত করা হবে।

আজই clipboardchange ইভেন্টটি পরীক্ষা করুন

আপনি আজই নতুন clipboardchange ইভেন্টটি পরীক্ষা করতে পারেন:

  • হয় স্থানীয়ভাবে, শুধুমাত্র আপনার ব্রাউজারে বৈশিষ্ট্যটি সক্ষম করে।
  • অথবা আপনার প্রোডাকশন ওয়েব অ্যাপ্লিকেশনে, অরিজিন ট্রায়ালের জন্য নিবন্ধন করে।

আরও ভালো সামঞ্জস্যের জন্য clipboardchange ইভেন্টটি সনাক্ত করুন

প্রথমত, যেহেতু এটি একটি নতুন বৈশিষ্ট্য, তাই এটি ব্যবহার করার আগে আপনাকে এর সমর্থন সনাক্ত করতে হবে। আপনি navigator.clipboardonclipboardchange বৈশিষ্ট্যের অস্তিত্ব পরীক্ষা করে এটি অর্জন করতে পারেন, যেমনটি এখানে দেখানো হয়েছে:

if ('onclipboardchange' in navigator.clipboard) {
  // The clipboardchange event is supported
  navigator.clipboard.addEventListener('clipboardchange', handleClipboardChange);
} else {
  // Fallback to polling or other methods
  console.log('clipboardchange event not supported, using fallback');
  setInterval(checkClipboard, 2000);
}

স্থানীয়ভাবে পরীক্ষা করুন

শুধুমাত্র আপনার ব্রাউজারে clipboardchange ইভেন্টটি পরীক্ষা করতে:

  1. about://flags পৃষ্ঠাটি খুলুন।
  2. অনুসন্ধান পতাকা বাক্সে ClipboardChangeEvent অনুসন্ধান করুন।
  3. ড্রপ-ডাউন ব্যবহার করুন এবং মানটি Default থেকে Enabled এ পরিবর্তন করুন।
  4. আপনার ব্রাউজারটি পুনরায় চালু করুন।

অরিজিন ট্রায়ালের জন্য সাইন আপ করুন

আপনার সাইটে প্রকৃত ব্যবহারকারীদের সাথে clipboardchange ইভেন্টটি চেষ্টা করার জন্য, Chrome অথবা Edge- এ অরিজিন ট্রায়ালের জন্য সাইন আপ করুন। অরিজিন ট্রায়ালটি Chrome এবং Edge-এ 140 এবং 142 সংস্করণের মধ্যে (2 সেপ্টেম্বর, 2025 এবং 2 ডিসেম্বর, 2025 এর মধ্যে) চলবে।

অরিজিন ট্রায়াল সম্পর্কে আরও জানতে এবং কীভাবে শুরু করবেন তা জানতে "অরিজিন ট্রায়াল দিয়ে শুরু করুন" পড়ুন।

ডেমো

ইভেন্টটি কীভাবে কার্যকর হবে তা দেখতে, আমাদের ডেমোটি ঘুরে দেখুন এবং GitHub-এ সোর্স কোডটি দেখুন।

এই ডেমোটি দেখায় কিভাবে clipboardchange ইভেন্ট ব্যবহার করে একটি প্রতিক্রিয়াশীল পেস্ট ইন্টারফেস তৈরি করা যেতে পারে যা আপনার ক্লিপবোর্ডের বিষয়বস্তুর উপর ভিত্তি করে স্বয়ংক্রিয়ভাবে আপডেট হয়।

বিভিন্ন ধরণের কন্টেন্ট (টেক্সট, ছবি, HTML) কপি করার চেষ্টা করুন এবং দেখুন কিভাবে পেস্ট বোতামগুলি রিয়েল-টাইমে কোনও পোলিং ছাড়াই সক্রিয় এবং নিষ্ক্রিয় করে!

প্রতিক্রিয়া

আপনার ব্যবহারের ক্ষেত্রে clipboardchange ইভেন্ট কীভাবে কাজ করে সে সম্পর্কে আমরা আপনার কাছ থেকে জানতে আগ্রহী। W3C/clipboard-apis সংগ্রহস্থলে একটি সমস্যা তৈরি করে প্রতিক্রিয়া জানান।
আপনার আগ্রহ সম্পর্কে জনসাধারণের সংকেত আমাদের এবং অন্যান্য ব্রাউজারগুলিকে আপনার জন্য এই বৈশিষ্ট্যটির গুরুত্ব বুঝতে সাহায্য করবে, যা মানীকরণ প্রক্রিয়াকে অবহিত করতে পারে।

এই ইভেন্টটি যদি একটি প্রগতিশীল বর্ধন হিসেবে ব্যবহার করা যায়, তবুও আমরা এটিকে ক্লিপবোর্ড এপিআই স্পেসিফিকেশনের অংশ হিসেবে মানসম্মত করতে চাই এবং অবশেষে এটি সমস্ত ব্রাউজার দ্বারা গৃহীত হতে দেখতে চাই। আপাতত, আপনি পোলিং বা অন্যান্য ক্লিপবোর্ড পর্যবেক্ষণ কৌশলগুলিতে ফিরে যেতে পারেন।

আরও জানুন