Google Chromeチームは、ネットワーク速度、CPU、メモリ、その他ウェブプラットフォームシグナルに基づいて、コンポーネントの最適なバージョンをロード・レンダリングするためのAdaptive Loadingを発表した。
Network Information APIは待望の機能だ。Chrome for Android、Firefox for Android、Chrome、Chromiumベースのデスクトップブラウザなどでサポートが始まっている。これは現在検討中の各種Adaptive Loadingパターンの1つにすぎない。他にも、バッテリーレベル、使用可能メモリ、デバイスの能力、ハードウェアの同時実行性などがある。
こうしたアプローチをReactコンポーネントで試してみたい人のために、Adaptive LoadingプロジェクトにはReact Adaptive Loading Hooks and Utilitiesも含まれている。
Chromeのチームがこうしたコンセプトを実験するのは初めてではない。たとえば、ソフトウェアエンジニアのTheodore Vorillas氏は、2019年はじめにAdaptive Component提供のためにNetwork Information APIの実験を始めているし、ソフトウェアエンジニアのNetanel Basal氏は、2018年後半にConnection-Aware Angularコンポーネントの検討を始めていた。
それぞれ、能力に基づいてエクスペリエンス提供のオプションを調べている。たとえば、Network-Aware Adaptiveメディアローダーは、コネクション速度（slow-2g、2g、3g、4g、default）を調べて、低速なコネクションに適した解像度の画像をロードするか、4G以上で動画をロードするかを判断できる。
let media;
switch (effectiveConnectionType) {
case 'slow-2g':
media = <img className='responsive' src={minResImage} alt='low resolution' />;
break;
case '2g':
media = <img className='responsive' src={mediumResImage} alt='medium resolution' />;
break;
case '3g':
media = <img className='responsive' src={maxResImage} alt='high resolution' />;
break;
case '4g':
media = <video className='responsive' src={video} controls />;
break;
default:
media = <video className='responsive' src={video} controls />;
break;
}
Network Connection APIやBattery Status APIなどのパフォーマンスAPIが採用されるようになれば、パフォーマンスに適したエクスペリエンスを提供するアプリケーションがもっと作れるようになるはずだ。
2019 Chrome Developer SummitにおけるAdaptive-Loadingプロジェクトの紹介ビデオも公開されている。
Adaptive-Loadingプロジェクトはオープンソースソフトウェアであり、Apache 2ライセンスで利用可能だ。