AngularDartでHot Reloadが使えるようになっていた

FlutterのウリのひとつであるHot Reload、この体験がAngularDartでも可能となっていた。WebでもHot Reloading。

dartファイルの編集

htmlファイル(angular template)の編集

cssの編集

これで、とくにHTMLとCSSの編集がかなり捗るようになる。

--hot-reloadオプションをつけて起動するだけで、その他の設定を変えずに有効になった。

webdev serve --hot-reload

従来のLive Reloadでは、コードの編集からブラウザのリフレッシュを経てのコードの反映までに5秒から10秒かかり、ブラウザのタブがリロードされることでランタイムの状態が一新されていたが、Hot Reloadでは0.5秒から2秒くらいで差分更新され、その他のランタイムの状態が維持される。

ただしまだ不安定な印象。手元のかなり大きなコードベースでは、ランタイムエラーがでたり、なぜかhot-reloadの動作の直後にlive-reloadの動作になりブラウザのタブがリロードされてしまう。

従来のLive Reloadでも便利なので、安定するのを気長に待ちたい。

webdev serve --live-reload

安定したら公式が大々的に宣伝をしそう。