OpenCV.jsでFace Detectionを試してみた。
こんにちは。
腰を痛めて家で療養中です。あまりにも暇なので、以前から気になっていたOpenCVについて調べてみました。
んで調べてみると、OpenCV.jsなるものがあるんですね。
「ブラウザで動くじゃん、モバイルでも動くかな?」
OpenCVの勉強をするつもりが、主目的がOpenCV.jsをモバイルブラウザで動かすことに代わってしまいました。あるあるですね。
というわけで、そんな勉強がてらOpenCVのFace Detectionをブラウザで動かしてみました。
作ったもの
こんなのです。
youtu.be
もう、どうしようもないくらいカックカクですね。
ASUS ZenfoneAR(Snapdragon 821)なのでそんなにスペック悪くないですけどねー。
PC(Lenovo X260)側だとぬるぬるなので、現時点でのスマホの限界なのでしょうね。
Web Assembly化するともうちょとましになるのかな。暇になったら対応してみよう。
あと、画像がぼやけているせいか、小さな顔は認識しませんでした。寄ると認識します。
作業手順
手順というか、参考にしたサイトの羅列です。
まずここ
そしてそこで紹介されているここ
emsdkのインストールはここがわかりやすかった
Developer’s Guide - WebAssembly
「./emsdk install」実行後、ものすごく時間がかかるので覚悟することw
そのあと手順通りに実行していくと、
「python ./platforms/js/build_js.py build_js」
を実行した後で、opencv.jsが出来上がる。
このコマンドもものすごく時間がかかります。
できたOpencv.jsを使って、チュートリアルで一番簡単そうなのを実装してみた。
問題なく動いたので、次に本題のFace Detectionです。
OpenCV: Face Detection in Video Capture
これも問題なく動いたので、あとはHTMLとかそこいらへんをいじって全画面化しています。
まとめ
Javascriptは遅い、スマホのは特にって言われているのは知っていましたが、VRとかARとか普通に動くし問題ないんじゃ?ってどこかで思っていましたが、OpenCVを動かしてみたら、カックカクだし「あー、これはだめだぁ」って思いました。
asm.jsやWebAssemblyはこれを解決しようとがんばっているのですね。一人で納得
明らかに重い処理でなければ、ブラウザ上でOpenCVが動くということは様々な使い道があるのではと感じています。
今まで画像を扱う場合、クラウド上にファイルをそのまま送信し下処理の上AIに食わせるという流れでしたが、スマホ上で下処理および軽量化したうえで送信できるので、サーバ負荷が少なくなるでしょう。サーバ側はAI処理に集中できるので良いことだと思いました。
以上