キーポイント
- WebAssembly has perhaps been the most talked about trend on the web since our last report. Applications for WebAssembly have moved beyond the browser via WASI, and WebAssembly reached a stable 1.0 W3C Recommendation in late 2019. We have thus promoted WebAssembly to Early Adopters status.
- The annual ECMAScript release, ES2020, is approaching with the greatest number of new language features since ES2015, including optional chaining, BigInt, globalThis, nullish coalescing, and dynamic import. All of these features are considered stable with at least two working browser implementations.
- Web components have moved from early adopter to early majority status. Web components have reached mainstream maturity and are now supported natively in Chrome, Firefox, Safari, and other browsers based on these browser engines such as Edge and Brave
- TypeScript has graduated to late majority status. TypeScript is by far the most widely adopted JavaScript variant, has made substantial progress over the past few years, and a majority of JavaScript frameworks now leverage its tooling and infrastructure.
- The JavaScript client-side framework and library space is constantly changing, and while React, Vue.js, and Angular have dominated in recent years, a new wave of leaner frameworks and application compilers may change the status quo over the next few years.
InfoQでは、定期的にトピックグラフを更新して、さまざまなトピックがテクノロジー採用曲線のどこにあると考えるかを示しています。その際、ネットワーク内や会合、会議、アナリストイベントなどで聞いた実践状況、新たなアイデアや事柄を考察します。また、サイトのトラフィックパターンやQConや他の業界カンファレンスなどのセッションへの出席者数も考慮します。
トピックがグラフの右側にある場合は、おそらくInfoQの既存のコンテンツを多く見つけるでしょう。 – InfoQは新しいうちにそれをカバーしています。また、イノベーターとアーリーアダプタが学んだ教訓は、個人、チーム、組織がこれらのアイデアや実践を採用するときに、ガイドとして利用できます。
曲線の左側のトピックは、イノベーターやアーリーアダプタが使用している現在存在感を増しているトピックであり、InfoQのレポートやコンテンツは、これらのアイデアを読者に届けることに重点を置いており、読者は、今、これらのアイデアを探求すべきか、それともその展開を待つべきかをご自身で判断していただけるようになっています。
レポートは、InfoQ編集チームが現在JavaScript/Web開発スペース内でのテクノロジーの採用と存在感を増しているトレンドをどのように見ているかの概要を提供します。これは、アクティブなソフトウェアエンジニア自身である編集者との広範な内部ディスカッション、外部のパブリックサーベイ結果のレビュー、内部またはプライベートのサーベイおよび分析結果のレビュー、およびWebコンポーネントなどの主要なテクノロジーのブラウザのサポートレベルの確認から形成された意見です。
今月はJavaScriptとWeb開発に注目します。急速に変化するこの業界では、年に1回以上の更新が必要です。これは、2018年の第4四半期にグラフを最後に確認したときのグラフです。
JavaScriptとWebエコシステムがどれほど成長したかを考えると、1つのグラフにすべての領域を表示することはもはや現実的ではありません。その結果、分析を11の主要分野に分割しました。
- Web開発 言語 / 標準 / パターン
- Web開発 クライアントサイドフレームワーク / ライブラリ
- Webエンジニアのためのサーバサイドプラットフォーム / フレームワーク / データ / API
- Webエンジニアのためのクラウド
- パッケージ管理 / バンドル / 最適化
- Web開発のテストと自動化
- Webエンジニアのためのモバイル / デスクトップ環境とフレームワーク
- WebエンジニアのためのIoT / ブロックチェーン / 機械学習
- WebエンジニアのためのVisualization / XR
- CSS
- Web開発 コードエディタとIDE
Web開発は私たちにとって常に興味深いものであり、新しいJavaScriptプロジェクトがほぼ毎日開始されています。どれに焦点を当て、どれを無視するかを決定することは、特に困難です。開発者は、日々の開発作業で現在使用していない場合でも、興味深いアプローチから学び、インスピレーションを得ることができます。
Web開発 言語 / 標準 / パターン
イノベーター(Innovators)
ECMAScriptの年次リリースであるES2020は、オプションのチェーン、BigInt、globalThis、nullish coalescing、動的インポートなど、ES2015以降で最も多くの新しい言語機能に近づいています。これらの機能はすべて、少なくとも2つの有効なブラウザ実装で安定していると見なされます。
PureScriptはTypeScriptの代替言語を提供します。最近のJavaScript 2019の調査では高得点を記録しましたが、近い将来にイノベーターのステータスを超えて進むかどうかについては議論があります。
アーリーアダプタ(Early Adopters)
アーリーアダプタを見て、JavaScriptの静的型チェッカーであるFlowと、JavaScriptベースのWebアプリを生成するためのJavaScriptの代替言語であるElmとReasonを引き続き追跡します。TypeScriptの台頭により、Flowの関心と開発は衰えたように見えますが、変化に備えて追跡しています。
前回のレポート以来、WebAssemblyはおそらくWebで最も話題になったトレンドでした。WebAssemblyのアプリケーションはWASIを介してブラウザを超え、WebAssemblyは2019年後半に安定した1.0 W3C勧告に達しました。これにより、WebAssemblyをアーリーアダプタのステータスに昇格させました。
従来のW3Cプロセスに加えて、Web Incubator CG (WICG)は、幅広い新機能と可能な標準を提案し続けています。また、Web Audioは、Webプラットフォームをさまざまなオーディオアプリケーションで実行可能にするために、引き続き注目を集めています。
アーリーマジョリティ(Early Majority)
関数型およびリアクティブプログラミングパターンは、JavaScriptアプリケーションを最も効率的に構築する方法に関する議論を支配し続けています。Vue.jsの創設者であるEvan You氏は、プロジェクトがTypeScriptに切り替えられたとしても、「皮肉にもTypeScriptはクラスを使用するよりもクラスを回避するのに役立つと思います。Vue3は、クラスの使用が0の100％TSコードベースです。」
Webコンポーネントはアーリーアダプタからアーリーマジョリティステータスに移行しました。Webコンポーネントは成熟した主流になり、ネイティブにサポートされるChrome、Firefox、Safari、およびEdgeやBraveのようなこれらのブラウザエンジンに基づくブラウザでサポートされました。多数のフレームワークとライブラリも、Angular、Dojo、Ionic、Stencil、Svelte、Vue.jsなどがWebコンポーネントをネイティブにサポートしています。
ES2019とAMPの2つのアイテムをアーリーマジョリティカテゴリに直接追加しました。
ES2019は、#smooshgate論争、Object.fromEntries、および文字列とオプションのキャッチバインディングに対するいくつかの小さな改善の後に、flatとflatMapメソッドを配列に追加しました。この比較的小さな新しい機能セットは、JavaScript開発者のアーリーマジョリティによって現在使用されています。
AMPは、Webの高速化を目指す代替手段であり、OpenJS Foundationに参加しました。InfoQはこれまでこれを採用することに抵抗し、既存のオープンWeb標準を使用することを好みましたが、AMPは引き続きメディアやニュースWebサイト全体で採用を続けています。
レイトマジョリティ(Late Majority)
JavaScriptエコシステムが成熟するにつれ、置き換えられたサインを示さないレイトマジョリティカテゴリーの基盤テクノロジーがあり、ほとんどすべてのJavaScript開発者によって使用されています。
HTML5とES6/2015 - ES2018はレイトマジョリティです。今日、ほぼすべてのWebアプリケーションがこれらの機能を最小ベースラインとして使用しているためです。
TypeScriptもレイトマジョリティステータスに卒業しています。TypeScriptは、これまでで最も広く採用されているJavaScriptバリアントであり、過去数年間で大幅な進歩を遂げており、JavaScriptフレームワークの大部分は現在、そのツールとインフラストラクチャを利用しています。TypeScript自体は、最近のGitHub Octoverseレポートによると、上位10言語の1つであり、JSの現状調査では、TypeScriptが最も広く使用されているJavaScriptバリアントとしてリストされており、調査対象の50％以上がTypeScriptを使用しており、 JavaScriptのスーパーセットについて好意的な意見があります。
ラガード(Laggards)
私たちは、多くのアプリケーションでまだ使用されているが、新しい開発の取り組みには大きな関心を寄せていない、ラガードでレポートを締めくくります。ES5とHTML4に取って代わったのは新しいバージョンですが、ES5とHTML4の基礎となる機能は、JavaScriptとHTMLの最新バージョンに見られる多数の機能で構成されています。
Web開発 クライアントサイドフレームワーク / ライブラリ
JavaScriptのクライアントサイドフレームワークとライブラリは常に変化しており、近年はReact、Vue、Angularが主流を占めていますが、よりスリムなフレームワークとアプリケーションコンパイラの新たな波が今後数年間で現状を変える可能性があります。
イノベーター(Innovators)
Vue.js 3はこのレポートの時点では出荷されていませんが、TypeScriptを使用してリライトされるVueは非常に期待されます。
アーリーアダプタ(Early Adopters)
Dojoは引き続き、無駄のないTypeScriptファーストのフレームワークを提供するための道を歩んでいます。Dojoは、リアクティブWebアプリケーションを構築する上で非常に現代的な効率的な手法を提供し、TypeScriptと開発者の人間工学を強く取り入れています。DojoはOpenJS Foundationの一部です。
Emberは先頃、新しいコンポーネントモデルとリアクティブシステムを提供するEmber Octaneを発表しました。
LitElementはPolymerの後継で、軽量のWebコンポーネントを作成するためのJavaScriptライブラリを提供します。
Aureliaは引き続き忠実なファンを獲得しており、コンポーネントベースのアプリケーションを構築するための環境を作成するための作業を続けています。
Markoは、元々eBayで開始された別のOpenJS Foundationプロジェクトで、リアクティブUIコンポーネントの作成に重点を置いています。
TencentによるOmiは、Webコンポーネント、JSX、および統合ライブラリへのその他のコンポーネントアプローチをサポートするクロスフレームワークコンポーネント作成ライブラリです。
アーリーマジョリティ(Early Majority)
アーリーマジョリティカテゴリで3つのプロジェクトがデビューします。
IonicのStencilは、最も人気のあるWebコンポーネント作成フレームワークになり、多くのフレームワークで使用するコンポーネントを作成するためのフレームワークであるOmiに似ています。
Svelteは、HTMLとの連携と、Disappearingフレームワークへのアプローチにより、Reactに代わる人気の高いものになっています。
Preactは、ReactライブラリへのAPIパリティ付きのReactの4 KB未満のgzip圧縮された代替手段です。
レイトマジョリティ(Late Majority)
Angularはこのレポートの時点でリリース候補のステータスにあり、レイトマジョリティステータスに移行し、ついに待望のIvyレンダリングエンジンのアップデートが出荷されました。
Vue.js 2はまた、レイトマジョリティステータスに移行し、現在最も広く使用されているJavaScriptフレームワークの1つです。
Reactは依然として最も人気のあるJavaScriptレンダリングライブラリであり、前回のHooksのレポート以降、更新されています。
RxJSは引き続き人気のあるリアクティブ拡張ライブラリであり、Angularエコシステムで広く使用されています。
OpenJS Foundationの一部であるMomentは、日付と時刻の問題を管理するために最も広く使用されているライブラリです。
Lodash（OpenJS Foundation）などのライブラリーの必要性は減り始めていますが、JavaScriptを操作するために広く使用されているライブラリーです。Core-jsは、最新のJavaScriptを操作するために広く使用されているライブラリでもあります。
ラガード(Laggards)
Dojo 1.xとAngular 1.xはまだ広くデプロイされていますがメンテナンスモードです。jQueryは、いくつかの改善点はありますが、ほとんどが新しいHTMLおよびJavaScript機能、またはより本格的なフレームワークに置き換えられています。
Webエンジニアのためのサーバサイドプラットフォーム / フレームワーク / データ / API
JavaScriptのサーバサイドエコシステムは、最近多くの関心を集めています。重要な革新の1つは、サーバサイドレンダリング、静的な事前レンダリング、ビルド時のレンダリングに移行し、現在のアプリケーションで使用されているリアクティブプログラミングモデルを変更することなく、クライアントサイドのJavaScriptワークロードを削減することです。
サーバサイドとAPIとクライアントサイドの違いは曖昧であるため、このカテゴリには、静的な生成、データ、状態管理、およびクライアントサイドとサーバサイドの間で共有されることが多いAPIアプローチも含まれます。
イノベーター(Innovators)
Denoは1.0リリース近くです。元のNode.js作成者であるRyan Dahl氏によって作成されたDenoは、Node.jsに代わるTypeScriptの作成に努めています。
Dojoは、ビルド時レンダリングアプローチを追加しました。これにより、アプリケーションのビルド時にNode.js機能を利用できるようになり、静的なサイト生成のためのさまざまな機能が可能になります。他のソリューションと比較して、Dojoのアプローチはコンポーネントレベルで機能し、主要なパターンと機能のブロックを備えた非常に再利用可能なアプローチを提供します。さらに、Dojoストアは、一般的な状態管理パターンのサポートが組み込まれた、予測可能で一貫性のある状態コンテナを提供します。
Hasuraは、GraphQLサーバを作成するためのいくつかのオープンソースオプションの1つです。State of JS 2019 Rising Starsレポートによると、2019年にはHasuraへの関心が大幅に高まりました。
アーリーアダプタ(Early Adopters)
最初にExpressを作成したチームによって開発されたNode.jsフレームワークであるKoaへの関心は、引き続き関心を集めています。
Nuxtは、サーバ側レンダリング、静的サイト生成、または単一ページアプリを提供するVue.jsフレームワークです。
StrapiとStoryblokは、オープンソースのヘッドレスコンテンツ管理システムです。組織が今日のリアクティブ、コンポーネントベースのアーキテクチャで最新のコンテンツ管理オプションを提供しようと努めているため、この分野は大きな関心を集めています。
ApolloはGraphQLの人気のあるオプションであり、もともとMeteorフレームワークから登場しました。
アーリーマジョリティ(Early Majority)
Nest.jsはTypeScriptで作成されたNode.jsフレームワークで、フルスタックのTypeScript開発を可能にするためのさまざまなオプションと機能により、人気が急速に高まっています。
Next.jsは、Reactアプリケーションのサーバサイドフレームワークであり、サーバサイドレンダリング、静的サイト生成などをサポートしています。
GatsbyはGraphQLを活用してさまざまなソースからデータを取得し、Reactベースのアプリケーションに効率的なレンダリングオプションを提供します。
FastifyはOpenJS Foundationプロジェクトであり、高性能のNode.js WebフレームワークとしてExpressに代わる新しい選択肢です。
MobXは、採用され続けているReduxの代替の状態管理です。
レイトマジョリティ(Late Majority)
Node.jsはサーバサイドでJavaScriptを実行するためにこれまでで最も広く使用されているアプローチであり、Electronのような環境でWebテクノロジーを使用してデスクトップアプリケーションを作成するための基盤でもあります。Node.jsはOpenJS Foundationの一部です。
Expressは現在でも最も広く使用されているNode.js Webフレームワークであり、OpenJS Foundationプロジェクトでもあります。
RESTは依然としてAPIを作成するために最も広く使用されているアプローチですが、GraphQLは、すべてのAPIエンドポイントを事前に定義する代わりに、クエリベースの代替手段として大きく採用されています。組織がAPIへのアプローチでRESTとGraphQLを一緒に活用することも一般的です。
Reduxは、JavaScriptアプリケーションの状態管理に最も広く使用されているアプローチですが、小規模または単純なアプリケーションではあまり使用されていません。
Webエンジニアのためのクラウド
Webエンジニアがクラウドベースのアプリケーションを作成および展開するのに役立つ幅広いソリューションが登場しました。
イノベーター(Innovators)
Architectは、サーバレス JavaScript、Python、Rubyアプリケーションの作成をサポートするOpenJS Foundationプロジェクトです。
アーリーアダプタ(Early Adopters)
AWS Amplifyは、AWSでモバイルおよびウェブアプリケーションを構築するための開発プラットフォームを提供します。
Netlifyは、Webアプリケーションを迅速に展開するための一般的な選択肢の1つです。
Azure SDK for JavaScriptは、その柔軟なIoTおよびCognitive Services APIにより、主に人気が高まっています。
アーリーマジョリティ(Early Majority)
AWS Lambdaは、サーバレスJavaScript関数を実行することで人気が高まり続けています。
Zeit Nowは、静的およびJAMstackデプロイメント、サーバレス機能、およびグローバルCDNとして、Webアプリケーションをデプロイする一般的な方法です。
Google Cloud Functionsは、サーバレスJavaScript関数を実行するためのGoogleクラウドアプローチを提供します。
Googleのもう1つのサービスであるFirebaseは、クラウドベースのモバイルおよびWebインフラストラクチャを提供します。
パッケージ管理 / バンドル / 最適化
バンドル、パッケージ管理、および全体的なアプリケーションの最適化は、JavaScriptおよびWebアプリケーション開発における重要なトピックであり続けます。
イノベーター(Innovators)
pikaは、ESモジュールでサポートされている環境で構築およびデプロイされるJavaScript用のツールを提供することに焦点を当てています。
Entropicは、単一のフェデレーションレジストリではなく、より分散されたパッケージ登録アプローチを備えたnpmの初期段階の代替手段です。
アーリーアダプタ(Early Adopters)
Parcelは、ますます人気のあるWebアプリケーションバンドルです。このレポートの時点で、Parcel 2はリリースの準備がほぼ整っています。
webhintは、アクセシビリティ、速度、およびブラウザー間の互換性を改善するためのリンティングツールを補完するOpenJS Foundationプロジェクトです。
アーリーマジョリティ(Early Majority)
Prettierは、JavaScript開発でのコードのフォーマットに関するほとんどの議論を終わらせた独断的なコードフォーマッタです。
ESLintは、JavaScriptアプリケーションのエラーとアンチパターンを見つけるための豊富なアプローチを提供する別のOpenJS Foundationプロジェクトです。スタンドアロン製品としてのTSLintは非推奨となり、ESLintの拡張機能になりました。
Esprimaは、抽象構文ツリーの操作を支援するために広く使用されているECMAScriptパーサであり、OpenJS Foundationの一部でもあります。
Yarnは、npmパッケージレジストリを利用するnpmの代替パッケージマネージャです。
Rollupは、Svelteと同じチームメンバによって作成されたESモジュールバンドルです。Rollupはライブラリとモジュールに広く使用されているのに対し、webpackはアプリケーションに一般的に使用されています。
レイトマジョリティ(Late Majority)
NPMは、JavaScriptの事実上のパッケージマネージャーおよびレジストリです。npmは2019年にさまざまな論争に直面し、エコシステムは近い将来代替案を探す可能性があります。
webpackは、JavaScriptエコシステムで最も広く使用されているモジュールバンドルおよびコードオプティマイザです。
BabelはJavaScriptトランスパイラを提供し、開発者は開発で新しい言語機能を使用できますが、本番環境では古いバリアントにデプロイできます。Babelは最近、TypeScriptトランスパイレーションも追加しましたが、型チェックを提供しないため、用途が限られています。
Lighthouseは、Googleがアプリケーションコードの品質とパフォーマンスを向上させるために作成した、広く使用されている自動化ツールです。
Web開発のテストと自動化
JavaScriptでテストを作成および実行するための多くのオプションがあります。簡潔にするために、Chai、Sinon、Jasmine、QUnit、Cucumber、および非常に便利で人気のあるテスト機能を提供する他の同様のライブラリの分析を除外しましたが、これらのライブラリおよび他の多くのテストソリューションの進歩を引き続き追跡しています。
イノベーター(Innovators)
Playwrightは、ブラウザの自動化とテストのためのPuppeteerに新しくリリースされた代替手段です。Puppeteerとは異なり、Playwrightはすべての最新のブラウザーレンダリング環境を対象としています。
機械学習ベースのテストは、テストの生成を自動化する新しい分野です。Applitools、SauceLabs、Testim、Sealights、Test.AI、Mabl、ReTest、ReportPortalなど、この問題を解決しようとする企業があり不足しているわけではありません。この分野には明確な正解はありませんが、近い将来に変わると予想されます。Visual AIテストは、従来のビジュアル回帰テストの代替としても登場しています。
アーリーアダプタ(Early Adopters)
Appiumは、Seleniumから登場したW3C WebDriverプロトコルを使用した、ネイティブ、ハイブリッド、モバイルのWebアプリ用のテスト自動化フレームワークです。AppiumはOpenJS Foundationプロジェクトです。
Internは、ユニット、機能 (WebDriverを介して、またはPuppeteerやPlayrightのような他の環境で) 、統合、パフォーマンス、およびその他の種類のテスト用にTypeScriptで作成されたOpenJS Foundationプロジェクトです。
Avaは、Node.jsアプリケーションの人気のあるテストランナーです。
WebdriverIOはOpenJS Foundationプロジェクトであり、WebDriverプロトコルに基づく機能および統合テスト環境を提供します。
アーリーマジョリティ(Early Majority)
Cypressは、最近FirefoxとEdgeのサポートを追加したChromiumベースのブラウザ内のエンドツーエンドのテストランナーとして急速に人気を博しています。
Storybookは、UIコンポーネントを作成、テスト、共有するためのテストフレームワーク、デザインシステム、開発環境の一部です。
レイトマジョリティ(Late Majority)
Jestは、Reactエコシステムによって一般化されたテストフレームワークであり、今日最も広く使用されているテストアサーションライブラリです。
MochaはOpenJS Foundationプロジェクトであり、シンプルで使いやすい単体テストライブラリを提供します。
KarmaとProtractorは、引き続きAngularアプリケーションをテストするための一般的なアプローチです。
Seleniumプロジェクトから生まれたプロトコルであるWebDriverは、ブラウザと対話して完全なテスト自動化を行う最も一般的な方法であり続けます。
PuppeteerはChromiumのみのブラウザオートメーションアプローチであり、Seleniumよりも操作が簡単ですが、機能とサポートされているブラウザーの両方で使用が制限されています。
Webエンジニアのためのモバイル / デスクトップ環境とフレームワーク
モバイルおよびデスクトップアプリケーションを構築するためのWebテクノロジーの活用は、人気とオプションの両方で増え続けています。
イノベーター(Innovators)
Ionic CapacitorはCordovaに代わるもので、ハイブリッドアプリケーションの作成でWebテクノロジーとネイティブテクノロジーを活用するタイミングをより細かく制御できます。
アーリーアダプタ(Early Adopters)
NativeScriptは、AngularおよびVue.jsアプリケーション用のWebテクノロジーを使用したネイティブアプリケーションのコンパイルを提供します。
アーリーマジョリティ(Early Majority)
Ionic 4+は、アプリケーションを構築するためのフレームワークとコンポーネントライブラリを提供します。当初はAngularフレームワークとして開始されましたが、Ionicはフレームワークにとらわれず、Reactおよびその他のフレームワークをサポートしています。
React Nativeを使用すると、開発者はReactアプリケーションにあるWebテクノロジーとパターンを利用してネイティブアプリケーションを作成できます。React Nativeと他の同様のソリューションは、いくつかのシナリオではうまく機能するが、使いこなすのが難しいため、これまでさまざまなレビューが寄せられています。
Electronは、ChromiumとNode.jsを埋め込むことにより、Webテクノロジーを使用してデスクトップアプリケーションを作成するためのOpenJS Foundationプロジェクトです。日常的に使用するSlackなどの多くのアプリケーションは、Electronを活用しています。
レイトマジョリティ(Late Majority)
Cordovaは、ハイブリッドモバイルアプリケーションを作成するために広く使用されている環境ですが、近い将来、ラガードになるリスクがあります。
WebエンジニアのためのIoT / ブロックチェーン / 機械学習
IoT、ブロックチェーン、機械学習などの新興分野でのWebテクノロジーのオプションは増え続けています。
イノベーター(Innovators)
ml.jsは、JavaScript開発者に幅広い機械学習ツールを提供します。brain.jsは、JavaScriptでGPU高速化ニューラルネットワークをサポートします。TensorFlow.jsはJavaScript開発者にとって最も広く使用されている機械学習の基盤ですが、これら2つのライブラリは有望な代替手段を提供します。
Neurosityには、現代の思考コンピューティングおよび脳波測定デバイスであるNotionの開発者プレビューがあります。Neurosityを他と違うのは、JavaScriptのAPIです。
アーリーアダプタ(Early Adopters)
ModdableとJerryScriptは、IoTプロジェクト用の軽量ECMAScriptエンジンです。JerryScriptはOpenJS Foundationプロジェクトです。
OpenJS Foundationの一部であるNode-Redは、よくあるIoTでのイベント駆動型アプリケーションに低コードプログラミングを提供します。
johnny-fiveは、Bocoupによって開始された人気のあるJavaScriptロボットとIoTプラットフォームです。
interledger.jsは、InterledgerプロトコルのJavaScript実装です。これは、元帳、ブロックチェーン、および暗号通貨の実装にとらわれない標準のセットです。このプロジェクトはOpen JS Foundationの一部です。
アーリーマジョリティ(Early Majority)
TensorFlow.jsはGoogleによって開始され、現在機械学習で最も広く使用されているJavaScriptパッケージです。
WebエンジニアのためのVisualization / XR
拡張現実、仮想現実と複合現実の使用がJavaScriptで人気を集めています。
d3とThree.jsを超えた、データの視覚化、グラフ化、および視覚化とレンダリングへの他のアプローチは、多くのプロジェクトにわたって高度に断片化されています。
アーリーアダプタ(Early Adopters)
React 360は、Reactと同様のアプローチで開発者に複合現実体験を提供します。
WebXR 1.0勧告は最近拡張され、拡張現実標準を定義する作業が残っています。
BablyonJSは、JavaScriptおよびTypeScript開発者向けの没入型ゲームを作成するための3D視覚化およびAPIを提供します。
アーリーマジョリティ(Early Majority)
Three.jsは、ブラウザでの3D描画のためのWebGL上の低レベルAPIです。
A-Frameは最近、WebXR勧告の予備サポートとともに1.0リリースに達しました。A-Frameは、Three.jsまたはネイティブWebXR機能をラップするDOMベースのアプローチを提供します。
pixi.jsは、ゲーム開発用のプリミティブを提供する別のWebGL抽象化フレームワークです。
レイトマジョリティ(Late Majority)
d3は、現在広く使用されているデータ視覚化ライブラリです。
CSS
CSSとデザインは、過去数年にわたって大幅な革新を遂げており、5〜10年前に作成されたCSSにはほとんど認識されない多くの方法があります。
イノベーター(Innovators)
Algorithmic CSSは、組み込みCSSアルゴリズムを利用して構成可能なレイアウトを構築する新しいアプローチです。
アーリーアダプタ(Early Adopters)
CSS Houdiniは、CSSオブジェクトモデル（CSSOM）を介したブラウザのレンダリングエンジンのスタイリングおよびレイアウトプロセスにフックすることでCSSを拡張し、CSSエンジンにアクセスする新たに登場したアプローチです。
Typed CSSは、コンポーネント開発における効率的かつ正確なスタイル設定のために、CSSモジュールにTypeScriptの安全性を提供するためにDojo他が活用するアプローチです。
Ant Designは、最新のコンポーネントの使用と開発に利用できるいくつかの一般的な設計システムの1つです。
TailwindCSSはPostCSSを利用して、低レベルのCSSフレームワークを提供します。
アーリーマジョリティ(Early Majority)
Design Systemsは、組織とプロジェクトがデザイン標準とコンポーネントライブラリを共有および統合して、一貫性を維持し、再利用を促進する非常に人気のある方法になりつつあります。
CSS Gridsは、Webサイトやアプリケーションのグリッドレイアウトを管理するために広く採用されているCSS機能になりつつあります。
PostCSSはCSSプリプロセッサの代替であり、新しいCSS構文をプロダクション環境で必要な環境でサポートされている構文に変換する際にBabelのように機能します。
CSS-in-JSは、コンポーネント内でCSSをインラインでオーサリングするために、主にReactエコシステム内で人気を得ているパターンです。より優れたCSS-in-JS実装では、インラインCSSを個別のCSSファイルに変換して、プロダクション環境でのレンダリングを高速化します。
Material Designは最初の大きなオープンソースの設計仕様とシステムであり、多くのフレームワークやプロジェクトで高い人気を維持しています。
Linariaは、CSS-in-JSで広く採用されているアプローチの1つです。
レイトマジョリティ(Late Majority)
レスポンシブデザインは、携帯電話、タブレット、デスクトップコンピュータ全体でアプリケーションを拡張する必要性から生まれたものであり、アプリケーションを設計するための一般的なアプローチであり続けています。レスポンシブデザインは世界をよりベクトル主導型にすることを奨励しており、世界の大多数の企業が過去10年間にロゴとデザイン標準を更新して、ソフトウェアアプリケーションだけでなく、現実の世界での使用にも対応するレスポンシブ原則をサポートしています。
CSS Flexboxは、アプリケーションレイアウトに広く使用されているモデルです。
SASSは、引き続き最も広く使用されているCSSプリプロセッサです。
Web開発コードエディタとIDE
JavaScriptとWeb開発用のIDEとコードエディタは、柔軟性と機能が向上し続けています。WebベースのIDEも、従来の機能とコラボレーション機能の両方でますます強力になっています。
アーリーアダプタ(Early Adopters)
StackBlitzは、ブラウザでいくつかのクラウドホスト型IDEの1つであり、数年前までデスクトップIDEでのみ可能であった幅広い機能を提供します。
アーリーマジョリティ(Early Majority)
CodeSandboxは、最も広く使用されているクラウドホスト型IDEであり、ブラウザではVS Codeと呼ばれることがよくあります。
レイトマジョリティ(Late Majority)
VS Codeは、その起源がMicrosoftであったために無視されてきたプロジェクトから、JavaScriptとTypeScriptエコシステムで最も広く使用されているIDEに数年で移行しました。
WebStormは、Webアプリケーションを作成するために最も広く使用されている商用デスクトップIDEです。WebStormはIntelliJと同じプロジェクトファミリーに属し、JavaからJavaScriptの世界に入ったエンジニアはIntelliJをよく使用します。
vimとemacsは引き続き人気のあるコードエディタですが、それぞれを一連の拡張機能とツールを備えたIDEに変換できます。ほとんどのvimとemacsのファンは、親しみやすさと効率性で長年の生産性の向上を築いており、別のエディタに切り替えることはほとんどありません。
MicrosoftによるGitHubの買収により、AtomはVSCodeに統合されると予想されていましたが、今のところ、それらは別個のプロジェクトのままです。AtomとVS Codeのどちらも、デスクトップ環境にElectronを活用しています。
Sublime Textは依然として多くの人が使用しているエディターですが、その人気はAtomの最初の登場、そして最近ではVS Codeの登場とともに衰え続けています。
結論
JavaScriptとWebエコシステムは成長しており、変化の速度に追いつくことは難しいかもしれませんが、このドメイン内の多くの基本的な部分が安定し、イノベーションの追加領域を生み出していると信じています。InfoQのチームは、JavaScriptとWebランドスケープの専門的な記事を提供するためにあり、私たちはフィードバック、コメント、および外部の記事の貢献を歓迎します。