Представляем Google AI Edge Portal : масштабный тест Edge AI. Зарегистрируйтесь , чтобы запросить доступ во время закрытого предварительного просмотра.

Эта страница переведена с помощью Cloud Translation API.

Руководство по выводу LLM для Интернета

API вывода LLM позволяет полностью запускать большие языковые модели (LLM) на устройстве для веб-приложений, что позволяет выполнять широкий спектр задач, таких как генерация текста, извлечение информации на естественном языке и реферирование документов. Эта задача обеспечивает встроенную поддержку нескольких больших языковых моделей преобразования текста в текст, что позволяет применять новейшие модели генеративного ИИ на устройстве в своих веб-приложениях. При использовании последних моделей Gemma-3n также поддерживаются изображения и аудиовходы.

Чтобы быстро добавить API вывода LLM в своё веб-приложение, следуйте краткому руководству . Простой пример веб-приложения, работающего с API вывода LLM, представлен в примере приложения . Более подробное понимание работы API вывода LLM см. в разделах «Параметры конфигурации» , «Преобразование моделей » и «Настройка LoRA» .

Вы можете увидеть эту задачу в действии с помощью демо-версии MediaPipe Studio . Подробнее о возможностях, моделях и вариантах настройки этой задачи см. в разделе «Обзор» .

Быстрый старт

Чтобы добавить API вывода LLM в ваше веб-приложение, выполните следующие действия. Для API вывода LLM требуется веб-браузер, совместимый с WebGPU. Полный список совместимых браузеров см. в разделе «Совместимость браузеров с GPU» .

Добавить зависимости

API вывода LLM использует пакет @mediapipe/tasks-genai .

Установите необходимые пакеты для локальной подготовки:

npm install @mediapipe/tasks-genai

Для развертывания на сервере используйте службу сети доставки контента (CDN), например jsDelivr , чтобы добавить код непосредственно на HTML-страницу:

<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai/genai_bundle.cjs"
    crossorigin="anonymous"></script>
</head>

Загрузить модель

Скачайте Gemma-3n E4B или E2B с сайта HuggingFace. Модели с приставкой «-Web» в названии специально конвертированы для использования в Интернете, поэтому настоятельно рекомендуется всегда использовать одну из них.

Для получения дополнительной информации о доступных моделях см. документацию по моделям или просмотрите нашу страницу сообщества HuggingFace , на которой предлагается несколько дополнительных вариантов Gemma 3, не упомянутых в документации, но специально преобразованных для веба, например, 270M , 4B , 12B , 27B и MedGemma-27B-Text .

Сохраните модель в каталоге вашего проекта:

<dev-project-root>/assets/gemma-3n-E4B-it-int4-Web.litertlm

Укажите путь к модели с помощью параметра modelAssetPath объекта baseOptions :

baseOptions: { modelAssetPath: `/assets/gemma-3n-E4B-it-int4-Web.litertlm`}

Инициализировать задачу

Инициализируйте задачу с базовыми параметрами конфигурации:

const genai = await FilesetResolver.forGenAiTasks(
    // path/to/wasm/root
    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai@latest/wasm"
);
llmInference = await LlmInference.createFromOptions(genai, {
    baseOptions: {
        modelAssetPath: '/assets/gemma-3n-E4B-it-int4-Web.litertlm'
    },
    maxTokens: 1000,
    topK: 40,
    temperature: 0.8,
    randomSeed: 101
});

Выполнить задачу

Используйте функцию generateResponse() для запуска выводов.

const response = await llmInference.generateResponse(inputPrompt);
document.getElementById('output').textContent = response;

Для потоковой передачи ответа используйте следующее:

llmInference.generateResponse(
  inputPrompt,
  (partialResult, done) => {
        document.getElementById('output').textContent += partialResult;
});

Мультимодальные подсказки

Для моделей Gemma-3n веб-API LLM Inference API поддерживают многомодальные подсказки. При включении многомодальности пользователи могут включать в подсказки упорядоченную комбинацию изображений, аудио и текста. Затем LLM предоставляет текстовый ответ.

Для начала используйте Gemma-3n E4B или Gemma-3n E2B в формате, совместимом с MediaPipe и Web. Подробнее см. в документации Gemma-3n .

Чтобы включить поддержку зрения, установите для maxNumImages положительное значение. Это определяет максимальное количество фрагментов изображения, которые LLM может обработать за один запрос.

Чтобы включить поддержку звука, убедитесь, что supportAudio имеет значение true .

llmInference = await LlmInference.createFromOptions(genai, {
    baseOptions: {
        modelAssetPath: '/assets/gemma-3n-E4B-it-int4-Web.litertlm'
    },
    maxTokens: 1000,
    topK: 40,
    temperature: 0.8,
    randomSeed: 101,
    maxNumImages: 5,
    supportAudio: true,
});

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

const response = await llmInference.generateResponse([
  '<ctrl99>user\nDescribe ',
  {imageSource: '/assets/test_image.png'},
  ' and then transcribe ',
  {audioSource: '/assets/test_audio.wav'},
  '<ctrl100>\n<ctrl99>model\n',
]);

Для визуализации поддерживаются URL-адреса изображений и наиболее распространённые объекты изображений, видео и холстов. Для аудио поддерживаются только одноканальные AudioBuffer и URL-адреса одноканальных аудиофайлов. Подробнее см. в исходном коде .

Образец заявления

Этот пример приложения представляет собой пример простого приложения для генерации текста для веб-сайтов, использующего API вывода LLM. Вы можете использовать это приложение в качестве отправной точки для своего собственного веб-приложения или ссылаться на него при изменении существующего. Код примера доступен на GitHub .

Клонируйте репозиторий git с помощью следующей команды:

git clone https://github.com/google-ai-edge/mediapipe-samples

Более подробную информацию см. в Руководстве по настройке для Web .

Параметры конфигурации

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

Название опции	Описание	Диапазон значений	Значение по умолчанию
`modelPath`	Путь к месту хранения модели в каталоге проекта.	ПУТЬ	Н/Д
`maxTokens`	Максимальное количество токенов (входные токены + выходные токены), которые обрабатывает модель.	Целое число	512
`topK`	Количество токенов, которые модель учитывает на каждом этапе генерации. Ограничивает прогнозы k наиболее вероятными токенами.	Целое число	40
`temperature`	Степень случайности, вносимая при генерации. Более высокая температура приводит к большей креативности в генерируемом тексте, тогда как более низкая температура обеспечивает более предсказуемую генерацию.	Плавать	0,8
`randomSeed`	Случайное начальное число, используемое при генерации текста.	Целое число	0
`loraRanks`	Ранги LoRA будут использоваться моделями LoRA во время выполнения. Примечание: совместимо только с моделями на графических процессорах.	Целочисленный массив	Н/Д

Преобразование модели

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

Модели	Метод преобразования	Совместимые платформы	Тип файла
Джемма-3 1Б	Конвертация не требуется	Android, веб	.задача
Джемма 2Б, Джемма 7Б, Джемма-2 2Б	Конвертация не требуется	Android, iOS, веб	.bin
Phi-2, StableLM, Сокол	Скрипт конвертации MediaPipe	Android, iOS, веб	.bin
Все модели PyTorch LLM	Генеративная библиотека AI Edge Torch	Android, iOS	.задача

Чтобы узнать, как конвертировать другие модели, смотрите раздел «Конвертация моделей» .

Настройка LoRA

API вывода LLM поддерживает настройку LoRA (адаптация низкого ранга) с помощью библиотеки PEFT (эффективная тонкая настройка параметров). Настройка LoRA настраивает поведение LLM посредством экономичного процесса обучения, создавая небольшой набор обучаемых весов на основе новых обучающих данных, а не переобучая всю модель.

API вывода LLM поддерживает добавление весов LoRA к слоям внимания моделей Gemma-2 2B , Gemma 2B и Phi-2 . Загрузите модель в формате safetensors .

Для создания весовых коэффициентов LoRA базовая модель должна быть в формате safetensors . После обучения LoRA модели можно преобразовать в формат FlatBuffers для запуска в MediaPipe.

Подготовить веса LoRA

Используйте руководство по методам LoRA от PEFT для обучения точно настроенной модели LoRA на вашем собственном наборе данных.

API вывода LLM поддерживает LoRA только на уровнях внимания, поэтому укажите только уровни внимания в LoraConfig :

# For Gemma
from peft import LoraConfig
config = LoraConfig(
    r=LORA_RANK,
    target_modules=["q_proj", "v_proj", "k_proj", "o_proj"],
)

# For Phi-2
config = LoraConfig(
    r=LORA_RANK,
    target_modules=["q_proj", "v_proj", "k_proj", "dense"],
)

После обучения на подготовленном наборе данных и сохранения модели, точно настроенные веса модели LoRA доступны в файле adapter_model.safetensors . Файл safetensors представляет собой контрольную точку LoRA, используемую при конвертации модели.

Преобразование модели

Используйте пакет Python MediaPipe для преобразования весовых коэффициентов модели в формат Flatbuffer. ConversionConfig указаны базовые параметры модели и дополнительные параметры LoRA.

import mediapipe as mp
from mediapipe.tasks.python.genai import converter

config = converter.ConversionConfig(
  # Other params related to base model
  ...
  # Must use gpu backend for LoRA conversion
  backend='gpu',
  # LoRA related params
  lora_ckpt=LORA_CKPT,
  lora_rank=LORA_RANK,
  lora_output_tflite_file=LORA_OUTPUT_FILE,
)

converter.convert_checkpoint(config)

Конвертер создаст два файла, совместимых с MediaPipe: один для базовой модели и другой для модели LoRA.

Вывод модели LoRA

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

const genai = await FilesetResolver.forGenAiTasks(
    // path/to/wasm/root
    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai@latest/wasm"
);
const llmInference = await LlmInference.createFromOptions(genai, {
    // options for the base model
    ...
    // LoRA ranks to be used by the LoRA models during runtime
    loraRanks: [4, 8, 16]
});

Загрузите модели LoRA во время выполнения после инициализации базовой модели. Запустите модель LoRA, передав ссылку на модель при генерации ответа LLM.

// Load several LoRA models. The returned LoRA model reference is used to specify
// which LoRA model to be used for inference.
loraModelRank4 = await llmInference.loadLoraModel(loraModelRank4Url);
loraModelRank8 = await llmInference.loadLoraModel(loraModelRank8Url);

// Specify LoRA model to be used during inference
llmInference.generateResponse(
  inputPrompt,
  loraModelRank4,
  (partialResult, done) => {
        document.getElementById('output').textContent += partialResult;
});