스크립트
00:00:00Google 刚刚发布了一个全新的运行时库，让你能在浏览器中以近乎原生的速度
00:00:05运行机器学习和 AI 模型。它叫作 LiteRT.js，非常令人惊艳。所以，
00:00:12在这个视频里，我们将深入了解 LiteRT.js，看看它是如何工作的，并通过
00:00:18构建一个完全在浏览器中运行的实时 3D 动作捕捉应用来进行测试。这会
00:00:24非常有趣，让我们开始吧。那么 LiteRT.js 到底是什么呢？简单来说，它是 LiteRT 的 JavaScript 绑定，
00:00:36而 LiteRT 是他们的端侧推理运行时，多年来一直运行在安卓、iOS 和嵌入式
00:00:42硬件上。但 LiteRT.js 通过 WebAssembly 将同样的运行时引入了浏览器，使用的是
00:00:50LiteRT.js 核心 npm 包。这就是 LiteRT.js 的独特之处。Google 之前已经有一个
00:00:58浏览器机器学习库叫作 TensorFlow.js，它已经存在好几年了。但是，
00:01:04TensorFlow.js 运行在基于 JavaScript 的内核上，这是一个巨大的瓶颈。你看，JavaScript 内核
00:01:11无法像原生运行时那样充分利用 CPU 或 GPU。因此，TensorFlow.js 在性能上一直落后于
00:01:19原生应用。但 LiteRT.js 使用了 WebAssembly，并且自带了经过优化的内核。
00:01:27因此，支持安卓和 iOS 推理的同一个原生运行时被编译成了 WASM，并暴露给
00:01:34LiteRT.js。所以你不再得到的是一种 Web 风格的抽象层，而是真正得到了
00:01:40一个真正经过优化的运行时引擎。这也体现在他们的后端架构中。LiteRT.js 有
00:01:47三个不同的层级，使其能在 CPU、GPU 甚至 NPU 上表现出色。在 CPU 端，
00:01:55它使用 XNNPack，这是 Google 的优化 CPU 内核库，支持多线程和松散的 SIMD。
00:02:04这是你的通用兜底方案，无需 GPU 即可在任何地方运行。但对于 GPU，
00:02:11它通过 WebGPU 使用 ML Drift，这才是真正发挥性能的地方。它利用了原生 GPU
00:02:18内核，所以像着色器这类渲染任务不再需要通过某种 JavaScript 编排来完成。至于
00:02:24NPU，它有 WebNN，目前在 Chrome 和 Edge 中仍处于实验阶段，它针对的是专用的神经网络
00:02:31处理硬件以实现高效的推理。根据 Google 自己的基准测试，他们
00:02:37在搭载 M4 芯片的 2024 款 MacBook Pro 上进行了测试，其推理速度似乎比
00:02:45其他 Web 运行时在 CPU 和 GPU 上都要快三倍，涵盖视觉和音频模型。而在运行诸如
00:02:53物体追踪、音频转写或图像处理等工作负载时，如果使用 GPU 或 NPU 而不是 CPU，
00:03:00我们获得的性能提升从五倍一直到 60 倍不等，
00:03:07具体取决于任务。值得一提的是，那是最佳情况。Google 也
00:03:13承认了这一点。所以实际情况会有所不同，要考虑到你具体的 GPU、
00:03:18热节流以及驱动程序的质量。对于这个运行时，还有一件事非常重要。
00:03:24如果你已经有在 PyTorch 或 TensorFlow 上运行的模型，如果你有一个现有的
00:03:30TF Lite 文件，LiteRT.js 实际上可以直接运行它。如果你用的是 PyTorch，还有一个 LiteRT
00:03:38Torch，可以将你的模型直接转换为 .TF Lite。此外，还有一个 AI Edge
00:03:44量化工具，无需完全重写即可缩小模型体积。因此，你在
00:03:50TensorFlow.js 上使用的遗留工作流可以轻松移植到新的 LiteRT.js，这非常酷。但你
00:03:58实际上能用它做什么呢？Google 提供了一些非常酷的演示，让你能感受到它的
00:04:03能力范围。比如你可以进行实时的 YOLO 物体检测、单目深度估计，
00:04:09利用 depth anything 库将你的网络摄像头画面转为实时 3D 点云。它还可以进行
00:04:16图像超分辨率处理，使用 real ESR GAN 库。所有这些演示都是在客户端完全运行的，
00:04:23没有后端，没有 API，直接就在你的浏览器里。他们已经宣布了接下来要发布的内容：
00:04:29LiteRT.LM.js。这将用于在浏览器中本地运行完整的语言模型。
00:04:36所以这不仅仅是为了计算机视觉。很快，它也将提供本地 LLM 推理功能。
00:04:42好了，听起来都很不错，但我还是想自己测试一下，看看它到底有多强大。
00:04:48所以对于这个演示，我决定创建一个真实的动作捕捉应用，利用你的网络摄像头进行
00:04:55实时姿态估计。而且它也完全在你的浏览器客户端离线运行，没有任何
00:05:03附加条件。我是在 Cloud Code 上使用新的 Fable 5 模型编写了这个应用。这是最终结果。
00:05:10顺便说一下，如果你想下载这个仓库自己尝试一下，我也在
00:05:15下方的说明栏里添加了项目链接。现在 LiteRT.JS 正在浏览器中使用 blaze pose 模型运行，
00:05:23具有 33 个身体关键点，并使用 3.js 实时驱动一个 3D 角色。没有后端服务器，
00:05:31你看到的一切现在都完全离线发生在这台机器上。所以我们可以看到，在
00:05:38CPU 上，我们平均在 38 FPS 左右，推理时间为 23.3 毫秒。我们也可以看到，姿态
00:05:47估计稍微有些延迟。但现在如果我们切换到 Web GPU 版本，可以看到我们现在
00:05:54达到了稳定的 120 帧每秒，推理时间仅为 8.4 毫秒。而且姿态估计也
00:06:02更快了一些。这大约是帧率的三倍提升和推理时间的 2.8 倍缩减，这
00:06:10与 Google 给出的数据基本吻合，尽管这处于他们发布数据中比较保守的一端。但我们必须
00:06:16考虑到 blaze pose 本身确实是一个小模型。所以 GPU 的原始计算负担
00:06:23较小。但即便如此，将张量运算从 CPU 转移到 Web GPU，确实使延迟
00:06:30大幅降低了， lag 明显减少。我还添加了一个功能，可以录制你的动作捕捉
00:06:36动画，并导出为 JSON 或生物视觉动作捕捉文件，然后在
00:06:44像 Blender 这样的软件中打开，并将动画重定向到你自己的自定义角色身上。如你所见，
00:06:49它还不完美。动作不够精细或精确。所以这仍然是一个非常
00:06:56进行中的工作。但能用新的 LiteRT.js 在短短 10 分钟内做出这个初始版本，真是太酷了。
00:07:01好了，朋友们，这就是 LiteRT.js 的简介。看到 WebAssembly
00:07:08在浏览器中运行复杂应用程序的能力方面推动了多远，真是令人惊叹。
00:07:14这个新的 LiteRT.js 库确实证明了，有时 JavaScript
00:07:21确实会成为实现近乎原生性能速度的瓶颈。我对这个库印象非常深刻，
00:07:27迫不及待想在 LiteRT.js 今年晚些时候最终发布时试用它。你对
00:07:35LiteRT.js 有什么看法？你试用过了吗？你会使用它吗？请在下方的评论区告诉我们。朋友们，
00:07:40如果你喜欢这类技术解析，请点击视频下方的点赞按钮告诉我。
00:07:45也别忘了订阅我们的频道。这里是 BetterStack 的 Andres，
00:07:50我们下个视频再见。