WebMCP React অ্যাপগুলোকে সরাসরি AI এজেন্টদের কাছে স্ট্রাকচার্ড টুল API প্রকাশ করতে সাহায্য করে, যা ভঙ্গুর UI-scraping-এর পরিবর্তে নির্ভরযোগ্য এবং UI-নির্ভরহীন কল দ্বারা প্রতিস্থাপিত হয়। এই ফিচারটি Chrome 149 এবং তার পরবর্তী ভার্সনের জন্য একটি origin-trial হিসেবে উপলব্ধ, এবং আপনি এটি chrome://flags/#enable-webmcp-testing-এর মাধ্যমে চালু করতে পারেন।

এজেন্টদের ক্লিক করা শেখানোর সমস্যা

AI এজেন্টদের একটি ওয়েব পেজের সাথে ইন্টারঅ্যাক্ট করার বর্তমান প্রচেষ্টাগুলোর বেশিরভাগই ভিজ্যুয়াল কিউ (visual cues)-এর ওপর নির্ভর করে। একটি এজেন্ট DOM পার্স করে, কোন এলিমেন্টটি বাটন তা অনুমান করে, ক্লিক সিমুলেট করে, স্ক্রল করে এবং ফর্ম ফিল্ড পূরণ করে। যখনই একটি বাটন সরে যায়, একটি লেবেল পরিবর্তিত হয় বা লেআউট কিছুটা পরিবর্তন করা হয়, তখনই স্ক্রিপ্টটি ব্যর্থ হয়। এই পদ্ধতিটি ধীরগতির কারণ এটি প্রতিটি ধাপ রেন্ডার করার জন্য ব্রাউজারের অপেক্ষায় থাকে এবং একটি রুটিন রিডিজাইন পুরো অটোমেশন পাইপলাইনকে ভেঙে ফেলতে পারে।

WebMCP মডেলটিকে বদলে দিচ্ছে

WebMCP হলো Google Chrome দ্বারা প্রবর্তিত একটি নতুন ওয়েব স্ট্যান্ডার্ড। এজেন্টের অনুসন্ধানের জন্য একটি ভিজ্যুয়াল সারফেস প্রকাশ করার পরিবর্তে, একটি পেজ এক সেট tools বিজ্ঞাপন দেয়—যা হলো পেজটি করতে পারে এমন নামযুক্ত এবং টাইপ করা অপারেশন। একটি AI এজেন্ট প্রথমে জিজ্ঞাসা করে “কী কী টুল উপলব্ধ?”; পেজটি “searchProducts” বা “checkout”-এর মতো একটি তালিকা দিয়ে উত্তর দেয়। এরপর এজেন্ট একটি JSON পেলোড পাঠিয়ে একটি টুল কল করে যা টুলের ঘোষিত ইনপুট স্কিমার সাথে মিলে যায়, যেমন searchProducts(query: "jacket")। ব্রাউজার রিকোয়েস্টটি সরাসরি পেজের JavaScript-এ পাঠিয়ে দেয়, যা কোনো UI ছাড়াই অন্তর্নিহিত লজিকটি চালায়।

এর ফলে এমন একটি ইন্টারঅ্যাকশন তৈরি হয় যা তাৎক্ষণিক, CSS পরিবর্তনের ক্ষেত্রেও কাজ করে এবং যতক্ষণ টুল ডেফিনিশনগুলো স্থিতিশীল থাকে ততক্ষণ কার্যকরী থাকে।

ডেভেলপারদের জন্য গুরুত্বপূর্ণ সুবিধাগুলো

  • Speed – যোগাযোগ ব্রাউজারের মেসেজিং সিস্টেমের ভেতরেই থাকে, ফলে ক্লিক রেন্ডার করা এবং পেজ আপডেটের জন্য অপেক্ষা করার মতো বাড়তি ধাপগুলো দূর হয়।
  • Reliability – টুলগুলো সেই একই ফাংশন কল করে যা সাইটটি ইতিমধ্যে তার নিজস্ব UI-এর জন্য ব্যবহার করে, তাই একটি রিডিজাইন API-কে ভেঙে ফেলে না।
  • Control – কোন অপারেশনগুলো প্রকাশ করা হবে, সেগুলো কী কী প্যারামিটার গ্রহণ করবে এবং রেসপন্সে এজেন্ট কী দেখতে পাবে তা ডেভেলপাররা নির্ধারণ করতে পারেন।
  • UI independence – স্টাইলিং, লেআউট বা কম্পোনেন্ট রিফ্যাক্টরিং এখন আর কোনো ফিচার কল করার ক্ষেত্রে এজেন্টের সক্ষমতাকে প্রভাবিত করে না।

WebMCP সার্ভার সাইডে ব্যবহৃত বিদ্যমান MCP (Message-Channel-Protocol)-কে প্রতিস্থাপন করে না। MCP ভারী ডেটা ফেচিং এবং ব্যাকএন্ড অর্কেস্ট্রেশন পরিচালনা করা চালিয়ে যায়, আর WebMCP ইন-ট্যাব (in-tab) লাইভ ইন্টারঅ্যাকশনগুলো পরিচালনা করে।

React ডেভেলপাররা কীভাবে শুরু করতে পারেন

React কোড একটি ইম্পারেটিভ JavaScript API অথবা একটি ডিক্লেয়ারেটিভ HTML ফর্ম-ভিত্তিক API ব্যবহার করে টুল রেজিস্টার করতে পারে। একটি সাধারণ প্যাটার্ন হলো রেজিস্ট্রেশনটিকে একটি কাস্টম হুকের (custom hook) মধ্যে রাখা:

  1. টুলের নাম এবং একটি সংক্ষিপ্ত বিবরণ দিয়ে একটি রেজিস্ট্রেশন ফাংশন কল করুন।
  2. একটি ইনপুট স্কিমা প্রদান করুন (উদাহরণস্বরূপ, প্রয়োজনীয় ফিল্ডগুলো বর্ণনা করে একটি JSON স্কিমা)।
  3. একটি execute কলব্যাক প্রদান করুন যা বিদ্যমান বিজনেস লজিক চালায়—যা প্রায়শই সেই একই ফাংশন যা একটি বাটন ক্লিক ট্রিগার করে।

যখন হুকটি চলে, ব্রাউজার পেজের WebMCP ম্যানিফেস্টের সাথে টুলটি যুক্ত করে দেয়। একটি AI এজেন্ট যদি ম্যানিফেস্টটি খুঁজে পায়, তবে সে DOM স্পর্শ না করেই টুলটি কল করতে পারে।

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

সতর্কতা এবং যা খেয়াল রাখতে হবে

WebMCP এখনও একটি origin trial পর্যায়ে রয়েছে। এটি শুধুমাত্র Chrome 149+ এ কাজ করে এবং একটি ফ্ল্যাগের মাধ্যমে ম্যানুয়ালি চালু করতে হয়।

পরবর্তী পদক্ষেপ কী

Google সেইসব ডেভেলপারদের জন্য এই ট্রায়ালটি উন্মুক্ত করেছে যারা AI-নেটিভ ওয়েব অভিজ্ঞতা নিয়ে পরীক্ষা করতে চান। আগ্রহী ব্যক্তিদের জন্য পরবর্তী পদক্ষেপগুলো হলো:

  • Chrome-এ ফ্ল্যাগটি চালু করুন এবং টার্গেট সাইটটি রিলোড করুন।
  • একটি React কম্পোনেন্টে একটি সাধারণ টুল রেজিস্ট্রেশন যোগ করুন এবং ব্রাউজারের devtools-এ ম্যানিফেস্টটি আসা দেখুন।
  • একটি AI ক্লায়েন্ট (উদাহরণস্বরূপ, একটি লোকাল স্ক্রিপ্ট যা WebMCP প্রোটোকল অনুসরণ করে) দিয়ে টুলটি কল করে দেখুন এবং রেসপন্স যাচাই করুন।
  • স্ট্যাবল শিপিং সংক্রান্ত আপডেটের জন্য ট্রায়ালের স্ট্যাটাস পেজটি অনুসরণ করুন।

সারকথা: WebMCP React ডেভেলপারদের তাদের অ্যাপগুলোকে সরাসরি AI এজেন্টদের মাধ্যমে কল করার উপযোগী করার একটি উপায় দেয়, যা UI এলিমেন্টগুলোকে স্থিতিশীল এবং টাইপ করা সার্ভিসে রূপান্তরিত করে। এই পরিবর্তনটি স্ক্রিন-স্ক্র্যাপিংয়ের রক্ষণাবেক্ষণের দুঃস্বপ্ন দূর করে এবং সত্যিকারের AI-নেটিভ ওয়েব অ্যাপ্লিকেশনের পথ প্রশস্ত করে—যদি টিমগুলো একটি পরীক্ষামূলক Chrome এনভায়রনমেন্টে কাজ করতে স্বাচ্ছন্দ্যবোধ করে।