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

Thomas Steiner

تاریخ انتشار: 1 اکتبر 2025

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

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

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

در حالی که 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 را می توان بلافاصله استفاده کرد، بدون نیاز به نشان دادن رابط کاربری پیشرفت.
• 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;
  }
});

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

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

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

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

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

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

نتیجه گیری

اپلیکیشن شما در کدام دسته قرار می گیرد؟ آیا به پردازش 100٪ سمت مشتری نیاز دارید یا می توانید از یک رویکرد ترکیبی استفاده کنید؟ بعد از اینکه به این سوال پاسخ دادید، گام بعدی این است که استراتژی دانلود مدلی را اجرا کنید که بهترین کار را برای شما دارد.

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

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