کاربران را از دانلود مدل آگاه کنید

منتشر شده: ۱ اکتبر ۲۰۲۵

قبل از اینکه بتوان از هر یک از APIهای داخلی هوش مصنوعی استفاده کرد، مدل زیربنایی و هرگونه سفارشی‌سازی (مانند تنظیمات دقیق) باید دانلود شوند، داده‌های فشرده‌شده باید استخراج شوند و همه این موارد باید در حافظه بارگذاری شوند. بهترین روش این است که کاربر را از زمان مورد نیاز برای انجام این دانلودها مطلع کنید.

مثال‌های زیر از API Prompt استفاده می‌کنند، اما این مفاهیم را می‌توان برای سایر APIهای هوش مصنوعی داخلی نیز به کار برد.

نظارت و اشتراک‌گذاری پیشرفت دانلود

هر رابط برنامه‌نویسی کاربردی هوش مصنوعی داخلی از تابع create() برای شروع یک جلسه استفاده می‌کند. تابع create() دارای گزینه‌ای monitor بر پیشرفت دانلود است، بنابراین می‌توانید به پیشرفت دانلود دسترسی داشته باشید تا آن را با کاربر به اشتراک بگذارید.

در حالی که APIهای هوش مصنوعی داخلی برای هوش مصنوعی سمت کلاینت ساخته شده‌اند ، جایی که داده‌ها در مرورگر و دستگاه کاربر پردازش می‌شوند، برخی از برنامه‌ها می‌توانند امکان پردازش داده‌ها را روی سرور فراهم کنند. نحوه‌ی آدرس‌دهی شما به کاربر در روند دانلود مدل به این سوال بستگی دارد: آیا پردازش داده‌ها باید فقط به صورت محلی اجرا شود یا خیر؟ اگر این درست باشد، برنامه‌ی شما فقط سمت کلاینت است. در غیر این صورت، برنامه‌ی شما می‌تواند از یک پیاده‌سازی ترکیبی استفاده کند.

فقط سمت کلاینت

در برخی سناریوها، پردازش داده‌های سمت کلاینت مورد نیاز است. به عنوان مثال، یک برنامه مراقبت‌های بهداشتی که به بیماران اجازه می‌دهد در مورد اطلاعات شخصی خود سؤال بپرسند، احتمالاً می‌خواهد آن اطلاعات برای دستگاه کاربر خصوصی باقی بماند. کاربر باید منتظر بماند تا مدل و تمام سفارشی‌سازی‌ها دانلود و آماده شوند تا بتواند از هرگونه ویژگی پردازش داده استفاده کند.

در این حالت، اگر مدل از قبل در دسترس نباشد، باید اطلاعات پیشرفت دانلود را در اختیار کاربر قرار دهید.

<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 می‌تواند بلافاصله مورد استفاده قرار گیرد، نیازی به نمایش رابط کاربری پیشرفت نیست.
  • 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 localSession = 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({
      // ⚠️ Always pass the same options to the `availability()` function that
      // you use in `prompt()` or `promptStreaming()`. This is critical to
      // align model language and modality capabilities.
      expectedInputs: [{ type: 'text', languages: ['en'] }],
      expectedOutputs: [{ type: 'text', languages: ['en'] }],
    });
    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;
  }
});

اگر کاربر در حالی که مدل به طور فعال در مرورگر در حال دانلود است، وارد برنامه شود، رابط پیشرفت بر اساس داده‌های از دست رفته، نشان می‌دهد که مرورگر در کدام مرحله از فرآیند دانلود قرار دارد.

نسخه آزمایشی سمت کلاینت

به دموی نمایش داده شده که این جریان را در عمل نشان می‌دهد، نگاهی بیندازید. اگر API هوش مصنوعی داخلی (در این مثال، Prompt API) در دسترس نباشد، نمی‌توان از برنامه استفاده کرد. اگر مدل هوش مصنوعی داخلی هنوز نیاز به دانلود داشته باشد، یک نشانگر پیشرفت به کاربر نشان داده می‌شود. می‌توانید کد منبع را در GitHub مشاهده کنید.

پیاده‌سازی ترکیبی

اگر ترجیح می‌دهید از هوش مصنوعی سمت کلاینت استفاده کنید، اما می‌توانید داده‌ها را به طور موقت به فضای ابری ارسال کنید، می‌توانید یک پیاده‌سازی ترکیبی راه‌اندازی کنید. این بدان معناست که کاربران می‌توانند بلافاصله از ویژگی‌ها استفاده کنند، در حالی که به طور موازی مدل محلی را دانلود می‌کنند. پس از دانلود مدل، به صورت پویا به جلسه محلی بروید.

شما می‌توانید از هر پیاده‌سازی سمت سرور برای هیبرید استفاده کنید، اما احتمالاً بهتر است که از یک خانواده مدل هم در فضای ابری و هم به صورت محلی استفاده کنید تا از کیفیت نتایج قابل مقایسه اطمینان حاصل شود. شروع کار با API و برنامه‌های وب Gemini، رویکردهای مختلف برای API Gemini را برجسته می‌کند.

While the built-in model is downloading, the app falls back to a cloud
model and is already usable.

نسخه آزمایشی ترکیبی

این دمو این جریان را در عمل نشان می‌دهد. اگر API هوش مصنوعی داخلی در دسترس نباشد، دمو به API Gemini در فضای ابری برمی‌گردد. اگر مدل داخلی هنوز نیاز به دانلود داشته باشد، یک نشانگر پیشرفت به کاربر نشان داده می‌شود و برنامه تا زمان دانلود مدل از API Gemini در فضای ابری استفاده می‌کند. نگاهی به کد منبع کامل در GitHub بیندازید.

نتیجه‌گیری

برنامه شما در چه دسته‌ای قرار می‌گیرد؟ آیا به پردازش ۱۰۰٪ سمت کلاینت نیاز دارید یا می‌توانید از یک رویکرد ترکیبی استفاده کنید؟ پس از پاسخ به این سوال، مرحله بعدی پیاده‌سازی استراتژی دانلود مدلی است که برای شما بهترین عملکرد را دارد.

با نشان دادن پیشرفت دانلود مدل، همانطور که در این راهنما ذکر شده است، مطمئن شوید که کاربران شما همیشه می‌دانند چه زمانی و آیا می‌توانند از برنامه سمت کلاینت شما استفاده کنند یا خیر.

به یاد داشته باشید که این فقط یک چالش یک‌باره نیست: اگر مرورگر به دلیل فشار فضای ذخیره‌سازی یا وقتی نسخه جدیدی از مدل در دسترس قرار می‌گیرد، مدل را پاک کند، مرورگر باید دوباره مدل را دانلود کند. چه رویکرد سمت کلاینت و چه رویکرد ترکیبی را دنبال کنید، می‌توانید مطمئن باشید که بهترین تجربه ممکن را برای کاربران خود ایجاد می‌کنید و اجازه دهید مرورگر بقیه کارها را انجام دهد.