Webpackの後継となる新バンドルツール「Turbopack」が登場。Rust製のネイティブアプリケーションでWebpackの700倍高速に。Next.js Conf 2022

今回は「Webpackの後継となる新バンドルツール「Turbopack」が登場。Rust製のネイティブアプリケーションでWebpackの700倍高速に。Next.js Conf 2022」についてご紹介します。

関連ワード (年間、維持、複数等) についても参考にしながら、ぜひ本記事について議論していってくださいね。

本記事は、Publickey様で掲載されている内容を参考にしておりますので、より詳しく内容を知りたい方は、ページ下の元記事リンクより参照ください。


Reactベースのサーバサイドフレームワークとして知られるNext.jsの開発元のVercelは、日本時間10月25日深夜にイベント「Next.js Conf 2022」を開催。Next.jsの最新バージョンとなる「Next.js 13」と、Rust製の高速なバンドルツール「Turbopack」を発表しました。

Introducing Turbopack, the successor to Webpack.

~700x faster than Webpack
10x faster than Vite
Native incremental architecture built with Rust
Support for React Server Components
Support for TS, JSX, CSS & more

Now open-source in Alpha.https://t.co/dHXXFfgGOJ

— Vercel (@vercel) October 25, 2022

バンドルツールとは多数のJavaScriptやTypeScriptなどのコードを1つにまとめる機能を備えたツールです。多数のライブラリやコンポーネントなどを用いてチームで開発する大規模なWebアプリケーションの開発には欠かせません。

今回発表されたTurbopackは、代表的なバンドルツールの1つであるWebpackの開発者Tobias Koppers氏らがVercelに参加して開発したものです。同社はWebpackの後継がTurbopackであると説明しています。

Turbopackの特徴はRustで記述されたネイティブアプリケーションであることと、一度実行された内容は再利用される仕組みを備えていることなどで、これにより大規模なアプリケーションでも高速な起動と実行を実現します。

Next.js 13ではこのTurbopackが標準のバンドルツールとなります。

Next.js Conf 2022の基調講演から、Turbopackに関する説明が行われた部分をまとめました。

関連:Next.js 13登場、動的なWebサイトの実現を強化。複数ページでの動的データの共有や、ステートを維持した共通ナビゲーションの構築など容易に。Next.js Conf 2022

JavaScriptベースのツールは性能面での限界に直面した

VP of Developer Experience Lee Robinson氏。

Next.jsにおけるコンパイラインフラストラクチャの新しい始まりです。

fig

かつて2016年には、JavaScriptのためのツールをJavaScriptで書くことは自然なことでした。Babel、tercer、Webpackなどのツールはそうして作られました。

fig

しかしフロントエンドアプリケーションのサイズと複雑さの増加に対して、これらJavaScriptベースのツールによるコンパイルは性能面での限界に直面するようになります。

そこで私たちはRustベースのネイティブなツールへの移行を開始したことを前回のイベントでご紹介しました。まずBabelから移行し、トランスパイルの速度を17倍にしました。次に、tercerも置き換えることで、minificationが6倍速くなりました(新野注:Babelとtercerの移行先となったツールはSWC)。

fig

Webpackの後継となるTurbopackの登場

ではバンドルについてはどうでしょうか。バンドルツールのWebpackは30億回以上ダウンロードされており、ビルドに欠かせない存在です。しかしWebpackもBabelやtercerと同じように、ネイティブに全力を注ぐ時が来ました。

Webpackの開発者であるTobias Koppersは私たちVercelに加わり、次世代のバンドルツールを作るためにワールドクラスのエンジニアのチームを結成しました。このチームがWebpackの10年間の教訓と、TurborepoやGoogleのBazelから得た革新とを組み合わせることで、次の10年に耐えるアーキテクチャを開発したのです。

ここにTurbopackを発表します。Webpackの後継となるRustベースのツールです。

fig

大規模なアプリケーションでは、TurbopackはViteよりも10倍速く、Webpackの700倍も高速です。さらに大きなアプリケーションであれば、その差はさらに開くでしょう。

fig

このスピードアップは、コードの更新時だけでなく、ローカルで開発サーバーを立ち上げる際にも有効です。

例を見てみましょう。3000個のモジュールを持つ大規模なアプリケーションを扱う場合でも、Turbopackは1.8秒で起動します。Next.jsの以前のバージョンや他の一般的なツールよりも高速です。

fig

ローカルとクラウドの両方でビルドを強化していく

Turbopackの性能は、Rustで開発され、高度に最適化されたマシンコードと低レベルのインクリメンタルエンジンによるものです。Turbopackは一度実行したタスクは二度と実行しないのです。

Turbopackはまず、React Fast Refresh(新野注:実行中のアプリケーションでもコンポーネントを編集できる機能)を含むローカルでの開発体験に焦点を当てますが、最終的にはローカルとクラウドの両方でNext.jsのビルドを強化する予定です。

fig

Tuborepoと同様に、ローカルマシンだけでなく組織全体においてチーム内で既に実行された作業内容を共有できます。

ぜひNext.js 13にアップグレードして「next dev –turbo」を実行し、Turbopackのアルファ版をぜひお試しください。

fig
fig

Next.js Conf 2022

  • Next.js 13登場、動的なWebサイトの実現を強化。複数ページでの動的データの共有や、ステートを維持した共通ナビゲーションの構築など容易に。Next.js Conf 2022
  • Webpackの後継となる新バンドルツール「Turbopack」が登場。Rust製のネイティブアプリケーションでWebpackの700倍高速に。Next.js Conf 2022

COMMENTS


Recommended

TITLE
CATEGORY
DATE
ウェルネット、研修会事業の機密データの2次バックアップ先にクラウド採用
IT関連
2022-01-21 21:35
「会員制バーチャル墓地」、東京芸大発ベンチャーが発表 虹彩由来のアートをブロックチェーンに記録
企業・業界動向
2021-05-21 16:34
NEC、モバイルネットワーク向け高精度QoE予測技術を開発
IT関連
2024-06-13 09:49
脅威アクターのネットワーク潜伏期間が長期化–高まるリスク
IT関連
2022-06-17 13:42
企業の約4割がIT予算の多くをAIに投資、「成果なし」も約4割–シスコ調査
IT関連
2024-11-27 19:32
プログラミングのためのBGMや環境音/Slackにプロジェクト管理機能が追加/Google、超高速に評価可能な式言語発表ほか、2024年6月の人気記事
編集後記
2024-07-05 18:33
「全人類上司化計画」を唱えるウイングアーク1stの田中社長の思い
IT関連
2021-04-28 01:20
AI導入の成功を左右するデータ品質の管理がより重要に–インフォマティカ・渡邉社長
IT関連
2024-01-06 09:41
ヘルスケア企業の意思決定結果を予測するLumiataが14.5億円調達
ヘルステック
2021-01-17 02:51
マイクロソフト、「Azure」のコンフィデンシャルコンピューティングでAMDと提携
IT関連
2021-03-16 21:25
ワークスアプリケーションズ、ERPと「Microsoft Copilot」の連携を開始
IT関連
2024-07-10 14:46
工業用切削液のand mark、案件管理に「Zoho CRM」を導入–CRM活用で事業成長を加速
IT関連
2025-02-05 06:31
生き残りの施策にマイナスイメージ–アクセンチュア、「顧客との認識ズレ」に警鐘
IT関連
2024-03-08 17:22
「量子ネイティブ」育成に向けた「Q-LEAP 量子技術教育プログラム」公式サイトが公開
EdTech
2021-03-27 15:03