web llm
v0.2.0
Высокопроизводительный двигатель вывода LLM в браузере.
Документация | Блог -пост | Бумага | Примеры
WEBLLM-это высокопроизводительный механизм вывода LLM в браузере, который выводит вывод для модели языка непосредственно в веб-браузеры с аппаратным ускорением. Все работает внутри браузера без поддержки сервера и ускоряется с помощью WebGPU.
Webllm полностью совместим с API OpenAI. То есть вы можете использовать один и тот же API OpenAI на любых моделях с открытым исходным кодом локально, с функциональными возможностями, включая потоковую передачу, json-режим, функциональный обзор (WIP) и т. Д.
Мы можем предоставить много интересных возможностей для создания помощников по искусственному интеллекту для всех и обеспечить конфиденциальность, наслаждаясь ускорением графических процессоров.
Вы можете использовать WEBLLM в качестве базового пакета NPM и создать собственное веб -приложение поверх него, следуя примерам ниже. Этот проект представляет собой компаньонный проект MLC LLM, который обеспечивает универсальное развертывание LLM в аппаратных средах.
Проверьте чат Webllm, чтобы попробовать это!
Вывод в браузере : WEBLLM-это высокопроизводительный механизм вывода модели языка в браузере, который использует WebGPU для аппаратного ускорения, что позволяет мощным операциям LLM непосредственно в веб-браузерах без обработки на стороне сервера.
Полная совместимость с API OpenAI : плавно интегрируйте ваше приложение с помощью WEBLM, используя API OpenAI с такими функциональными возможностями, как потоковая передача, режим JSON, управление уровнем логита, посев и многое другое.
Структурированная генерация JSON : WEBLLM поддерживает современную структурированную генерацию режима JSON, реализованную в части Webassembly в библиотеке моделей для оптимальной производительности. Проверьте игровую площадку Webllm JSON на HuggingFace, чтобы попробовать генерировать вывод JSON с помощью пользовательской схемы JSON.
Обширная поддержка модели : WABLLM изначально поддерживает ряд моделей, включая Llama 3, Phi 3, Gemma, Mistral, Qwen (通义千问) и многих других, что делает его универсальным для различных задач AI. Для получения полного списка поддерживаемых моделей проверьте модели MLC.
Пользовательская интеграция модели : легко интегрировать и развернуть пользовательские модели в формате MLC, позволяя вам адаптировать WALLM к конкретным потребностям и сценариям, повышая гибкость в развертывании модели.
Интеграция Plug-and-Play : легко интегрировать WEBLLM в ваши проекты, используя менеджеры пакетов, такие как NPM и пряжа, или непосредственно через CDN, в комплекте с комплексными примерами и модульной конструкцией для подключения с компонентами пользовательского интерфейса.
Потоковые и взаимодействие в реальном времени : поддерживает завершение потокового чата, позволяя генерации выводов в реальном времени, что улучшает интерактивные приложения, такие как чат-боты и виртуальные помощники.
Поддержка веб -работников и обслуживания .
Поддержка расширения Chrome : расширить функциональность веб -браузеров через пользовательские расширения Chrome с использованием WEBLLM, с примерами, доступными для создания как основных, так и передовых расширений.
Проверьте полный список доступных моделей на моделях MLC. Webllm поддерживает подмножество этих доступных моделей, и список можно получить по адресу prebuiltAppConfig.model_list .
Вот основные семьи моделей, поддерживаемых в настоящее время:
Если вам нужно больше моделей, запросите новую модель, открывая проблему или проверьте пользовательские модели, чтобы компилировать и использовать свои собственные модели с Webllm.
Узнайте, как использовать WEBLLM для интеграции больших языковых моделей в ваше приложение и создание завершения чата через этот простой пример чат -бота:
Для расширенного примера более крупного, более сложного проекта проверьте чат Webllm.
В папке примеров доступны больше примеров для различных вариантов использования.
Webllm предлагает минималистский и модульный интерфейс для доступа к чат -боту в браузере. Пакет разработан модульным способом подключения к любому из компонентов пользовательского интерфейса.
# npm
npm install @mlc-ai/web-llm
# yarn
yarn add @mlc-ai/web-llm
# or pnpm
pnpm install @mlc-ai/web-llmЗатем импортируйте модуль в свой код.
// Import everything
import * as webllm from "@mlc-ai/web-llm" ;
// Or only import what you need
import { CreateMLCEngine } from "@mlc-ai/web-llm" ; Благодаря jsdelivr.com, Webllm может быть импортирован непосредственно через URL и работать вне коробки на платформах разработки облаков, таких как jsfiddle.net, codepen.io и scribbler:
import * as webllm from "https://esm.run/@mlc-ai/web-llm" ;Он также может быть динамически импортирован как:
const webllm = await import ( "https://esm.run/@mlc-ai/web-llm" ) ; Большинство операций в WABLLM вызываются через интерфейс MLCEngine . Вы можете создать экземпляр MLCEngine и загрузить модель, вызывая заводскую функцию CreateMLCEngine() .
(Обратите внимание, что загрузка моделей требует загрузки, и это может занять значительное количество времени для самого первого запуска без кэширования ранее. Вы должны должным образом обрабатывать этот асинхронный вызов.)
import { CreateMLCEngine } from "@mlc-ai/web-llm" ;
// Callback function to update model loading progress
const initProgressCallback = ( initProgress ) => {
console . log ( initProgress ) ;
}
const selectedModel = "Llama-3.1-8B-Instruct-q4f32_1-MLC" ;
const engine = await CreateMLCEngine (
selectedModel ,
{ initProgressCallback : initProgressCallback } , // engineConfig
) ;Под капотом эта заводская функция выполняет следующие шаги для сначала создания экземпляра двигателя (синхронно), а затем загрузку модели (асинхронной). Вы также можете сделать их отдельно в своем приложении.
import { MLCEngine } from "@mlc-ai/web-llm" ;
// This is a synchronous call that returns immediately
const engine = new MLCEngine ( {
initProgressCallback : initProgressCallback
} ) ;
// This is an asynchronous call and can take a long time to finish
await engine . reload ( selectedModel ) ; После успешной инициализации двигателя вы теперь можете вызвать завершение чата, используя API чата в стиле Openai через интерфейс engine.chat.completions . Для полного списка параметров и их описаний проверьте раздел ниже и OpenAI API.
(Примечание: параметр model не поддерживается и будет здесь игнорируется. Вместо этого вызовите CreateMLCEngine(model) или engine.reload(model) как показано в Create MLCENGINE выше.)
const messages = [
{ role : "system" , content : "You are a helpful AI assistant." } ,
{ role : "user" , content : "Hello!" } ,
]
const reply = await engine . chat . completions . create ( {
messages ,
} ) ;
console . log ( reply . choices [ 0 ] . message ) ;
console . log ( reply . usage ) ; Webllm также поддерживает генерацию завершения потокового чата. Чтобы использовать его, просто пройдите stream: true для engine.chat.completions.create Call.
const messages = [
{ role : "system" , content : "You are a helpful AI assistant." } ,
{ role : "user" , content : "Hello!" } ,
]
// Chunks is an AsyncGenerator object
const chunks = await engine . chat . completions . create ( {
messages ,
temperature : 1 ,
stream : true , // <-- Enable streaming
stream_options : { include_usage : true } ,
} ) ;
let reply = "" ;
for await ( const chunk of chunks ) {
reply += chunk . choices [ 0 ] ?. delta . content || "" ;
console . log ( reply ) ;
if ( chunk . usage ) {
console . log ( chunk . usage ) ; // only last chunk has usage
}
}
const fullReply = await engine . getMessage ( ) ;
console . log ( fullReply ) ; Вы можете поместить тяжелые вычисления в сценарий работника, чтобы оптимизировать производительность вашего приложения. Для этого вам нужно:
Для получения подробной реализации различных видов работников проверьте следующие разделы.
WEBLLM поставляется с поддержкой API для веб -работника, чтобы вы могли подключить процесс генерации в отдельный рабочий поток, чтобы вычисления в потоке работников не нарушали пользовательский интерфейс.
Мы создаем обработчик в потоке работников, который общается с фронталом при обработке запросов.
// worker.ts
import { WebWorkerMLCEngineHandler } from "@mlc-ai/web-llm" ;
// A handler that resides in the worker thread
const handler = new WebWorkerMLCEngineHandler ( ) ;
self . onmessage = ( msg : MessageEvent ) => {
handler . onmessage ( msg ) ;
} ; В основной логике мы создаем WebWorkerMLCEngine , который реализует один и тот же MLCEngineInterface . Остальная часть логики остается прежней.
// main.ts
import { CreateWebWorkerMLCEngine } from "@mlc-ai/web-llm" ;
async function main ( ) {
// Use a WebWorkerMLCEngine instead of MLCEngine here
const engine = await CreateWebWorkerMLCEngine (
new Worker (
new URL ( "./worker.ts" , import . meta . url ) ,
{
type : "module" ,
}
) ,
selectedModel ,
{ initProgressCallback } , // engineConfig
) ;
// everything else remains the same
}Webllm поставляется с поддержкой API для обслуживания, поэтому вы можете подключить процесс генерации в обслуживающего работника, чтобы избежать перезагрузки модели в каждом посещении страницы и оптимизировать автономный опыт вашего приложения.
(Обратите внимание, жизненный цикл работника службы управляется браузером и может быть убит в любое время без уведомления о веб -приложении. ServiceWorkerMLCEngine постарается сохранить потоку работника обслуживания, периодически отправляя события в сфере сердцебиения, но ваше приложение также должно включать в себя надлежащую обработку ошибок. Проверьте keepAliveMs и missedHeatbeat в ServiceWorkerMLCEngine для более подробной информации.
Мы создаем обработчик в потоке работников, который общается с фронталом при обработке запросов.
// sw.ts
import { ServiceWorkerMLCEngineHandler } from "@mlc-ai/web-llm" ;
let handler : ServiceWorkerMLCEngineHandler ;
self . addEventListener ( "activate" , function ( event ) {
handler = new ServiceWorkerMLCEngineHandler ( ) ;
console . log ( "Service Worker is ready" ) ;
} ) ; Затем в основной логике мы регистрируем работника службы и создаем двигатель, используя функцию CreateServiceWorkerMLCEngine . Остальная часть логики остается прежней.
// main.ts
import { MLCEngineInterface , CreateServiceWorkerMLCEngine } from "@mlc-ai/web-llm" ;
if ( "serviceWorker" in navigator ) {
navigator . serviceWorker . register (
new URL ( "sw.ts" , import . meta . url ) , // worker script
{ type : "module" } ,
) ;
}
const engine : MLCEngineInterface =
await CreateServiceWorkerMLCEngine (
selectedModel ,
{ initProgressCallback } , // engineConfig
) ;Вы можете найти полный пример того, как запустить WEBLLM в работнике обслуживания в примерах/работнике службы.
Вы также можете найти примеры построения расширения хрома с помощью WEBLLM в примерах/хромированные и примеры/Chrome-Extension-Webgpu-Service-Worker. Последний использует обслуживающего работника, поэтому расширение постоянно на заднем плане. Кроме того, вы можете изучить еще один полный проект расширения Chrome, помощник WEBLLM, который использует здесь.
Webllm разработан так, чтобы быть полностью совместимым с API OpenAI. Таким образом, помимо создания простого чат -бота, вы также можете иметь следующие функции с Webllm:
seed .tools и tool_choice (с предварительной поддержкой); или ручная функция вызовов без tools или tool_choice (сохраняет наибольшую гибкость). Webllm работает в качестве компаньона MLC LLM и поддерживает пользовательские модели в формате MLC. Он повторно использует модельный артефакт и создает поток MLC LLM. Чтобы скомпилировать и использовать свои собственные модели с помощью WEBLLM, пожалуйста, ознакомьтесь с документом MLC LLM о том, как компилировать и развернуть веса и библиотеки новых моделей в WEBLLM.
Здесь мы переживаем идею высокого уровня. Есть два элемента пакета Webllm, которые включают новые модели и варианты веса.
model : содержит URL-адрес для моделей артефактов, таких как вес и метадата.model_lib : URL -адрес в библиотеке веб -сборки (то есть файл WASM), который содержит исполняемые файлы для ускорения вычислений модели.Оба настраиваются в WEBLLM.
import { CreateMLCEngine } from "@mlc-ai/web-llm" ;
async main ( ) {
const appConfig = {
"model_list" : [
{
"model" : "/url/to/my/llama" ,
"model_id" : "MyLlama-3b-v1-q4f32_0" ,
"model_lib" : "/url/to/myllama3b.wasm" ,
}
] ,
} ;
// override default
const chatOpts = {
"repetition_penalty" : 1.01
} ;
// load a prebuilt model
// with a chat option override and app config
// under the hood, it will load the model from myLlamaUrl
// and cache it in the browser cache
// The chat will also load the model library from "/url/to/myllama3b.wasm",
// assuming that it is compatible to the model in myLlamaUrl.
const engine = await CreateMLCEngine (
"MyLlama-3b-v1-q4f32_0" ,
{ appConfig } , // engineConfig
chatOpts ,
) ;
} Во многих случаях мы хотим только предоставить вариант веса модели, но не обязательно новая модель (например, NeuralHermes-Mistral может повторно использовать модельную библиотеку Mistral ). Для примеров того, как модельная библиотека может использоваться различными вариантами модели, см. webllm.prebuiltAppConfig .
Примечание: вам не нужно строить из источника, если вы не хотите изменить пакет WEBLLM. Чтобы использовать NPM, просто следуйте, начните, или любой из примеров вместо этого.
Чтобы построить из источника, просто запустите:
npm install
npm run build Затем, чтобы проверить эффекты изменения вашего кода в примере, внутренние examples/get-started/package.json , измените от "@mlc-ai/web-llm": "^0.2.77" на "@mlc-ai/web-llm": ../..
Затем беги:
cd examples/get-started
npm install
npm start Обратите внимание, что иногда вам нужно переключаться между file:../.. и ../.. чтобы запустить NPM, чтобы распознать новые изменения. В худшем случае вы можете бежать:
cd examples/get-started
rm -rf node_modules dist package-lock.json .parcel-cache
npm install
npm startВремя выполнения Webllm в значительной степени зависит от TVMJS: https://github.com/apache/tvm/tree/main/web
Хотя он также доступен в виде пакета NPM: https://www.npmjs.com/package/@mlc-ai/web-runtime, вы можете построить его из источника, если это необходимо, выполнив шаги ниже.
Установите Emscripten. Это компилятор на основе LLVM, который компилирует исходный код C/C ++ для WebAssembly.
emsdk_env.sh по source path/to/emsdk_env.sh , так что emcc достигается по пути, а команда emcc работает. Мы можем проверить успешную установку, попробовав терминал emcc .
Примечание. Недавно мы обнаружили, что использование последней версии emcc может столкнуться с проблемами во время выполнения. Используйте ./emsdk install 3.1.56 вместо ./emsdk install latest пока в качестве обходного пути. Ошибка может выглядеть как
Init error, LinkError: WebAssembly.instantiate(): Import #6 module="wasi_snapshot_preview1"
function="proc_exit": function import requires a callable
В ./package.json , переход от "@mlc-ai/web-runtime": "0.18.0-dev2", на "@mlc-ai/web-runtime": "file:./tvm_home/web", .
Настройка необходимой среды
Подготовьте все необходимые зависимости для веб -сборки:
./scripts/prep_deps.sh На этом этапе, если $TVM_SOURCE_DIR не определен в среде, мы выполним следующую строку для создания зависимости tvmjs :
git clone https://github.com/mlc-ai/relax 3rdparty/tvm-unity --recursive Это клонирует нынешнюю головку mlc-ai/relax . Тем не менее, это не всегда может быть правильной ветвью или приверженностью клону. Чтобы создать конкретную версию NPM из Source, см. Версию Bump PR, которая указывает, какую ветвь (то есть зависит mlc-ai/relax или apache/tvm ), а какой зависит от текущей версии WEBLLM. Например, версия 0.2.52, согласно ее версии Bump PR #521, создана путем проверки следующего коммита https://github.com/apache/tvm/commit/e6476847753c80e054719ac47bc2091c888418b6 в apache/tvm , а не в Head of mlc-ai/relax .
Кроме того, --recursive необходимо и важно. В противном случае вы можете столкнуться с ошибками, такими как fatal error: 'dlpack/dlpack.h' file not found .
Построить пакет Webllm
npm run buildПроверить некоторые из суб-пакетов
Затем вы можете перейти к подпапкам в примерах, чтобы проверить некоторые из суб-пакетов. Мы используем Parcelv2 для объединения. Хотя посылка иногда не очень хороша в отслеживании изменений родительского каталога. Когда вы внесете изменения в пакет Webllm, попробуйте отредактировать package.json подпапки и сохранить его, что запустит посылку для восстановления.
Этот проект инициируется участниками CMU Catalyst, UW SAMPL, SJTU, OCTOML и сообщества MLC. Мы хотели бы продолжить разработку и поддержку сообщества ML с открытым исходным кодом.
Этот проект возможен только благодаря экосистемам с открытым исходным кодом плеч, на которых мы стоим. Мы хотим поблагодарить сообщество Apache TVM и разработчиков усилий TVM Unity. Члены сообщества ML с открытым исходным кодом сделали эти модели публично доступными. Pytorch и обнимающие сообщества лиц делают эти модели доступными. Мы хотели бы поблагодарить команды, стоящие за Vicuna, предложение, ламу и альпаку. Мы также хотели бы поблагодарить сообщества Webassembly, Emscripten и Webgpu. Наконец, благодаря разработчикам Dawn и Webgpu.
Если вы найдете этот проект полезным, пожалуйста, цитируйте:
@misc{ruan2024webllmhighperformanceinbrowserllm,
title={WebLLM: A High-Performance In-Browser LLM Inference Engine},
author={Charlie F. Ruan and Yucheng Qin and Xun Zhou and Ruihang Lai and Hongyi Jin and Yixin Dong and Bohan Hou and Meng-Shiun Yu and Yiyan Zhai and Sudeep Agarwal and Hangrui Cao and Siyuan Feng and Tianqi Chen},
year={2024},
eprint={2412.15803},
archivePrefix={arXiv},
primaryClass={cs.LG},
url={https://arxiv.org/abs/2412.15803},
}
⬆ Вернуться к вершине ⬆
