8
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

ランサーズAdvent Calendar 2017

Day 8

ブラウザで動作する機械学習ライブラリdeeplearn.js

Posted at

ランサーズ Advent Calendar 2017 8日目

はじめまして、開発部の井上です。
ランサーズにおける機能開発を主に担当しております。
今回はdeeplearnjsについて少し紹介させていただきます。

なにそれ?

Googleが発表したJavaScriptライブラリです。
ブラウザ単独で動作する点、WebGLを介してGPUが利用できる点等が特徴として挙げられます。特に計算処理がクライアント上になるというのはdeeplearnjsの優位性ともいえます。

背景

近年、需要が高まる機械学習。どの企業でも活用が進んでいますね。
ランサーズでも機械学習への取り組みが進んでおりサービスへの活用が行われています。
(詳しくは担当者が書いてくれるはず...)
ブラウザで動作するということで導入コストが低く、
学習しやすそうだと感じたので触れてみることにしました。

早速動かしてみる

それでは動作させてみましょう。
githubリポジトリにいくつかのデモがあるので動作させてみようと思います。

git clone https://github.com/PAIR-code/deeplearnjs.git
cd deeplearnjs # 以降の操作は、このディレクトリをカレントと想定しています
npm run prep

それではdemosディレクトリ配下にいくつかあるデモの中から
Compositional Pattern-Producing Network(CPPN)を動かしてみます。

./scripts/watch-demo demos/nn-art
ブラウザで以下URLへアクセス

nn-art.png

簡単に動作させることができましたね。

他も触ってみる

demos配下のディレクトリを指定してやることで
他にも色々なデモも触ることができます。

Benchmark

CPUとGPUのベンチマーク

./scripts/watch-demo demos/benchmarks
benchmark.png

GPUの方が高い結果が出てますね。

Model-Builder

画像認識

./scripts/watch-demo demos/model-builder
model-builder.png

初期状態では精度が悪いので
trainを実行し、しばらく待てば(3分ぐらい)徐々に精度が上がってるのがわかると思います。
画面中央付近にあるCPUとGPUを切替えてもらって、その差を感じて下さい。

環境を作ってみる

それでは自身で利用/開発するにはどうすればよいか?ですが、
cloneしたリポジトリ内にstarterが含まれているのでソチラを利用するのが良いです。
typescriptとes6の2種類存在していますが、手順は簡単です。

cd starter/[typescript|ec6]/
yarn prep
yarn watch

実行はコマンド実行したディレクトリにあるindex.htmlをブラウザで開けばOKです
実行結果はブラウザのdeveloper toolにて確認できます。

result.png

より簡単に

yarnがインストールできない環境の方にはコチラ
htmlファイル作成して中に以下コードを記述してもらえば簡単に実行できます。
これらは配列の中身をスカラーで合計するだけの簡単な計算処理です。

index.html
<script src="https://unpkg.com/deeplearn"></script>

<script type="text/javascript">
var math = new dl.NDArrayMathGPU();
var a = dl.Array1D.new([10, 15, 20]);
var b = dl.Scalar.new(5);

var result = math.add(a, b);

result.data().then(data => console.log(data)); // Float32Array([15, 20, 25])

console.log(result.dataSync());
</script>

まとめ

比較的簡単に機械学習を体験できたのではないでしょうか?
発表も新しいためネット上に資料が少なく動作環境も限られてますが、
クライアント上で動作する機械学習ライブラリということで発想は面白いと思います。

現状deeplearnが公式でサポートしてるのがtypescriptとes6ですが、
reactから操作してみようと整理してますので近々お伝えできれば幸いです。

8
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?