Transformer 的可视化解释：了解 LLM Transformer 模型如何与交互式可视化配合使用

部署

Nodejs version > 20.0

git clone https://github.com/poloclub/transformer-explainer.git
cd transformer-explainer
npm install
npm run dev

# fix: cnpm install --platform=win32 --arch=x64 sharp

中文演示

互动功能

Transformer Explainer 是交互式的，可让您探索 Transformer 的内部工作原理。以下是您可以使用的一些交互式功能：

• 输入您自己的文本序列，看看模型如何处理它并预测下一个单词。探索注意力权重、中间计算， 并看看最终输出概率是如何计算的。
• 使用温度滑块控制模型预测的随机性。探索如何通过更改温度值使模型输出更具确定性或更具创造性。
• 与注意力图交互，查看模型如何关注输入序列中的不同标记。将鼠标悬停在标记上 以突出显示其注意力权重，并探索模型如何捕获上下文和单词之间的关系。

什么是 Transformer？

Transformer 首次出现在 2017 年的开创性论文 《Attention is All You Need》 中，此后已成为深度学习模型的首选架构，为 OpenAI 的 GPT、Meta 的 Llama 和 Google 的 Gemini 等文本生成模型提供支持。 除了文本之外，Transformer 还应用于 音频生成、 图像识别、 蛋白质结构预测，甚至 游戏中，展示了其在众多领域的多功能性。

从根本上讲，文本生成 Transformer 模型的运行原理是下一个单词预测：给定用户的文本提示， 紧随此输入之后的最有可能的下一个单词是什么？Transformer 的核心创新和强大之处在于它们使用了 自注意力机制，这使得它们能够比以前的架构更有效地处理整个序列并捕获长距离依赖关系。

GPT-2 系列模型是文本生成 Transformers 的杰出代表。Transformer Explainer 基于 GPT-2 (small)，该模型有 1.24 亿个参数。虽然它不是最新或最强大的 Transformer 模型， 但它具有许多与当前最先进模型相同的架构组件和原理，使其成为理解基础知识的理想起点。

Transformer 架构

每个文本生成 Transformer 都由以下三个关键组件组成：

• 嵌入（Embedding）：文本输入被划分为更小的单位， 称为标记（token），可以是单词或子单词。这些标记被转换成数值向量，称为嵌入（Embedding），用于捕获单词的语义。
• Transformer Block 是模型的基本构建块，用于处理和转换输入数据。 每个块包括：
  • 注意力机制（Attention Mechanism），Transformer 模块的核心组件。它允许 token 与其他 token 进行通信，从而捕获上下文信息和单词之间的关系。
  • MLP 层（多层感知器 Multilayer Perceptron）, 一个独立对每个标记进行操作的前馈网络。注意层的目标是在标记之间路由 信息，而 MLP 的目标是优化每个标记的表示。
• 输出概率（Output Probabilities）： 最后的线性层和 softmax 层将处理后的嵌入转换为概率，使模型能够对序列中的下一个标记做出预测。

嵌入

假设您想使用 Transformer 模型生成文本。您添加如下提示词（prompt）：“Data visualization empowers users to”。 此输入需要转换为模型可以理解和处理的格式。这就是嵌入的作用所在：它将文本转换为模型可以使用的数字表示。要将提示转换为嵌入， 我们需要 1) 对输入进行标记，2) 获取标记嵌入，3) 添加位置信息，最后 4) 将标记和位置编码相加以获得最终嵌入。 让我们看看每个步骤是如何完成的。

步骤1：标记化

标记化（Tokenization）是将输入文本分解为更小、更易于管理的部分（称为标记）的过程。这些标记可以是单词或子单词。 单词 “Data” 和 “visualization” 对应于唯一标记，而单词 “empowers” 则 被拆分为两个标记。完整的标记词汇表是在训练模型之前确定的：GPT-2 的词汇表有 50,257 个唯一标记。 现在我们将输入文本拆分为具有不同 ID 的标记，我们可以从嵌入中获取它们的向量表示。

步骤2：Token 嵌入

GPT-2 Small 将词汇表中的每个标记表示为一个 768 维向量；向量的维度取决于模型。这些嵌入向量存储在形状为 (50,257, 768) 的矩阵中，包含大约 3900 万个参数！这个广泛的矩阵允许模型为每个标记分配语义含义。

步骤3：位置编码

Embedding 层还对每个 token 在输入提示中的位置信息进行编码。不同的模型使用不同的方法进行位置编码。 GPT-2 从头开始​​训练自己的位置编码矩阵，将其直接集成到训练过程中。

步骤4：最终嵌入

最后，我们将标记和位置编码相加以获得最终的嵌入表示。这种组合表示既捕获了标记的语义含义，也捕获了它们在输入序列中的位置。

Transformer 块

Transformer 处理的核心在于 Transformer 块，它由多头自注意力和多层感知器层组成。大多数模型由多个这样的块组成， 这些块按顺序一个接一个地堆叠在一起。Token 表示通过层级演变，从第一个块到第 12 个块，使模型能够对每个 Token 建立复杂的理解。 这种分层方法可以实现输入的高阶表示。

多头自注意力

自注意力机制使模型能够专注于输入序列的相关部分，从而能够捕获数据中的复杂关系和依赖关系。 让我们一步步看看这种自注意力是如何计算的。

第一步：查询、键和值矩阵（Query, Key, and Value Matrices）

每个 token 的嵌入向量被转换成三个向量： Query (Q)、 Key (K)和 Value (V)。这些向量是通过将输入嵌入矩阵与学习到的权重矩阵相乘而得出的 Q、 K和 V。这里有一个网络搜索类比，可以帮助我们建立这些矩阵背后的一些直觉：

• Query (Q) 是您在搜索引擎栏中输入的搜索文本。 这是您想要“查找更多信息”的标记。
• Key (K) 是搜索结果窗口中每个网页的标题。 它表示查询可以关注的可能的标记。
• Value (V)是网页显示的实际内容。 当我们将适当的搜索词（Query）与相关结果（Key）匹配后，我们希望获得最相关页面的内容（Value）。
  通过使用这些 QKV 值，模型可以计算注意力分数，这决定了每个标记在生成预测时应该获得多少关注。

第二步：掩码自注意力机制

掩码自注意力机制（Masked Self-Attention）允许模型通过关注输入的相关部分来生成序列，同时阻止访问未来的标记。

• 注意力分数：Query和Key 矩阵的点积确定每个查询与每个键的对齐方式，从而产生一个反映所有输入标记之间关系的方阵。
• 掩码：对注意力矩阵的上三角应用掩码，以防止模型访问未来的标记，并将这些值设置为负无穷大。 模型需要学习如何在不“窥视”未来的情况下预测下一个标记。
• Softmax：经过掩码处理后，注意力得分通过 softmax 运算转换为概率，该运算取每个注意 力得分的指数。矩阵的每一行总和为 1，并表示其左侧每个其他标记的相关性。

第三步：输出

该模型使用掩码后的自注意力得分，并将其与 Value 矩阵相乘， 以获得自注意力机制的 最终输出。GPT-2 有 12 个 自注意力 heads，每个 head 捕获 token 之间的不同关系。这些 head 的输出被连接起来并通过线性投影（linear projection）。

多层感知器

在多个自注意力机制捕获输入 token 之间的不同关系后，连接的输出将通过多层感知器（MLP，Multi-Layer Perceptron）层， 以增强模型的表示能力。MLP 块由两个线性变换组成，中间有一个 GELU 激活函数。 第一个线性变换将输入的维数从 768 增加了四倍至 3072。 第二个线性变换将维数降低回原始大小 768，确保后续层接收一致维度的输入。 与自注意力机制不同，MLP 独立处理 token 并简单地将它们从一种表示映射到另一种表示。

输出概率

在输入经过所有 Transformer 块处理后，输出将通过最后的线性层，为标记预测做好准备。 此层将最终表示投影到 50,257 维空间中，词汇表中的每个标记都有一个对应的值， 称为 logit。任何标记都可以是下一个单词，因此此过程允许我们根据它们成为 下一个单词的可能性对这些标记进行简单排序。然后，我们应用 softmax 函数将 logit 转换为 总和为 1 的概率分布。这将使我们能够根据其可能性对下一个标记进行采样。

最后一步是从该分布中采样来生成下一个标记。temperature 超参数在 此过程中起着关键作用。从数学上讲，这是一个非常简单的操作：模型输出 logits 只 需除以 temperature：

• temperature = 1：将 logits 除以 1 对 softmax 输出没有影响。
• temperature < 1：较低的温度通过锐化概率分布使模型更加自信和确定，从而产生更可预测的输出。
• temperature > 1：较高的温度会产生更柔和的概率分布，从而允许生成的文本具有更多的随机性 - 有些人称之为模型“创造力”。
  调节温度，看看如何在确定性和多样化输出之间取得平衡！

高级架构功能

有几种高级架构功能可增强 Transformer 模型的性能。虽然它们对于模型的整体性能很重要， 但对于理解架构的核心概念却不那么重要。层规范化、Dropout 和残差连接是 Transformer 模型中的关键组件，尤其是在训练阶段。层规范化可以稳定训练并帮助模型更快地收敛。 Dropout 通过随机停用神经元来防止过度拟合。残差连接允许梯度直接流过网络并有助于防止梯度消失问题。

层归一化

层归一化（Layer Normalization）有助于稳定训练过程并提高收敛性。它通过对特征之间的输入进行归一化来工作， 确保激活的均值和方差一致。这种归一化有助于缓解与内部协变量偏移相关的问题， 使模型能够更有效地学习并降低对初始权重的敏感度。每个 Transformer 块中都会 应用两次层归一化，一次在自注意力机制之前，一次在 MLP 层之前。

暂退法

暂退法（Dropout）是一种正则化技术，通过在训练期间随机将模型权重的一部分设置为零来防止神经网络过度拟合。 这鼓励模型学习更稳健的特征并减少对特定神经元的依赖，帮助网络更好地推广到新的、未见过的数据。 在模型推理期间，Dropout 被停用。这本质上意味着我们正在使用经过训练的子网络的集合，从而提高模型性能。

残差连接

残差连接（Residual Connections）于 2015 年首次在 ResNet 模型中引入。这种架构创新通过实现非常深的神经网络的训练， 彻底改变了深度学习。本质上，残差连接是绕过一个或多个层的捷径，将层的输入添加到其输出中。 这有助于缓解梯度消失问题，从而更容易训练堆叠在一起的多个 Transformer 块的深度网络。 在 GPT-2 中，每个 Transformer 块内使用两次残差连接：一次在 MLP 之前，一次在 MLP 之后， 以确保梯度更容易流动，并且较早的层在反向传播期间获得足够的更新。

Transformer Explainer 是如何构建的？

Transformer Explainer 具有一个可直接在浏览器中运行的实时 GPT-2（小型）模型。 该模型源自 Andrej Karpathy 的 nanoGPT 项目 PyTorch GPT 实现，并已转换为 ONNX Runtime 实现浏览器内无缝执行。该界面使用 JavaScript 构建，借助 Svelte 作为前端框架以及使用 D3.js 创建动态可视化。数值根据用户输入实时更新。

谁开发了 Transformer Explainer？

Transformer Explainer 的作者包括 Aeree Cho， Grace C. Kim， Alexander Karpekov， Alec Helbling， Jay Wang， Seongmin Lee， Benjamin Hoover，以及佐治亚理工学院的 Polo Chau。