Proxxは、Google ChromeチームによるJavaScriptゲームである。多様なプラットフォームとインプットデバイスにわたって、同様のユーザエクスペリエンスを提供する、高速で円滑なWebアプリケーションを開発する方法を示している。
プロジェクトはスマート・フィーチャーフォンをターゲットにしているところが特に興味深い - スマートフォンのオルタナティブとして比較的安価で、インドやアフリカといった地域で高い支持を得始めているものだ。Counterpoint researchの調査によれば、2019年から2021年で3億7000万個が販売される見込みとのことだ。
スマート・フィーチャーフォンのハードウェアは、スマートフォンと比較して非常に簡易である。タッチコントロールはサポートしておらず、小さなディスプレイ(大抵、240×320ピクセルのQVGA)、比較的弱いCPUを用いている。
これら全ての制約は、このような制限されたリソースを扱うことに慣れていないWeb開発者に新たな課題を提起する。
スマート・フィーチャーフォンのパフォーマンスの制限に取り組むため、ProxxはJavaScriptコードをバックグラウンドスレッドで稼働することを可能にするweb workersを利用した。
ゲームロジックを別個のスレッドに移すことで、UIに関する計算だけがメインスレッドで完了するようになる。これは、円滑なレンダリングを保証するためには必要なことである - 特に弱いデバイスにおいては。
ProxxチームはCanvasとWebGLを用いてゲームを描写している。2つの異なるレイヤが利用されている - 1つはバックグラウンドアニメーション用、もう1つはテーブルの表示用である。これにより、バックグラウンドアニメーション用に、より小さいキャンバスを利用できるようになり、メモリ消費を抑えることができる。
ゲームとのインタラクションは、キャンバスレイヤのトップに配置されたhiddenのDOMグリッドにより操作される。この簡略化されたイベントハンドリングにより、Proxxチームはスクリーンリーダを比較的容易にサポートできる。
DOMレンダリングとインタラクションを管理するため、ProxxチームはPreactを利用することにした - Reactに代わる、よりリーンで、3KBだけのサイズではあるが、同じレンダリングAPIをサポートするものだ。
Proxxチームは、Puppeteerを利用して初めのスクリーンをサーバ上にプレレンダリングすることで、ローディングタイムをさらに改善した。
最終的に、ProxxチームはRollupを活用した - より人気のあるWebpackライブラリに対していくつかの最適化を提供する、JavaScriptモジュールバンドラである。具体的には、ProxxチームはRollupで、メイン/Webワーカ スレッド間で依存関係を共有できるようになり、重複したコードのロードを回避できるようになった。
Proxxチームは年内に、開発プロセスに関するさらなる詳細の発表を計画している。
今のところ、開発者はProxxプロジェクトについてさらに読むことができ、ProxxのGoogle I/Oでの講演を閲覧することができる。
ProxxのソースコードはApache2オープンソースライセンス下で、Proxx GitHubリポジトリから利用可能である。