2018年以降、JavaScript Open Source Awardsは、毎年4個のカテゴリ ( Breakthrough of the Year、The Most Exciting Use of Technology、Fun Side Project of the Year、The Most Impactful Contribution to the Community ) で影響力のあるオープンソースプロジェクトを区別している。2020年は、6個のオープンソースプロジェクトに贈られた。
DenoとSvelteは、Breakthrough of the Yearのカテゴリの賞を受賞した。
Denoは、Webサイトによると、V8を使用し、Rustに組み込まれている、JavaScriptおよびTypeScript用のシンプルでモダンで安全なランタイムである。2年間の開発の後、Denoは最終的に2020年5月にバージョン 1.0に到達し、プロダクション環境で使用できるようになった。DenoはWebAssemblyをサポートしており、WebAssemblyへのコンパイル言語 (Rust、Go、C++など) で記述されたネイティブライブラリをDenoアプリケーション内で実行できる。
Svelteは、ReactやVueなどと同じようにインタラクティブなWebアプリケーションを構築するためのコンポーネントベースのUIフレームワークである。ReactやVueとは異なり、Svelteはビルド時にアプリケーション用に記述されたコードをコンパイルし、小さくてパフォーマンスの高いコンパイル済みコードの生成に努める。Svelteは最近TypeScriptサポートを追加し、今年はさらに統合が進んだ。wappalyzer.comによると、SvelteはNew York Times、Spotify、chess.com、Philipsや他の多くで使用されている。
Mock Service Workerは、The Most Exciting Use of Technology賞を受賞した。Mock Service Worker (MSW) は、ブラウザとNode用のAPIモックライブラリである。MSWは、それがどのように機能するかを次のように説明した:
ブラウザの使用は、Mock Service Workerを他のツールと区別するものです。Mock Service Workerは、キャッシュの目的でリクエストをインターセプトするService Worker APIを利用して、キャプチャされたリクエストにネットワークレベルのモック定義で応答します。このようにして、アプリケーションはモックについて何も知りません。
MSWは、fetchをモックすることなく、バックエンドを使用することなく、開発、テスト、およびデバッグ時にAPIモックを有効にする。MSWはRESTおよびGraphQLAPIをサポートする。
Pose Animatorは、今年のFun Side Project of the Year賞を受賞した。そのドキュメントによると、Pose Animatorは2Dベクターイラストを取り、PoseNetとFaceMeshからの認識結果に基づいて、含まれている曲線をリアルタイムでアニメーション化する。コンピュータグラフィックスからスケルトンベースのアニメーションのアイデアを借り、それをベクターキャラクタに適用する:
(出典: GitHub project)
PoseNetは、ブラウザでのリアルタイムのポーズ推定の実行をサポートするTensorFlow.jsを使用したスタンドアロンモデルである。MediaPipe Facemeshは、486の3D顔ランドマークからの顔認識を可能にする。
The Most Impactful Contribution to the Community賞は、Perfume.jsに贈られる。ライブラリは、すべてのユーザー中心のパフォーマンスメトリックを測定するためのWebパフォーマンスライブラリとして自己記述する。Perfume.jsは、High Resolution Timeなどの最新のPerformance APIを利用して、実際のユーザーが体験していることを測定するフィールドデータを収集する。収集されるデータには、First Paint (FP) 、First Contentful Paint (FCP) 、Largest Contentful Paint (LCP) 、First Input Delay (FID) 、Cumulative Layout Shift (CLS) 、Total Blocking Time (TBT) 、Navigation Timing、Resource Timingと他が含まれる。収集されたデータは、監視のために分析ツールに送ることができる:
(FCP for www.coinbase.com in the United States, Italy, Indonesia, and Nigeria. 出典: Perfume’s GitHub site.)
Perfumeはさらに、デバイスの機能 (デバイスのメモリ、CPUの数、およびService Workerのステータス) に関連する追加情報を測定データに含める。
最後に、Productivity Booster賞はSnowpackに贈られる。Snowpackは、一定時間 (< 50ミリ秒) でWebアプリケーションを構築するよう努めている。これは、JavaScriptのネイティブモジュールシステム (ESMで知られる) を活用し、開発中にバンドルされていないアプリケーションを提供することで実現する。Snowpackは、プラグインを介してバンドルされたプロダクションビルドをサポートする。Snowpackには、JavaScript、TypeScript、JSX、CSS、および画像ファイルのサポートが組み込まれている。VueファイルとSvelteファイルはプラグインによりサポートされている。
Svelteの作成者であるRich Harris氏は、Svelte Summitカンファレンスで、開発にSnowpackを使用するSvelteの次のバージョン (svelte@next) の進行中の作業の直近のデモを行った。Harris氏は説明した:
開発中にバンドラを使用するプロジェクトが少し時代遅れに見えるようになるのは、もうすぐだと思います。
JavaScript Open Source Awardsは、毎年行われるGitNationが主導するイニシアチブである。GitNationは、React Open Source AwardsとVue Open Source Awardsも管理している。