প্রকাশিত: অক্টোবর 1, 2025
বিল্ট-ইন এআই এপিআই ব্যবহার করার আগে, অন্তর্নিহিত মডেল এবং যেকোনো কাস্টমাইজেশন (যেমন ফাইন-টিউনিং) অবশ্যই নেটওয়ার্ক থেকে ডাউনলোড করতে হবে, সংকুচিত ডেটা বের করতে হবে এবং অবশেষে মেমরিতে লোড করতে হবে। এই গাইডটি এই ডাউনলোডের জন্য অপেক্ষা করার সময় ব্যবহারকারীদের অভিজ্ঞতা উন্নত করার জন্য কিছু সেরা অনুশীলনের নথিভুক্ত করে।
ডাউনলোডের অগ্রগতি নিরীক্ষণ এবং শেয়ার করুন
প্রতিটি বিল্ট-ইন AI API-তে একটি সেশন শুরু করার জন্য create()
ফাংশন থাকে। create()
ফাংশনের একটি monitor
বিকল্প রয়েছে যাতে আপনি ব্যবহারকারীর সাথে শেয়ার করার জন্য ডাউনলোডের অগ্রগতি অ্যাক্সেস করতে পারেন।
যদিও অন্তর্নির্মিত AI API গুলি ক্লায়েন্ট-সাইড AI এর জন্য তৈরি করা হয়, যেখানে ব্রাউজারে এবং ব্যবহারকারীর ডিভাইসে ডেটা প্রক্রিয়া করা হয়, কিছু অ্যাপ্লিকেশন সার্ভারে ডেটা প্রক্রিয়া করার অনুমতি দিতে পারে। মডেল ডাউনলোডের অগ্রগতিতে আপনি কীভাবে আপনার ব্যবহারকারীকে সম্বোধন করবেন সেই প্রশ্নের উপর নির্ভর করে: ডেটা প্রসেসিং কি শুধুমাত্র স্থানীয়ভাবে চালানো হবে নাকি? যদি এটি সত্য হয়, আপনার আবেদন শুধুমাত্র ক্লায়েন্ট-সাইড। যদি না হয়, আপনার অ্যাপ্লিকেশন একটি হাইব্রিড বাস্তবায়ন ব্যবহার করতে পারে।
শুধুমাত্র ক্লায়েন্ট-সাইড
কিছু পরিস্থিতিতে, ক্লায়েন্ট-সাইড ডেটা প্রসেসিং প্রয়োজন। উদাহরণস্বরূপ, একটি স্বাস্থ্যসেবা অ্যাপ্লিকেশন যা রোগীদের তাদের ব্যক্তিগত তথ্য সম্পর্কে প্রশ্ন জিজ্ঞাসা করার অনুমতি দেয় সম্ভবত সেই তথ্য ব্যবহারকারীর ডিভাইসে গোপন রাখতে চায়। ব্যবহারকারীকে মডেল এবং সমস্ত কাস্টমাইজেশন ডাউনলোড না হওয়া পর্যন্ত অপেক্ষা করতে হবে এবং তারা কোনো ডেটা প্রক্রিয়াকরণ বৈশিষ্ট্য ব্যবহার করার আগে প্রস্তুত হবে।
এই ক্ষেত্রে, মডেলটি ইতিমধ্যে উপলব্ধ না হলে, ব্যবহারকারীর কাছে ডাউনলোডের অগ্রগতি তথ্য প্রকাশ করা উচিত।
<style>
progress[hidden] ~ label {
display: none;
}
</style>
<button type="button">Create LanguageModel session</button>
<progress hidden id="progress" value="0"></progress>
<label for="progress">Model download progress</label>
এখন এটি কার্যকরী করতে, কিছুটা জাভাস্ক্রিপ্ট প্রয়োজন। কোডটি প্রথমে অগ্রগতি ইন্টারফেসটিকে প্রাথমিক অবস্থায় (প্রগতি লুকানো এবং শূন্য) রিসেট করে, API আদৌ সমর্থিত কিনা তা পরীক্ষা করে এবং তারপর API এর উপলব্ধতা পরীক্ষা করে :
- APIটি
'unavailable'
: আপনার অ্যাপ্লিকেশনটি এই ডিভাইসে ক্লায়েন্ট-সাইড ব্যবহার করা যাবে না। ব্যবহারকারীকে সতর্ক করুন যে বৈশিষ্ট্যটি অনুপলব্ধ। - APIটি
'available'
: API অবিলম্বে ব্যবহার করা যেতে পারে, অগ্রগতি UI দেখানোর প্রয়োজন নেই। - APIটি
'downloadable'
বা'downloading'
: ডাউনলোড সম্পূর্ণ হলে API ব্যবহার করা যেতে পারে। একটি অগ্রগতি সূচক দেখান এবং যখনইdownloadprogress
ইভেন্ট ফায়ার হয় তখন এটি আপডেট করুন। ডাউনলোডের পরে, ব্যবহারকারীকে সংকেত দিতে অনির্দিষ্ট অবস্থা দেখান যে ব্রাউজারটি মডেলটি বের করে মেমরিতে লোড করছে।
const createButton = document.querySelector('.create');
const promptButton = document.querySelector('.prompt');
const progress = document.querySelector('progress');
const output = document.querySelector('output');
let sessionCreationTriggered = false;
let session = null;
const createSession = async (options = {}) => {
if (sessionCreationTriggered) {
return;
}
progress.hidden = true;
progress.value = 0;
try {
if (!('LanguageModel' in self)) {
throw new Error('LanguageModel is not supported.');
}
const availability = await LanguageModel.availability();
if (availability === 'unavailable') {
throw new Error('LanguageModel is not available.');
}
let modelNewlyDownloaded = false;
if (availability !== 'available') {
modelNewlyDownloaded = true;
progress.hidden = false;
}
console.log(`LanguageModel is ${availability}.`);
sessionCreationTriggered = true;
const llmSession = await LanguageModel.create({
monitor(m) {
m.addEventListener('downloadprogress', (e) => {
progress.value = e.loaded;
if (modelNewlyDownloaded && e.loaded === 1) {
// The model was newly downloaded and needs to be extracted
// and loaded into memory, so show the undetermined state.
progress.removeAttribute('value');
}
});
},
...options,
});
sessionCreationTriggered = false;
return llmSession;
} catch (error) {
throw error;
} finally {
progress.hidden = true;
progress.value = 0;
}
};
createButton.addEventListener('click', async () => {
try {
localSession = await createSession({
expectedInputs: [{ type: 'text', languages: ['en'] }],
expectedOutputs: [{ type: 'text', languages: ['en'] }],
});
promptButton.disabled = false;
} catch (error) {
output.textContent = error.message;
}
});
promptButton.addEventListener('click', async () => {
output.innerHTML = '';
try {
const stream = localSession.promptStreaming('Write me a poem');
for await (const chunk of stream) {
output.append(chunk);
}
} catch (err) {
output.textContent = err.message;
}
});
মডেলটি ব্রাউজারে সক্রিয়ভাবে ডাউনলোড করার সময় ব্যবহারকারী অ্যাপটিতে প্রবেশ করলে, প্রগ্রেস ইন্টারফেসটি নির্দেশ করে যে ব্রাউজারটি এখনও অনুপস্থিত ডেটার উপর ভিত্তি করে ডাউনলোড প্রক্রিয়ার মধ্যে রয়েছে।
এই প্রবাহটি কর্মে দেখায় এমন ডেমোটি দেখুন। অন্তর্নির্মিত AI API (এই উদাহরণে, প্রম্পট API) উপলব্ধ না হলে, অ্যাপটি ব্যবহার করা যাবে না। যদি অন্তর্নির্মিত AI মডেলটি এখনও ডাউনলোড করার প্রয়োজন হয়, তাহলে ব্যবহারকারীকে একটি অগ্রগতি নির্দেশক দেখানো হয়। আপনি GitHub এ সোর্স কোড দেখতে পারেন।
হাইব্রিড বাস্তবায়ন
আপনি যদি ক্লায়েন্ট-সাইড এআই ব্যবহার করতে পছন্দ করেন তবে অস্থায়ীভাবে ক্লাউডে ডেটা পাঠাতে পারেন, আপনি একটি হাইব্রিড বাস্তবায়ন সেট আপ করতে পারেন। এর মানে ব্যবহারকারীরা স্থানীয় মডেলের সমান্তরাল ডাউনলোড করার সময় অবিলম্বে বৈশিষ্ট্যগুলি অনুভব করতে পারেন। মডেলটি ডাউনলোড হয়ে গেলে, গতিশীলভাবে স্থানীয় অধিবেশনে স্যুইচ করুন।
আপনি হাইব্রিডের জন্য যেকোন সার্ভার-সাইড বাস্তবায়ন ব্যবহার করতে পারেন, তবে আপনি তুলনামূলক ফলাফলের গুণমান নিশ্চিত করতে ক্লাউড এবং স্থানীয়ভাবে একই মডেল পরিবারের সাথে লেগে থাকা সম্ভবত সেরা। জেমিনি এপিআই এবং ওয়েব অ্যাপের সাথে শুরু করা জেমিনি এপিআই-এর বিভিন্ন পন্থা হাইলাইট করে।
ডেমো কর্ম এই প্রবাহ দেখায়. অন্তর্নির্মিত AI API উপলব্ধ না হলে, ডেমোটি ক্লাউডে জেমিনি API-তে ফিরে আসে। যদি অন্তর্নির্মিত মডেলটি এখনও ডাউনলোড করার প্রয়োজন হয় তবে ব্যবহারকারীকে একটি অগ্রগতি নির্দেশক দেখানো হয় এবং মডেলটি ডাউনলোড না হওয়া পর্যন্ত অ্যাপটি ক্লাউডে জেমিনি API ব্যবহার করে। GitHub-এ সম্পূর্ণ সোর্স কোডটি দেখুন।
উপসংহার
আপনার অ্যাপ কোন বিভাগে পড়ে? আপনার কি 100% ক্লায়েন্ট-সাইড প্রক্রিয়াকরণের প্রয়োজন বা আপনি একটি হাইব্রিড পদ্ধতি ব্যবহার করতে পারেন? আপনি এই প্রশ্নের উত্তর দেওয়ার পরে, পরবর্তী ধাপ হল মডেল ডাউনলোড কৌশলটি বাস্তবায়ন করা যা আপনার জন্য সবচেয়ে ভাল কাজ করে।
এই নির্দেশিকায় বর্ণিত মডেল ডাউনলোডের অগ্রগতি দেখিয়ে আপনার ব্যবহারকারীরা কখন এবং কখন আপনার অ্যাপ ক্লায়েন্ট-সাইড ব্যবহার করতে পারে তা সর্বদা জানে কিনা তা নিশ্চিত করুন।
মনে রাখবেন যে এটি শুধুমাত্র একবারের চ্যালেঞ্জ নয়: যদি ব্রাউজার স্টোরেজ চাপের কারণে মডেলটি পরিষ্কার করে বা যখন একটি নতুন মডেল সংস্করণ উপলব্ধ হয়, ব্রাউজারটিকে আবার মডেলটি ডাউনলোড করতে হবে৷ আপনি ক্লায়েন্ট-সাইড বা হাইব্রিড পদ্ধতি অনুসরণ করুন না কেন, আপনি নিশ্চিত হতে পারেন যে আপনি আপনার ব্যবহারকারীদের জন্য সম্ভাব্য সর্বোত্তম অভিজ্ঞতা তৈরি করবেন এবং ব্রাউজারকে বাকিটা পরিচালনা করতে দিন।