以前からなんとなく興味があった TypeScript を初めて使ってみましたので感想などを。
TypeScript lets you write JavaScript the way you really want to.
TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.
Any browser. Any host. Any OS. Open Source.
TypeScriptとは
TypeScript はマイクロソフトによって開発されたフリーでオープンソースのプログラミング言語である。TypeScript は JavaScript に使用するかどうかが任意の静的型付けとクラスベースオブジェクト指向を加えたスーパーセットとなっている。C# のリードアーキテクトであるアンダース・ヘルスバーグが TypeScript の開発に関わっている。- Wikipedia
とのことです。静的型付けとクラスベースでの実装が可能だということですね。
まとめ
時間のない人のため。
TypeScript + AngularJS でニューラルネットワークのアルゴリズムの一つであるDenoising Autoencodersを実装しました。このDenoising Autoencoderを構成要素として何層も積み重ねるとStacked Denoising Autoencoderとなり、Deep Learning(深層学習)とも呼ばれます。
* ソースコード
* デモ (Angular Material利用)
(Google Chrome 44.0, Firefox 40.0 で動作確認済)
環境
- CentOS 7.0 (x86_64), Windows 7 Home Premium (x64)
- TypeScript 1.5
- Emacs 24.3
- Visual Studio Community 2013
導入
LinuxでもTypeScriptの導入は簡単でした。
1 2 3 4 |
$ sudo yum install nodejs npm $ sudo npm install -g typescript $ tsc -v message TS6029: Version 1.5.0-beta |
Emacs環境の構築
Emacs(emacs-nox)で開発する場合。typescript-tools というものが便利らしいので使わせていただきました。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
## typescript-tools のインストール $ git clone git://github.com/clausreinke/typescript-tools.git $ cd typescript-tools/ $ sudo npm install -g ## 以下、Emacs上での設定作業 M-x package-install typescript tss ;; init.el ;; typescript-mode (require 'typescript) (add-to-list 'auto-mode-alist '("\\.ts$" . typescript-mode)) (require 'tss) (setq tss-popup-help-key "C-:") (setq tss-jump-to-definition-key "C->") (setq tss-implement-definition-key "C-c i") (tss-config-default) |
この設定をしておけば、コード補完やFlymakeなどの便利機能がTypeScriptでも利用できるようになります。
Visual Studio Community環境の構築
WindowsならVisual Studio一択かと。便利です。さすがMicrosoft製といったところでしょうか。Visual StudioにTypeScript開発用のプラグインを入れます。
あとユニットテストには今回 Jasmine というフレームワークを初めて使いました。これもプラグインを入れるだけです。テストランナーには Chutzpah というのをこちらも初めて使いました。[Tools] – [NuGet Package Manager] から簡単にインストールできます。
あとはEmacs emulation等のプラグインも入れました。
機械学習アルゴリズムの実装
ある程度の規模以上のWebサイトを作るのにはTypeScriptが有用そうだとは思いますが、僕にWeb制作の能力はないので、Webサイトではなくライブラリをいくつか作っていこうと思います。今回は流行りのDeep Learning(深層学習)を教材にTypeScriptに慣れていこうという趣旨で進めてみます。画像処理用途であれば CNN(Convolutional Neural Network) を実装するのが妥当ですけど、CNNは個人的に食傷気味なので今回は Autoencoder というCNNとは異なるニューラルネットワークアルゴリズムのひとつをTypeScriptで書いてみます。
ここで、deeplearning.net というDeep Learning関連の有名なサイトがあります。このサイトはPythonでDeep Learningのアルゴリズムをstep by stepで実装していくというチュートリアルになっています。
僕も1年ちょっと前にひととおりチュートリアルをやってみましたが、Python(Theano)ベースだとあっという間に実装できてしまって達成感がなかったので、ここは他のスクリプト言語でやってみようと思って前から勉強してみたかったTypeScriptを選びました。ブラウザのJavaScriptエンジンの数値計算能力のベンチマークもできそうですかね。
Denoising Autoencoder
今回の目的はTypeScriptの習得であってアルゴリズムの勉強ではないのですが、せっかくなので概要だけ説明します。Autoencoder (オートエンコーダ)というのは、日本語では自己符号化器と呼ばれていて、出力が入力と同じになるように符号化の方法(パラメータ)を学習するニューラルネットワークです。下の図は入力層が5ノード、隠れ層(中間層)が3ノード、出力層が5ノードのAutoencoderの例になります。5次元の情報を3次元に圧縮(符号化)し、それを復元(復号化)する、元の入力をよく表す特徴を学習する次元圧縮器として働きます。データ内の不要な情報を削ぎ落として、本質だけを取り出すようなイメージです。
Denoising Autoencoderというのは名前の通り、ノイズを加えられた入力を符号化し、そのノイズを取り除くように元の入力を復元するAutoencoderになります。データの特徴を上手く表現しつつ、ノイズも取り除くように学習するので結果的に性能が高くなります。また、このDenoising Autoencoderを構成要素として何層も積み重ねたものをStacked Denoising Autoencoderと呼び、Deep Learningとも呼ばれるアルゴリズムの1つになります。現在はCNNばかりでAutoencoder系は昔ほど使われていません。
実装
ニューラルネットワーク部分よりも、ベクトル/行列演算用のクラスを作ったり、AngularJS対応する方が面倒でしたが、TypeScriptの文法や機能を学ぶ良い練習になりました。また、TypeScriptということで Typed Array も利用してみましたが、この程度の規模だと速度面でのメリットはあまりないようでした(? もっと大規模なデータで学習させたらきっと差が出てくるんでしょう。機械学習は一般的に重たい処理ですが Web Workers を利用しなくても計算部分やViewの実装を工夫をすればUIをブロックせずに処理を行うことは簡単です。
Indexed Databaseの利用
また、学習したニューラルネットワークのモデルを保存しておくために Indexed Database も使っています。JavaScriptのObjectデータとして保存されるので、他言語のようにクラスのインスタンスをシリアライズしてそのまま保存するつもりで書いているとつまづくかもしれません。ObjectデータからTypeScriptクラスのインスタンスに変換するアダプタのようなものを用意する必要があります。地味に面倒なので注意。
AngularJSの利用
デモページはAngularJSを使って作りました。こちらも [Tools] – [NuGet Package Manager] から簡単にインストールできます。
VisualStudioでの補完も良い感じです。
ソースコードはGitHubに置いておきます。新しいレポジトリを作るまでもない内容なのでJavaScriptのサンプルを置いているレポジトリに。AngularJS対応部分や、Jasmineを使ったユニットテストのコードもあります。
コンパイル/実行
Visual Studioではメニューバーの再生ボタンみたいなやつを押すだけで、TypeScriptコードをJavaScriptにコンパイルして、Webサーバ(IIS)をlocalhostで起動して、ブラウザで実行してくれるようです。ああ便利。Chutzpahのプラグインを入れていると右クリックメニューからユニットテストとカバレッジ計測を実行できます。
現時点では見ても面白くない(というか意味がわからない)デモを置いておきます。
(Google Chrome 44.0, Firefox 40.0 で動作確認済)
10次元の数値データを3次元に圧縮して、復元(再構成)するだけです。もはや Angular Material の練習のためのデモです、。
“train”ボタンで学習開始(デフォルトで学習データ一巡を1000回分)、”save”ボタンで学習したモデルをIndexed Databaseに保存、”load”ボタンで保存されたモデルを読み込み、”delete”ボタンで保存してあるモデルを削除します。今回のサンプルだとほとんど意味はないですが、”train”ボタンを何度も押して繰り返し学習を進めることができます。
画像データを扱う場合はI/O周り等いろいろと実装面で工夫する必要がありますし、次はもっとDeepなネットワークを組んで検証してみたいと思います。
感想
TypeScriptは評判通りの使いやすい言語だと実感しました。ECMAScriptの仕様に準拠しようとする姿勢にも好感が持てます。CoffeeScriptと比べるとコードは長くなりがちですけど、IDEの支援が強力なため軽快に開発を進めることができます。
JavaScriptに変換する言語においてはコンパイル時の最適化も注目される要素のひとつだと思いますが、デッドコードの削除くらいなら変換後のJavaScriptの可読性も落ちないと思いますし、その辺りから最適化周りも取り組んでくれると助かります。数値計算用途の場合、例えば number[] を Float32Array などのTyped Arrayに適切に変換してくれたら良いですね。
TypeScriptを触ってまだ間もないですが、使いやすさは十分に体験することができました。これからはTypeScriptでライブラリ等をどんどん作っていきたいと思います。