Next.jsチームがオープンソースのReactフレームワークNext.js version 7を発表した。今回のリリースは、全体的な開発者体験の向上にフォーカスしており、開発における起動時間57%高速化およびビルド時間40%高速化、エラーレポートの改善、WebAssemblyのサポートといったものが含まれている。
Next.jsはReactフレームワークのひとつで、すぐれた開発者体験とともに、製品ですぐれたパフォーマンスを提供することを主たる目標としている。すぐれた開発者体験を提供するため、Next.jsはサーバーサイドレンダリング、コード分割、クライアントサイドルーティングをサポートする。
Next.jsは、BabelやWebpackといったJavaScriptエコシステムにおける多数の業界標準ツールをもとに作られており、version 7では、これらツールの最新バージョンが使われている。インクリメンタルなコンパイルキャッシュとこれらアップグレードのおかげで、Next.jsのコンパイルは40%高速化され、基本的なアプリケーションのコンパイル時間が304msから178msに削減されたという。
Webpackのアップグレードにより、Next.js 7は.mjsを新たにサポートし、CommonJS、AMD、ESMといった一般的なJavaScriptモジュールをすべてバンドルできるだけでなく、EcmaScript、JSON、WebAssemblyモジュールもサポートする。
また、Babelの最新バージョンもバンドルする。これにより、TypeScript、fragment構文、実験的なauto-polyfillingをサポートする。
Next.js 7における初期ペイロードサイズは7.4%ほど削減され、以前のバージョンのNext.jsのドキュメントサイズ1.62kBから1.50kBになった。これら改善は、特定のHTML要素の削除と一部インラインスクリプトの圧縮によるものだ。
Next.js 7でもうひとつ大きな改善は、React Context APIのサポートだ。Context APIは、毎回明示的に共有する必要なしに、Reactコンポーネント間でデータ共有をする方法だ。おかげでNext.jsでページ間のコードを共有できるようになり、メモリ消費が16%削減される。
Next.js 7では、モジュールの動的インポートをサポートする。これまでは独自のインポート機能を使っていたためできなかったことだ。彼らはその機能を削除し、Webpackで利用できるデフォルトのインポート機能をサポートした。おかげで、動的インポート、名前づけ、ファイルのバンドルが可能になる。
Next.jsはコミュニティで多くの賞賛を受けている。Redditにおいて、reacttricksはこう述べている。「私はこの1年半、すべてのプロジェクトでもっぱらNext.jsを使ってきました。みんなにNext.jsを試してみることをおすすめします」。Next.jsとは一体何か、混乱しているフィードバックもある。theineffablebobはこう質問している。「サイトを動かすのに必要なものを全て含んでいるフレームワークですか？、そうしたボイラープレートみたいなもののひとつですか？」 Nextjs.orgは自らを、JavaScriptとReactの世界のPHPだと考えている。nextjs.orgから引用する。「どうやってPHPでWebアプリを作るか考えてください。いくつかファイルを作成し、PHPコードを書き、それを単にデプロイします。ルーティングをあまり気にする必要はありませんし、アプリはデフォルトでサーバー上でレンダリングされます」
Next.jsの最新バージョンはNext.jsのWebサイトから入手できる。
Rate this Article
- Editor Review
- Chief Editor Action