В течение многих лет браузер был красивым лицом приложения, а облако было местом, где происходили сложные задачи. Пользователь пишет, кликает, загружает файл; интерфейс отправляет все на сервер; сервер вызывает модель; ответ возвращается.

Эта схема остается очень полезной, но она не бесплатна. Каждый звонок вызывает вопросы о задержке, стоимости, зависимости от сети и конфиденциальности. Если пользователь пишет предложение и хочет получить предложение, весит полсекунды. Если вы классифицируете тысячи мелких затрат, копейки станут настоящими деньгами. Если текст конфиденциальный, отправка его с устройства не является нейтральным выбором.

Вот почему WebGPU и искусственный интеллект на устройстве находятся в ажиотаже. Не потому, что завтра мы будем запускать каждую модель в браузере. Потому что некоторые интеллектуальные функции могут стать ближе к пользователю.

Не все должно становиться локальным

Детская версия аргумента звучит так: «облако против устройства». Полезная версия — гибридная.

Некоторые задачи отлично смотрятся на устройстве: краткие описания, распознавание языка, легкое переписывание, простые классификации, фильтры изображений, модели небольшого зрения, творческий опыт с немедленной обратной связью.

Другие задачи лучше выполняются в облаке: сложные рассуждения, пограничные модели, данные на стороне сервера, централизованный аудит, единообразное качество, рабочий процесс, в котором приходится тщательно контролировать каждый шаг.

Здоровая архитектура решает во время выполнения:

Браузеру не обязательно побеждать облако. Оно должно избавить облако от выполнения работы, которую там делать не нужно.

Почему WebGPU имеет значение

WebGPU — это современный API для использования графического процессора из браузера. Это не только для более красивой 3D-графики. Это также важно, потому что оно предоставляет примитивы, подходящие для вычислений: параллельные рабочие нагрузки, шейдеры, конвейеры, более близкие к тому, с чем хорошо справляются графические процессоры.

Для ИИ, научной визуализации, 3D-редакторов, видеофильтров и творческих инструментов эта разница ощущается. WebGL многое сделал для Интернета, но WebGPU родился с моделью, лучше подходящей для настоящего времени.

Однако первое, что нужно написать, — это не шейдер. Это трезвое обнаружение функции:

export async function requestWebGpuDevice() {
  if (!('gpu' in navigator)) {
    return null;
  }

  const adapter = await navigator.gpu.requestAdapter({
    powerPreference: 'high-performance',
  });

  if (!adapter) {
    return null;
  }

  return adapter.requestDevice();
}

Эта функция говорит об одной важной вещи: использование WebGPU не является правом, предоставляемым на каждом устройстве. Это способность быть проверенной. Некоторые браузеры не полностью поддерживают его, некоторые графические процессоры имеют ограничения, некоторые корпоративные среды отключают функции, некоторые пользователи используют скромное оборудование.

Встроенный ИИ: когда браузер выводит модель

Chrome использует встроенные API для таких задач, как локальные подсказки, обобщение, написание, переписывание, перевод, определение языка и корректура. Идея очень интересная: браузер управляет моделью, доступностью и обновлениями; приложение использует API, более близкий к платформе.

Если все работает хорошо, многое меняется:

• меньше обращений к серверу для простых задач;
• данные, которые могут остаться на устройстве;
• более низкая задержка;
• оффлайн или полуоффлайн опыт;
• Более естественный UX для написания и перевода.

Но к этому следует относиться как к прогрессивному усовершенствованию. Некоторые API стабильны, другие находятся в пробной или предварительной версии, третьи все еще зависят от версии, языка и устройства.

type LocalCapability = 'available' | 'downloadable' | 'unsupported';

export async function getLocalSummarizerCapability(): Promise<LocalCapability> {
  const SummarizerApi = (globalThis as any).Summarizer;

  if (!SummarizerApi?.availability) {
    return 'unsupported';
  }

  const availability = await SummarizerApi.availability();

  if (availability === 'available') return 'available';
  if (availability === 'downloadable') return 'downloadable';

  return 'unsupported';
}

Конкретный код изменится, но схема останется: вы проверяете доступность, объясняете все загрузки, предлагаете запасные варианты и измеряете качество.

Резервный вариант – это не грустный план Б.

Облачный откат – это не поражение. Это часть продукта.

interface AiRequest {
  task: 'summarize' | 'rewrite' | 'classify';
  input: string;
}

interface AiResult {
  output: string;
  runtime: 'local' | 'cloud';
}

export async function runAiTask(request: AiRequest): Promise<AiResult> {
  const local = await tryLocalAi(request);

  if (local) {
    return { output: local, runtime: 'local' };
  }

  const cloud = await fetch('/api/ai', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify(request),
  }).then((res) => res.json());

  return { output: cloud.output, runtime: 'cloud' };
}

Такая архитектура позволяет постепенно совершенствоваться. Те, у кого есть местная поддержка, получают лучшую задержку и конфиденциальность. Те, у кого его нет, все равно используют эту функцию. Вы можете измерить процент локальных запросов, время, ошибки, память, воспринимаемое качество и стоимость.

Без показателей ИИ на устройстве становится эстетическим выбором. Благодаря метрикам он становится рычагом продукта.

UX модели имеет значение

Если браузеру необходимо загрузить модель, пользователь это воспринимает. Не прячьте это за расплывчатым спиннером. Лучше внести ясность: «Мы готовим модель для более быстрого использования этой функции и даже в автономном режиме».

Хороший опыт:

• показывает статус подготовки;
• не блокирует всю страницу;
• позволяет продолжить использование облачного резерва;
• избегайте сюрпризов с батареей и памятью;
• запоминайте модель, когда это возможно;
• объясните выгоду в одном конкретном предложении.

Хуже всего то, что «умная» функция выглядит сломанной, потому что загружает что-то молча.

Конфиденциальность: лучше, но не безопаснее автоматически

Обработка данных на устройстве может быть большим преимуществом. Черновик электронного письма, внутренний документ или личная заметка не обязательно должны покидать браузер, чтобы получить предложение.

Однако локальность не означает автоматически безопасность. Однако вам нужно подумать о:

• XSS;
• случайные логи;
• данные, сохраненные в хранилище;
• быстрое внедрение ненадежного контента;
• разрешения, предоставленные модели;
• выходы, используемые в автоматических действиях.

Если локальная модель может прочитать веб-страницу, а затем заполнить форму, эта страница может попытаться ею манипулировать. Если он может вызвать инструмент, необходимо подтверждение. Если он производит структурированный вывод, он должен быть проверен. Тот факт, что он работает на устройстве, снижает некоторые риски конфиденциальности, но не устраняет модель безопасности.

Где будет по-настоящему интересно

Текст — это только начало. WebGPU делает веб-интерфейс заслуживающим доверия, который до недавнего времени казался нативным приложением:

• сложные 3D-редакторы;
• Гауссово пятно в браузере;
• видеофильтры в реальном времени;
• Легкий САПР;
• научные визуализации;
• творческие инструменты с мгновенным предварительным просмотром;
• вывод изображения рядом с пользовательским интерфейсом;
• более амбициозные браузерные игры.

Здесь интерфейс, графика и машинное обучение начинают смешиваться. Это несколько неудобная область, но в то же время плодотворная: браузер снова становится серьезной платформой приложений, а не просто местом, где мы размещаем формы и информационные панели.

Контрольный список перед производством

Прежде чем предлагать пользователям функцию на устройстве, я бы проверил:

1. Таргетинг на браузеры и устройства.
2. Облачный запасной вариант или элегантная деградация.
3. Время загрузки и кеш модели.
4. Память и батарея на среднем железе.
5. Качество по сравнению с облачной версией.
6. Политика конфиденциальности и сообщения пользователей.
7. Тестирование с враждебными входными данными.
8. Отдельные метрики для локальной и облачной среды выполнения.
9. Запланируйте обновить или отключить шаблон.

Это конкретный список, потому что проблема конкретна. Медленная, хрупкая или непрозрачная функция искусственного интеллекта не становится лучше только потому, что она работает в браузере.

Правильный компромисс

Я не верю, что будущее за «всем на устройстве». И я не думаю, что облако останется единственным разумным местом для выводов. Наиболее вероятное будущее — это сочетание: локальное, когда оно улучшает задержку, конфиденциальность или стоимость; облако, когда необходимы качество, обновленные данные и централизованный контроль.

WebGPU, WebNN и встроенные AI API не делают браузер всемогущим. Они делают его взрослее. И для тех, кто создает веб-продукты, это огромная новость.

Полезные источники

• API веб-графического процессора — MDN
• Спецификация WebGPU — W3C
• Встроенный искусственный интеллект — Chrome для разработчиков
• Встроенные API-интерфейсы искусственного интеллекта – Chrome для разработчиков
• ВебНН API