Meteor Fan (日本語情報)

JavaScriptフレームワークMeteorに関していろいろ紹介する日本語情報サイト

Meteor 1.5で採用されるdynamic import

先日のMeteor NightのBenのトークでdynamic importが紹介されました。

その後、Sashkoがブログでも詳しく紹介しています。

Meteorはこれまでもimport文をif文の中に書ける変な拡張をしていたのですが、
このdynamic importはTC39で提案されているものでES.nextに入ることが期待されます。

https://github.com/tc39/proposal-dynamic-import

dynamic importはwebpack v2でも採用されています。

https://webpack.js.org/guides/code-splitting-import/

dynamic importを使うと一部のコードを必要になってから読み込むことができるため、バンドルサイズを小さくできアプリの起動が速くなることが期待されます。

最初のページで使わないライブラリはdynamic importにするとよいでしょう。
例えば、ブログで紹介されている利用シーンは次の4つです。

  1. あまり使わないページ、例えば管理者ページ
  2. 重いUIツール、例えばPDFビューア
  3. 大きなライブラリ、例えばmoment.js
  4. 国際化のための言語パック

これまでMeteorでは初期読み込みに時間が掛かる問題がありましたが、これで解消されると期待できます。
Meteor 1.5はbackward compatibleなので既存のプロジェクトで順次dynamic importを利用していくように変更できそうです。

興味ある方はベータ版を試してみましょう。