Google 今年推出了 Chrome Built-in AI 功能,作为端侧"大"模型,可以在浏览器使用 Gemini Nano,我最近也体验了一下,Luna Assistant 最开始的架构是 Chrome Extension <---> Server,而 Server 实际只是做了一个 LLM 代理转发,为了简化开发,后来去掉了 Server,直接访问 LLM RESTful API,再后来就发现了 Chrome Built-in AI,抽时间把原来的代码重构成新的实现方式。
我自己体验下来,Chrome Built-in AI 在常规任务上的性能比调用云端 LLM 接口有明显优势,在划词翻译时,可以做到瞬间秒出结果,而调用云端 LLM 接口即使在流式输出的情况下,也是有明显停顿的,而翻译结果也很不错。
关于开发环境的设置,推荐阅读官方文档和 Get Started with Chrome Built-in AI : Access Gemini Nano Model locally,需要使用 Chrome Dev 版本,这里就不详细描述。
Chrome’s Built-in AI
Chrome Built-in AI 计划将包括 Gemini Nano 在内的大型语言模型 (LLM) 等 AI 模型直接集成到浏览器中。这使得网站和网络应用无需管理自己的模型即可执行 AI 任务,从而带来更轻松的部署、硬件加速和敏感数据的本地处理等优势。Built-in AI 促进了端侧 AI 执行,带来了更快捷的用户体验、更广泛的 AI 功能访问,甚至可以离线使用。虽然端侧 AI 在很多领域表现出色,但有时需要结合云端 AI 的混合方法来处理复杂任务或实现更广泛的设备兼容性。
Chrome Built-in AI 可通过 API(如 Translator 和 Summarizer)以及探索性 API(如 Prompt)访问,用于本地原型设计和反馈。这项技术非常适合增强内容消费(摘要、翻译)和支持内容创作(写作辅助、语法纠正)。一些内置的 AI API 可在初始试用版中进行测试,而探索性 API 则可供早期预览计划的参与者使用。
Luna Assistant
Luna Assistant 是一款 Chrome 扩展程序,旨在增强浏览体验和内容交互。它利用 Chrome 内置的 AI 功能提供一套实用功能:
- 文本翻译 (Translate API)
- 内容创作 (Write API)
- 内容改写 (Rewrite API)
- 代码解释 (Prompt API)
- 网页对话 (Summarization API, WIP)
代码分析
- TypeScript 类型定义 (src/types/global.d.ts):
declare global {
interface Window {
ai: {
languageModel: {
capabilities: () => Promise<{
available: string;
defaultTemperature: number;
defaultTopK: number;
}>;
create: (options?: any) => Promise<any>;
};
writer: {
create: (options?: {
sharedContext?: string;
tone?: string;
signal?: AbortSignal;
}) => Promise<{
write: (content: string, options?: {
context?: string;
signal?: AbortSignal;
}) => Promise<string>;
writeStreaming: (content: string, options?: {
context?: string;
signal?: AbortSignal;
}) => AsyncIterableIterator<string>;
destroy: () => void;
}>;
};
rewriter: {
create: (options?: {
sharedContext?: string;
signal?: AbortSignal;
}) => Promise<{
rewrite: (content: string, options?: {
context?: string;
signal?: AbortSignal;
}) => Promise<string>;
rewriteStreaming: (content: string, options?: {
context?: string;
signal?: AbortSignal;
}) => AsyncIterableIterator<string>;
destroy: () => void;
}>;
};
};
translation: {
canTranslate: (options: {
sourceLanguage: string;
targetLanguage: string;
}) => Promise<string>;
createTranslator: (options: {
sourceLanguage: string;
targetLanguage: string;
}) => Promise<{
translate: (text: string) => Promise<string>;
}>;
};
}
const translation: Window['translation'];
}
export {};
2. 代码解释 (src/components/explain_content.tsx)
// Check if AI model is available
const { available } = await window.ai.languageModel.capabilities();
if (available === "no") {
throw new Error("AI model is not available");
}
// Create AI session
const session = await window.ai.languageModel.create({
systemPrompt: "You are a helpful programming assistant. Explain the following code in a clear and concise way, focusing on its main functionality and key components."
});
// Construct the prompt
const prompt = `Please explain this code:\n\n${code}`;
// Use streaming response to get explanation
let explanation = '';
let previousChunk = '';
const stream = session.promptStreaming(prompt);
for await (const chunk of stream) {
const newChunk = chunk.startsWith(previousChunk)
? chunk.slice(previousChunk.length)
: chunk;
explanation += newChunk;
setTargetContent(explanation);
previousChunk = chunk;
}
// Release session resources
session.destroy();
未来展望
Chrome Built-in AI 拥有无限潜力。随着更多 API 和改进的 AI 模型出现,我们可以期待更多创新应用,例如图像理解、视频摘要以及更自然的人机交互。Luna Assistant 展示了这些可能性,为变革的网络体验铺平了道路。