Shoeisha Technology Media

CodeZine(コードジン)

特集ページ一覧

「React v16.0」がリリース

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加
2017/09/28 16:15

 米Facebookは、UI構築のためのJavaScriptライブラリ「React v16.0」を、9月26日(現地時間)にリリースした。なお、Reactはバージョン15.6.2よりMITライセンスでリリースされており、「React v16.0」もMITライセンスのもとで利用できる。

 「React v16.0」における、おもな変更点はrenderメソッドコンポーネントにおける、要素の配列を返せるfragments型の追加で、他の配列と同様に各要素にはキーを追加する必要がある。なお、将来的にはキーを必要としない特殊な構文をJSXに追加する予定となっている。また、文字列を返すstrings型も追加された。

 エラー処理にも変更が加えられており、従来より発生していたレンダリング中のランタイムエラー発生時に、ページを更新して回復する必要があったのに対して、「React v16.0」ではコンポーネントのレンダリングメソッドまたはライフサイクルメソッドでエラーが発生した場合、デフォルトではコンポーネントツリー全体がルートからマウント解除され、破損したデータの読み込みを防ぐ。

 ただし、エラー発生時にアプリケーション全体をアンマウントするのは理想的なUIではないため、サブツリー内でエラーを検出した際に、アプリケーションをアンマウントする代わりにフォールバックUIを表示する、エラー境界も利用できる。

 このほか、親コンポーネントのDOM階層の外にあるDOMノードでレンダリングが可能なポータル機能や、再実装によってパフォーマンスを大きく向上したサーバレンダラー、カスタムDOM属性のサポートといった新機能の追加が行われており、React本体についてはファイルサイズが大幅に縮小された。

 なお、「React v16.0」は、新コアアーキテクチャ「Fiber」上に構築された最初のバージョンであり、「Fiber」はエラー境界やfragmentsといった、「React v16.0」の新機能のすべてを担っている。開発チームでは、ブラウザに定期的に実行結果を送信することで、レンダリング作業をスケジューリングする非同期レンダリングにも積極的に取り組んでいるが、現時点では採用されていない。

 従来バージョンからのアップグレードする場合の注意点としては、ReactDOM.renderの代わりにReactDOM.hydrateを使用する必要があるほか、すでに発表されているようにアドオンのサポートが廃止されている。

 ほかにも、unstable_handleErrorメソッドがcomponentDidCatchメソッドに変更され、ReactDOM.renderおよびReactDOM.unstable_renderIntoContainerがライフサイクルメソッド内から呼び出された場合にnullを返すようになっている(ポータルや参照で回避可能)など、従来バージョンとの互換性が失われる、いくつかの変更が行われた。


【関連リンク】
Facebook開発者向けサイト
React(英語)

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加
All contents copyright © 2005-2019 Shoeisha Co., Ltd. All rights reserved. ver.1.5