1️⃣ AI 前端是什么
AI 前端指的是直接在前端（网页、移动端、桌面端）集成 AI 功能的开发方式。它可以是用户直接操作的界面，也可以是通过前端调用 AI 模型提供智能服务。
特点：
-
无需后端复杂处理：前端直接调用 AI API（例如 OpenAI、Anthropic、Azure OpenAI）就能生成文本、图像或做分析。
-
实时交互：用户操作和 AI 响应几乎是即时的。
-
典型场景：
- 聊天机器人（ChatGPT 风格的对话）
- 文本生成 / 代码生成 / 自动文案
- 图片生成、智能推荐
- 表单自动填写、智能校验
示例（React 前端直接调用 AI）：
const response = await fetch("https://api.openai.com/v1/chat/completions", {
method: "POST",
headers: {
"Content-Type": "application/json",
"Authorization": `Bearer ${API_KEY}`
},
body: JSON.stringify({
model: "gpt-4",
messages: [{ role: "user", content: "写一段前端代码" }]
})
});
const data = await response.json();
console.log(data.choices[0].message.content);
前端调用 API，AI 返回结果，前端直接展示，无需自己训练模型。
2️⃣ 什么是大模型（LLM, Large Language Model）
大模型是指参数量巨大、训练在海量数据上的 AI 模型。
-
**LLM（Large Language Model）**是一类大模型，专门用来处理和生成自然语言。
-
特点：
- 能理解文本上下文（Context）
- 能生成连贯、有逻辑的文本
- 能处理多种任务：翻译、写作、问答、摘要、代码生成等
-
示例模型：
- OpenAI GPT 系列（GPT-3, GPT-4）
- LLaMA, MPT, Claude 等
3️⃣ 为什么前端可以直接接入 AI
以前 AI 模型很大，前端无法承载，需要专门的服务器做推理（inference）。现在有几个原因让前端可以直接接入：
4️⃣ 核心概念：Prompt、Token、Embedding、Context
4.1 Prompt
Prompt = “输入给 AI 的指令或问题”。
-
可以是自然语言、代码、结构化文本。
-
例子：
写一段 JavaScript 函数，计算数组中最大值
4.2 Token
Token = AI 模型理解的最小单元。
-
一个 token 大概等于 4 个英文字符或 1 个汉字。
-
模型按 token 计算上下文长度和消耗（计费单位）。
-
例：
"Hello, world!" → 可能被分成 4 个 token
4.3 Embedding
Embedding = 将文本、图像或其他数据转成 向量（数字数组） 的表示方式。
-
目的是让计算机可以量化理解文本或语义相似度。就像计算机不理解你写的代码，但是他理解二进制。
-
用途：
- 文本检索（找相似问题）
- 语义搜索
- 聚类或推荐
-
例：
"我喜欢苹果" → [0.12, 0.98, …] （向量表示）
4.4 Context
Context = AI 在生成回答时能“看到”的信息范围。
- 对话中，context 就是之前所有消息的集合。
- 作用：让 AI 根据历史信息生成连贯回答。
- 注意：模型有最大上下文长度，超出就会被截断。
🔹 总结关系：
前端 → 发送 Prompt → 模型按 Token 处理 → 生成结果
Embedding 用于语义理解或检索
Context 用于保留上下文信息
