BT

最新技術を追い求めるデベロッパのための情報コミュニティ

寄稿

Topics

地域を選ぶ

InfoQ ホームページ ニュース Next.js 7がリリース、ビルドが40%高速に

Next.js 7がリリース、ビルドが40%高速に

ブックマーク

原文(投稿日:2018/09/30)へのリンク

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

Adoption Stage
Style
 
 

この記事に星をつける

おすすめ度
スタイル

BT