こんにちは、私の名前は王富鵬です。
私はシニア フルスタック エンジニアであり、17.5k のオープンソース プロジェクト PMP の作成者です。現在、Notion スタイルのナレッジ ベースを開発しています
React Nextjs と Supabase を使用した、AI の作成とコラボレーションを含む HuashuiAI。
2 か月前、Vue と Vite の作者 Evan You は VoiceZero 会社の設立を発表し、数百万ドルの投資を受けました。
VoidZero は Vite に基づいており、フロントエンド JS ツールチェーンを統合するために、Rolldown と Oxc という 2 つの主要なツールを開発します。断片化、非互換性、低効率などの問題を解決します。
VoidZero コア ツールは Rust 言語で開発されており、高い実行効率と高速性を備えています。
JS ツールチェーンには主に、セマンティック分析、トランスフォーマー、リンター、トランスフォーマー、ミニファイアー、バウンダーなどのプロセスが含まれています。
私たちは現在、この種のツールをどのように使用していますか?現在利用可能なツールは何ですか?彼らの間にはどのような関係があるのでしょうか？本当に非効率で断片化しているのでしょうか?以下、一つずつご紹介していきます。
これらの関係はやや混沌としており、コンパイルとパッケージ化が可能なものもあれば、重複する関数が多数あるため、強制的に分類して比較する必要はないことに注意してください。
いわゆるランタイムとは、言語の実行環境を指します。ランタイムがない場合、言語は単なる文字列または文字列ファイルであり、解析して実行することはできません。
// Nodejs Deno 或 Bun，都是写 JS 代码
const server = Bun.serve({
port: 3000,
fetch(request) {
return new Response("Welcome to Bun!");
},
});
console.log(`Listening on localhost:${server.port}`);
注: JS ランタイムは JS ツールチェーンの一部ではなく、最も基本的な機能にすぎませんが、これらのツールと用語を理解すると、JS ツールチェーンと区別するのに役立ちます。使用したことがないかもしれませんが、その存在とその機能を知っておく必要があります。
最新のブラウザはまだ TS JSX と最新の ES コードを直接実行できないため、Web フロントエンド開発ではさまざまなブラウザとの互換性を考慮する必要があります。
したがって、開発環境の TS JSX ES およびその他のコードを、ブラウザ (通常は ES5) で実行できる JS コードに変換する必要があります。
Babel は、豊富なエコシステムとプラグインを備えた JS を使用して開発され、この仕事を最初に実行したものの 1 つであり、長い間 webpack ロールアップなどのパッケージ化ツールに統合されてきました。
ただし、Babel は JS で開発されているため、実行効率は比較的低くなります。さらに、Babel は TS JSX をコンパイルするときに手動で構成する必要があり、これは非常に面倒です。
SWC は Rust 言語で開発された JS コンパイラーで、Babel よりも 20 ～ 70 倍 (異なる CPU 上で) 高速で、TS および JSX 構文をネイティブにサポートし、Babel を置き換えることを目指しています。 Vite は内部で SWC を使用しています。
Rspack は Rust 言語を使用して開発されていますが、単なる JS コンパイラーではありません。効率性の高い総合的なパッケージングツールです。
Rspack と同様、ESBullid は Go 言語を使用して開発されており、JS コンパイラーを含む包括的なパッケージ化ツールであるため、非常に効率的です。
このセクションで一般的に使用されるのは ESLint と Prettier ですが、それらの使用法にはいくつかの混乱もあります
UglifyJS は、JS コードの圧縮に最初に使用されたものの 1 つであり、現在、そのダウンロード量も非常に大きくなっています。
Terser は UglifyJS ソース コードに基づいて開発され、ES6 の新しい構文をサポートし、ツリーの揺れを最適化します。
ただし、SWC や esbulid などの新しいツールは JS コード圧縮もサポートするようになり、実行効率が向上しました。結局のところ、Rust や Go は本質的に JS よりもはるかに高い実行効率を持っています。
私たちが最も頻繁に接触するのは、Webpack Vite や Parcel などのパッケージャーです。後者は一般的には使用されないかもしれませんが、十分に確立されたツールでもあります。
Vite は、非常に効率的な SWC をインタープリターとして使用します。開発環境でのパッケージ化には esbulid を使用し、運用環境でのパッケージ化にはロールアップを使用します。
一方、esbulid (前に紹介したように Go 言語で開発) と rollup はパッケージ化ツールとして個別に使用することもでき、多くのサードパーティ JS プラグインは rollup を使用してパッケージ化されています。
Turbopack は、Next.js プロジェクト用に Rust を使用して Vercel によって開発された JS パッケージ化ツールであり、単独で使用することもできます。
Rspack は、Rust (JS コンパイラとともに) を使用して開発された JS パッケージング ツールで、webpack を置き換えることができ、非常に高速です。
SWC は独自のパッケージング ツール swcpack も開発しています。非常に多くのツールがあるので、面倒だと思いませんか?断片的ですか?
なぜこれほど多くのツールを Rust 言語で開発する必要があるのか、不思議に思われるかもしれません。ポイントは大きく2つあります
JS ツールチェーンに関する 3 つの問題を振り返る
Vue の作者である Evan You は鋭い観察力を持っており、非常に正確に観察し、問題を直接指摘することができます。さらに、このパート、つまりヴィートにおいては強力なアドバンテージとグリップ力を持っている。現在、Vite には多数のユーザーがおり、優れたエントリーポイントとして機能します。
Vue などの Web フレームワークや Vite などの単一ツールが開発中にボトルネックに遭遇した場合、Evan はこの循環から抜け出し、より高いレベルの問題を発見し、それらを現場で実行できるようになります。これは私たちが学ぶべきことです。
最後に、VoidZero は多額の投資を行っているため、投資収益率が必要です。今後どのように商品化されるのでしょうか？ Vite に直接課金することは不可能なので、どうやってお金を稼ぐことができますか?
フォローしてください。次のセクションで詳しく分析します。これはテクノロジーやコードよりも価値があります。
ところで、私は国際的な仕事の機会を探しています。機会があれば、私の Github プロフィールに連絡してください。
以上がEvan You は VoidZero を作成して何をしていますか?また、JS ツールチェーンにはどのような問題がありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
