浏览器上最快的DNN执行框架WebDNN：从基本特性到性能测评

WebDNN 是网页浏览器中最快的 DNN 执行框架，而本文首先简单介绍了 WebDNN 特征与其框架结构，即表明了为什么 WebDNN 能为端用户提供高效的 DNN 应用。而后文章将给出 WebDNN 与 Keras.js 的详细对比，并在最后一部分介绍 WebDNN 的安装环境与步骤。

WebDNN 简介

最近，深度神经网络（DNN）在很多领域吸引了大量的关注，比如图像和视频识别、自然语言处理和游戏 AI 等。很多这些领域的产品都应用了 DNN。然而，DNN 计算成本很高，而且其执行也普遍需要硬件加速。所以在终端用户设备比如笔记本电脑或智能手机上执行 DNN 也变得不现实。

解决这个问题的其中一条方案是云计算。而 WebDNN，作为另一条解决方案，高度优化了 DNN 模型，令其可在终端用户设备的网页浏览器上运行它们。

WebDNN 的关键特征如下：

• 免安装
• 零开销接口（Non overhead）
• 针对推理阶段的专门优化（Inference-phase-specialized）

免安装

WebDNN 能在网页浏览器上执行 DNN 模型。通常来讲，网页浏览器是已经在终端用户的设备上安装好了的，并且用户也熟悉如何使用它。因此，WebDNN 可以很方便地提供 DNN 的应用，并且没有任何在本地安装应用程序的困难。一些主流网页浏览器的一系列不同特点可以被用于加速，WebDNN 在不同浏览器上保持尽可能以一样速度执行 DNN 模型的策略。

零开销接口

JavaScript 是一门标准的在网页上运行的编程语言，其通过一个解释器（interpreter）执行。因此，它需要计算开销（overhead），而且它不能完全利用 CPU 的能力，同样的问题在 GPU 中也存在。现代网页浏览器支持 WebGL，即一个使用 GPU 的 JavaScript API。然而，该 API 的设计是用于图像处理而非适用于通用目的计算。此外，将 WebGL 用于通用目的计算会引发 overhead cost。

WebDNN 使用下一代 JavaScript API，即用于 GPU 执行的 WebGPU 和用于 CPU 执行的 WebAssembly。这些 API 可以帮助 GPU 和 CPU 发挥出其全部性能。

针对推理阶段的专门优化

为实现更快速的执行速度，优化 DNN 模型的计算图（graph）就显得非常重要。DNN 的执行由两阶段组成：训练阶段和推理阶段。这两个阶段分别需要不同的优化方法。WebDNN 仅专注于终端用户设备上推理阶段的执行，并且它支持复杂的优化。这种优化可以应用在用由大量 DNN 框架训练的模型上。用户不需要编辑训练代码便可实现。

框架结构

WebDNN 由两个模块组成，即图形转译器（graph transpiler）和描述符运行器（descriptor runner）。图形转译器能转译和优化模型使其成为在浏览器中可执行的格式，而描述符运行器则在浏览器中执行并转换模型。

图形转译器（Graph transpiler）是一种离线转换模型的模块，它在 Python（版本 3.6）中实现，并只有软件开发者需要运行它。该模块会产生「graph descriptor」文件，这个文件由 JavaScript 和二进制权数据组成。描述符运行器（Descriptor runner）是一个在线模块，其在终端用户的浏览器运行图形描述符（graph descriptor），该模块是 JavaScript 文件。软件开发者需要使用由软件库提供的 API 来支持模型的输入和显示输出。

安装应用开发环境在本文的最后一部分给出，其中还有一些从 Caffe、Keras、Chainer 等转换模型的案例。

与 Keras.js 的性能对比

我们前面已经了解到 DNN 的应用需要巨大的计算资源，WebDNN 可以解决这个问题，方法是将网页浏览器作为免安装的 DNN 执行框架。该框架可以优化训练后的 DNN 模型，将模型数据进行压缩，从而加快执行速度。此外，该框架使用如 WebAssembly 和 WebGPU 等全新 JavaScript API 以实现零开销执行（zero-overhead execution）。实验结果显示，这种方法实现了超过 200 倍的加速。

• 与 Keras.js 对比处理时间
• 测试环境

• Mac Book Pro 2015 年早款
• macOS 10.12.4 Sierra
• Intel Core i5 2.7 GHz CPU
• 16 GB Memory
• Intel Iris Graphics 6100 GPU
• Safari Technology Preview 30

• 模型：VGG16[1]、Inception-v3[4]、ResNet50[2]。
• 输入 shape：Inception-v3 为 (1, 299, 299, 3)，其它为 (1, 224, 224, 3)。

单图用时以对数刻度展示在竖轴上。

带有 WebGPU 后端的 WebDNN 要显著地快于 Keras.js。而带有 WebAssembly 后端的 WebDNN 和带有 GPU 后端的 Keras.js 效果相仿。在每一个 DNN 模型和后端中，WebDNN 在速度方面都获得更好的结果。并且当在图形转译器（graph transpiler）应用最优化时，其还能获得更大的加速。

快速运行对比

现在让我们在浏览器上转换并执行 ResNet50 预训练 Keras 模型。

首先，保存由 Keras 提供的的 ResNet50 预训练模型。

from keras.applications import resnet50model = resnet50.ResNet50(include_top=True, weights='imagenet')model.save("resnet50.h5")

接下来通过命令行接口（CLI）转化模型。在该阶段内，模型已经优化了。

python ./bin/convert_keras.py resnet50.h5 --input_shape '(1,224,224,3)' --out output

然后，生成的文件（称之为 Descriptor）能随后由 JavaScript 加载并执行。

let runner;async function init() { // Initialize descriptor runner runner = await WebDNN.prepareAll('./output');}async function run() { // Set the value into input variable.runner.inputViews[0].set(loadImageData());  // Runawait runner.run();  // Show the resultconsole.log('Output', WebDNN.Math.argmax(runner.outputViews[0]));}

WebDNN 同样支持 Caffemodel 和 Chainer 模型。

安装向导

下载代码

git clone https://github.com/mil-tokyo/webdnn

安装 WebGPU 环境

WebDNN 在支持 WebGPU 的浏览器中运行十分快捷。但目前只有苹果操作系统上的 Safari Technology Preview 支持。

https://developer.apple.com/safari/technology-preview/

如果你并没有这样的环境，就可以使用 WebAssembly 后端，基本上所有的现代浏览器都支持它。注意：IE 和 Safari 并不支持 WebAssembly，但是 asm.js 代码可以和 WebAssembly 代码一起自动生成，并且有相似的性能。

安装 Python 包

该框架要求 Python 3.6 及以上。

cd webdnnpython3 setup.py install

以上命令将安装 webdnn。

如果希望转换 Caffe 或 Chainer 的模型，那么就需要安装 chainer 包。

pip install chainer

（目前，测试的是 chainer==1.23）

安装 Emscripten 和 Eigen

如果你希望启用 WebAssembly 后端，那么就需要 Emscripten 的 emm++命令。如果你只希望尝试 WebGPU 后端，那么可以跳过这一节。

安装 Emscripten 以支持 WebAssembly。更多请查看：http://webassembly.org/getting-started/developers-guide/

git clone https://github.com/juj/emsdk.gitcd emsdk./emsdk install sdk-incoming-64bit binaryen-master-64bit./emsdk activate sdk-incoming-64bit binaryen-master-64bit

为了启用 em++命令，你需要在 shell 中键入以下命令：

source ./emsdk_env.sh

Eigen 作为软件库是需要的。

wget http://bitbucket.org/eigen/eigen/get/3.3.3.tar.bz2tar jxf 3.3.3.tar.bz2

为了启用 Eigen 列入汇编（compile）中，你需要在 shell 中键入以下命令：

export CPLUS_INCLUDE_PATH=$PWD/eigen-eigen-67e894c6cd8f

请注意 Python 环境

Emscripten 需要 python2 命令，你需要安装的 Python 环境对于 Python3 来说为 3.6+，对于 Python2 来说是 2.7。pyenv 将有助于安装这类环境。

参考文献：

[1] Karen Simonyan and Andrew Zisserman. 2014. Very Deep Convolutional Networks for Large-Scale Image Recognition. In Proceedings of the International Conference on Learning Representations (ICLR).

[2] Kaiming He, Xiangyu Zhang, Shaoqing Ren, and Jian Sun. 2015. Deep Residual Learning for Image Recognition. In Proceedings of the Conference on Computer Vision and Pattern Recognition (CVPR).https://github.com/KaimingHe/deep-residual-networks

[3] Applications - Keras Documentation

[4] Christian Szegedy, Vincent Vanhoucke, Sergey Ioffe, Jon Shlens, and Zbigniew Wojna. 2016. Rethinking the Inception Architecture for Computer Vision. In Proceedings of the Conference on Computer Vision and Pattern Recognition (CVPR).