OpenCV.js: computer vision processing for the open web platform - nagutabby/senior-thesis GitHub Wiki

Citation

@inproceedings{Taheri2018OpenCV.js,
author = {S. Taheri and others},
title = {OpenCV.Js: Computer Vision Processing for the Open Web Platform},
year = {2018},
isbn = {9781450351928},
publisher = {Association for Computing Machinery},
address = {New York, NY, USA},
url = {https://doi.org/10.1145/3204949.3208126},
doi = {10.1145/3204949.3208126},
booktitle = {Proceedings of the 9th ACM Multimedia Systems Conference},
pages = {478–483},
numpages = {6},
keywords = {multimedia, web, javascript, computer vision, parallel processing, performance},
location = {Amsterdam, Netherlands},
series = {MMSys '18}
}

概要

  • 1990年代にWebが登場して以来、Webの機能の拡充が進んでいる
    • しかし、コンピュータービジョンはまだWebにおいて主流ではない
      • 理由: JavaScriptの性能が十分ではないこと、標準的なWeb APIでカメラがサポートされていないこと、包括的なコンピュータービジョンライブラリがないこと
  • OpenCVは、C++で実装された、包括的なビジョン関数のセットと大規模な開発者コミュニティーを持つ、最も人気があるコンピュータービジョンライブラリ
    • JavaScriptエンジンが高度に最適化しやすいフォーマットで提供され、WEbプログラマーが採用しやすく、アプリケーションを開発しやすいAPIを持っている
  • これまでは、Webブラウザ上でコンピュータービジョン処理を実装するにはサーバーにビジョン処理のタスクを任せるしかなかった
    • しかし、このアプローチではユーザーのデータが常にサーバーに送信されるため、ユーザーのプライバシーが侵害される危険性がある
    • 安定したオンライン接続環境が必要であり、データ転送の帯域幅や待ち時間が増加するという問題もある
  • HTML5では、サードパーティーのプラグインを必要とせずに、Webブラウザでマルチメディアコンテンツをキャプチャ、転送、表示するための新しいWeb APIがいくつか導入された
    • Web Real-Time Communication(WebRTC)は、マルチメディアコンテンツのキャプチャとピアツーピアの転送を可能にした
    • Video element APIはビデオの表示に使用できる
  • OpenCVはコンピュータービジョン開発のためのデファクトライブラリ
    • 非常に包括的であり、画像処理、物体検出、追跡、機械学習、ディープニューラルネットワーク(DNN)を利用できる
    • 複数のプロセッサコアやGPUなどのスカラーハードウェアと並列ハードウェアの両方をターゲットとした効率的な実装を提供
  • OpenCV.jsは、OpenCVをC++からJavaScriptに翻訳したもの
    • いくつかのOpenCVモジュールは除外されている
      • ハイレベルGUIとI/Oモジュールであるhighguiは、カメラなどの目rヒアデバイスやグラフィカルユーザーインターフェイスにアクセスする機能を提供するが、プラットフォームに依存するため、Web用にコンパイルできない
      • しかし、これらの機能はHTML5のプリミティブを使用して実装できる
        • getUserMediaはメディアデバイスへのアクセスに使用できる
        • Canvas要素はグラフィックを表示できる
  • LLVMベースのコンパイラであるEmscriptenを使用してOpenCVからOpenCV.jsを作成
    • C++のコードをJavaScriptのコードに変換する、Mozillaによって開発されたLLVMベースのコンパイラーであるEmscriptenを使用
    • Emscriptenはもともと、asm.jsと呼ばれるJavaScriptの型付きサブセットをターゲットにしている
      • asm.jsで書かれたJavaScriptのコードのパースとコンパイルは処理能力が低いモバイルデバイスではボトルネックになる可能性がある
      • これが、WebAssembly開発の主な動機の1つ
      • WebAssemblyはWebコンパイルのターゲットとして設計された、ポータブルなサイズとロード時間を考慮したバイナリフォーマット
      • asm.jsと比べてより軽量でパースとコンパイルが非常に高速
  • Canny, Face, Peopleベンチマークを実施
    • 動作検証環境: Intel Core i7-3770, RAM 8GB, Ubuntu, Firefox 56
    • 640x480ピクセルの画像の平均処理速度
      • Canny: 7ms
      • Face: 345ms
      • People: 323ms
    • Cannyはリアルタイムで計算できるほど高速
    • 顔や人の検出は低速でリアルタイムやインタラクティブなユースケースでは使用できない
    • マルチコアプロセッサーやSIMDを対象としたアルゴリズムの並列実装を使用したり、GPUによる演算を行うことで高速化できる
    • Web Workerを使用したマルチスレッドJavaScriptプログラムのベンチマークを実施
      • SIMDベクトル化の恩恵を受けない3つのアプリケーションベンチマークを使用
      • 性能が3倍から4倍向上した
      • cv.setNumThreadsなどのOpenCV APIを使用して動的に同時実行性を調整できる
  • OpenCV.jsはnpmパッケージとして公開されている