TensorFlow.js で Keras の学習済み MNIST モデルを体験（ウェブアプリによる代替体験版）

このページは、Keras の学習済み MNIST モデルをウェブアプリで体験するバージョンとなっています。

なお、TensorFlow.js による体験ページでは、ページのロード時にモデルの読み込みが発生しますので、通信環境に特にご注意ください。また、ブラウザやそのバージョンによっては動作しない場合もあります。

TensorFlow.js による体験ページは、こちらのページです。

また、Parcel による Build バージョンは、こちらのページです。

下の黒いエリアに手書きの数字を１文字書いてください。パソコンの場合はマウスで対応します。

実行ボタンで、書かれた数字を予測します。

学習モデルの作成には、Keras の examples に収録されている https://github.com/keras-team/keras/blob/master/examples/mnist_cnn.py の最終行に、モデルを保存する次のコードを１行追加して、実行しました。

model.save('mnist_model.h5')

ちなみに、今回の学習の実行環境は、お名前.com VPS の メモリ 2GB プランで、およそ１週間かかっています。

Keras の学習済みモデルを TensorFlow.js で読み込み可能にする変換コマンドが用意されていますので、インストールします。

公式チュートリアルは、https://js.tensorflow.org/tutorials/import-keras.html です。

$ pip install tensorflowjs

そして、以下のコマンドにより、model ディレクトリに TensorFlow.js で読み込み可能なファイル群が作成されます。なお、TensorFlow.js では、このディレクトリ内に作成されている JSON ファイル（model.json）を指定することにより、学習済みモデルをロードします。

$ tensorflowjs_converter --input_format keras mnist_model.h5 model