說一說Web端側AI

凹凸實驗室發表於2021-10-03
WebAI

前言

AI 正在不斷擴充前端的技術邊界， 演算法的加持也為前端研發注入了全新的力量。本文為大家介紹什麼是端智慧，端智慧的應用場景以及 Web 端側實現 AI 的基本原理概念。

什麼是端智慧

首先，回顧一個AI應用的開發流程，具體步驟包括了

  • 資料的採集與預處理
  • 模型的選取與訓練
  • 模型的評估
  • 模型服務部署

模型訓練的中間產物為一個模型檔案，通過載入模型檔案，部署為可呼叫的服務，然後就可以呼叫進行推理預測了。

在傳統流程中，模型服務會部署在高效能的伺服器上，由客戶端發起請求，由伺服器端進行推理，將預測結果返回給客戶端，而端智慧則是在客戶端上完成推理的過程。

端智慧的應用場景

端智慧現在已經有非常多的應用場景，涵蓋視覺類的 AR 、互動遊戲，推薦類的資訊流推薦，觸達類的智慧Push等，語音類的直播、智慧降噪等多個領域。演算法逐漸從服務端覆蓋到使用者實時感知更強的移動終端。

典型應用包括了

  • AR 應用、遊戲。由 AI 提供理解視覺資訊的能力，由 AR 根據視覺資訊來實現虛實結合的互動，帶來更沉浸式的購物、互動體驗。比如美顏相機、虛擬試妝，即是通過檢測人臉面部的關鍵點，在特定區域使用 AR 增強、渲染妝容。
  • 互動遊戲。飛豬雙十一的互動遊戲"找一找"， 即是一個跑在 h5 頁面的圖片分類應用，通過攝像頭實時捕捉圖片，呼叫分類模型進行分類，當出現遊戲設定目標時得分。
  • 端側重排。通過實時的使用者意識識別，對伺服器推薦演算法下發的feeds流進行重新排列，做出更精準的內容推薦。
  • 智慧Push。通過端側感知使用者狀態，決策是否需要向使用者實施干預，推送Push，選取合適的時機主動觸達使用者，而非伺服器端定時的批量推送，帶來更精準的營銷，更好的使用者體驗。

端智慧的優勢

從普遍的應用場景，可以看到端智慧的明顯優勢，包括了

  • 低延時

    實時的計算節省了網路請求的時間。對於高幀率要求的應用，比如美顏相機每秒都要請求伺服器，高延遲絕對是使用者所不能接受的。而對於高頻互動場景，比如遊戲，低延時變得更為重要。

  • 低服務成本

    本地的計算節省了伺服器資源，現在的新手機發布都會強調手機晶片的 AI 計算能力，越來越強的終端效能讓更多的端上 AI 應用成為了可能。

  • 保護隱私

    資料隱私的話題在今天變得越來越重要。通過在端側進行模型的推理，使用者資料不需要上傳到伺服器，保證了使用者隱私的安全。

端智慧的侷限

同時，端智慧也有一個最明顯的侷限，就是低算力，雖然端側的效能越來越強，但是和伺服器相比還是相差甚遠。為了在有限的資源裡做複雜的演算法，就需要對硬體平臺進行適配，做指令級的優化，讓模型能夠在終端裝置中跑起來，同時，需要對模型進行壓縮，在時間和空間上減少消耗。

現在已經有一些比較成熟的端側推理引擎了，這些框架、引擎都對終端裝置做了優化來充分發揮裝置的算力。比如Tensorflow Lite、Pytorch mobile、阿里的 MNN、百度飛槳 PaddlePaddle。

Web端呢

Web 端同樣擁有端側 AI 的優勢與侷限，作為在 PC 上使用者訪問網際網路內容和服務的主要手段，在移動端很多APP也會嵌入 Web 頁面，但是瀏覽器記憶體和儲存配額的有限，讓 Web 上執行 AI 應用看上去更不可能。

然而在 2015 年的時候就已經出現了一個 ConvNetJS的庫，可以在瀏覽器裡用卷積神經網路做分類、迴歸任務，雖然現在已經不維護了，2018 年的時候湧現了非常多的JS的機器學習、深度學習框架。如 Tensorflow.js 、 Synaptic 、 Brain.js 、 Mind 、 Keras.js 、 WebDNN 等。

受限於瀏覽器算力，部分框架如 keras.js 、 WebDNN框架只支援載入模型進行推理，而不能在瀏覽器中訓練。

此外，一些框架不適用於通用的深度學習任務，它們支援的網路型別有所不同。比如 TensorFlow.js 、 Keras.js 和 WebDNN 支援了 DNN 、 CNN 和 RNN。而 ConvNetJS 主要支援 CNN 任務，不支援 RNN。Brain.js 和 synaptic 主要支援 RNN 任務，不支援 CNN 網路中使用的卷積和池化操作。Mind 僅支援基本的 DNN。

在選擇框架時需要看下是否支援具體需求。

Web端架構

Web端是如何利用有限的算力的呢？

一個典型的 JavaScript 機器學習框架如圖所示，從底向上分別是驅動硬體，使用硬體的瀏覽器介面，各種機器學習框架、圖形處理庫，最後是我們的應用。

Untitled

CPU vs GPU

在 Web 瀏覽器中執行機器學習模型的一個先決條件是通過 GPU 加速獲得足夠的計算能力。

在機器學習中，尤其是深度網路模型，廣泛使用的操作是將大矩陣與向量相乘，再與另一個向量做加法。這種型別的典型操作涉及數千或數百萬個浮點操作，而是它們通常是可並行化的。

以一個簡單的向量相加為例，將兩個向量相加可分為許多較小的運算，即每個索引位置相加。這些較小的操作並不相互依賴。儘管 CPU 對每個單獨的加法所需的時間通常更少，隨著計算量規模的變大，併發會逐漸顯示出優勢。

Untitled

WebGPU/WebGL vs WebAssembly

有了硬體之後，需要對硬體進行充分的利用。

  • WebGL

    WebGL 是目前效能最高的 GPU 利用方案，WebGL 為在瀏覽器中加速 2D 和 3D圖形渲染而設計，但可以用於神經網路的平行計算來加速推理過程，實現速度數量級的提升。

  • WebGPU

    隨著 Web 應用對可程式設計 3D 圖形、影像處理和 GPU 訪問需求的持續增強，為了在 WEB 中引入GPU 加速科學計算效能，W3C 在 2017 年提出了 WebGPU ，作為下一代 WEB 圖形的的 API 標準，具有更低的驅動開銷，更好的支援多執行緒、使用 GPU 進行計算。

  • WebAssembly

    當終端裝置沒有 WebGL 支援或者效能較弱的時候，使用 CPU 的通用計算方案為 WebAssembly 。WebAssembly是一種新的編碼方式，可以在現代的網路瀏覽器中執行，它是一種低階的類組合語言，具有緊湊的二進位制格式，可以接近原生的效能執行，併為諸如C / C ++ 等語言提供一個編譯目標，以便它們可以在 Web 上執行。

Tensorflow.js

以 Tensorflow.js 為例，為了在不同的環境下實現執行，tensorflow 支援了不同的後端，根據裝置條件自動選擇相應的後端 ，當然也支援手動更改。

Untitled

tf.setBackend('cpu');
console.log(tf.getBackend());

對一些通用模型進行測試，WebGL速度大於普通 CPU 後端計算的 100 倍，WebAssembly 則比普通的 JS CPU 後端快 10-30 倍。

同時， tensorflow 也提供了 tfjs-node 版本，通過 C++ 和 CUDA 程式碼編譯的本機編譯庫驅動 CPU 、 GPU 進行計算，訓練速度與 Python 版本的 Keras 相當。不需要切換常用語言，可以直接在 nodejs 服務上新增 AI 模組，而不是再啟動一個 python 的服務。

模型壓縮

有了框架對於硬體裝置的適配，還需要對模型進行壓縮，複雜的模型固然有更好的預測精度，但是高額的儲存空間、計算資源的消耗，過長的推理速度在大部分移動端場景中還是難以接受的。

模型的複雜度在於模型結構的複雜以及海量的引數。模型檔案中通常儲存了兩部分資訊：結構與引數，如下圖中簡化的神經網路所示，每個方塊對應一個神經元，每個神經元以及神經元中的連線上都是引數。

模型的推理即從左側輸入，通過與神經元進行計算，再通過連線加上權重傳到下一層計算，到最終層得到預測輸出。節點越多、連線越多，則計算量越大。

Untitled

模型剪枝

對訓練好的模型進行裁剪，是模型壓縮的一個常見方式，網路模型中存在著大量冗餘的引數，大量神經元啟用值趨近於 0，通過對無效節點或者是不那麼重要的節點進行裁剪，可以減少模型的冗餘。

最簡單粗暴的剪枝即 DropOut ，在訓練過程中隨機對神經元進行丟棄。
大部分的剪枝方法會計算重要性因子，計算神經元節點對於最終的結果的重要性，剪去不那麼重要的節點。

模型剪枝的過程是迭代反覆進行的，並非剪枝後直接用來推理，通過剪枝後的訓練恢復模型的精度，模型的壓縮過程是在精度和壓縮比例之間的不斷權衡，在可接受的精度損失範圍內選擇最好的壓縮效果。

模型量化

為了保證較高的精度，大部分的科學運算都是採用浮點型進行計算，常見的是 32 位浮點型和 64 位浮點型，即 float32 和 double64。量化即是把高精度的數值轉化為低精度。

如二值量化（1bit量化）會直接將 Float32/float64 的值對映到 1bit ，儲存空間直接壓縮 32 倍/ 64 倍，計算時載入所需記憶體同樣也會變小，更小的模型尺寸，帶來更低的功耗以及更快的計算速度。除此還有8bit量化、任意bit量化。

知識蒸餾

知識蒸餾則是將深度網路中所學到的知識轉移到另一個相對簡單的網路中，先訓練一個 teacher 網路，然後使用這個 teacher 網路的輸出和資料的真實標籤去訓練 student 網路。

工具

模型壓縮的實現較為複雜，如果只是面向應用，大概瞭解其作用原理即可，可以直接用封裝好的工具。

比如 Tensorflow Model Optimization Toolkit 提供了量化功能，其官方對於一些通用模型進行了壓縮測試，如下表可以看到，對於 mobilenet 模型，模型大小由 10M+ 壓縮到了 3、4M，而模型的精度損失很小。

Untitled

百度的飛槳提供的 PaddleSlim 則提供了上述三種壓縮方法。

Untitled

總結

綜上，開發一個 Web 端上的 AI 應用，流程即變成了

  • 針對特定場景設計演算法、訓練模型
  • 對模型進行壓縮
  • 轉換為推理引擎所需要的格式
  • 載入模型進行推理預測

對於演算法而言，通用的深度學習框架已然提供了若干的通用預訓練模型，可以直接用來做推理，也可以在其基礎上訓練自己的資料集。模型的壓縮與推理也可以使用現有的工具。

參考文獻

[1] https://tech.taobao.org/news/2021-1-7-32.html

[2] https://juejin.cn/post/684490...

[3] Ma Y, Xiang D, Zheng S, et al. Moving deep learning into web browser: How far can we go?[C]//The World Wide Web Conference. 2019: 1234-1244.

[4] WebGPU: https://www.w3.org/TR/webgpu/

[5] Tensorflow.js: https://www.tensorflow.org/js...

[6] WebAssembly: https://developer.mozilla.org...

[7] Deep Learning with JavaScript https://www.manning.com/books...

歡迎關注凹凸實驗室部落格：aotu.io

或者關注凹凸實驗室公眾號（AOTULabs），不定時推送文章。

相關文章