レガシー JavaScript
Silktide は、非常に古いブラウザーをサポートすることだけを目的とした余分なコードがページに含まれていないかチェックします。最新のブラウザーには不要なため、ほとんどすべての訪問者にとって、ダウンロード時間と処理時間が無駄になります。
を公開用に準備すると、ビルドツールによって、ポリフィル(古いブラウザーにない機能を補う代替コード)やトランスフォーム(最新の構文を古い形式に書き換える処理)が追加されることがよくあります。実質的に使われなくなったブラウザー向けに設定されていると、すべてのページの読み込みに大きな不要コードが追加される可能性があります。
重要な理由
訪問者の大多数は、自動的に更新され、最新の JavaScript をネイティブでサポートするブラウザーを使用しています。レガシーサポートコードがあると、実際のトラフィックがまったくないかもしれないブラウザーとの互換性のために、ダウンロード時間、モバイルデータ、処理時間というコストをすべての訪問者が負担することになります。
問題が見た目に現れないため、このコストは見過ごされがちです。サイトはどこでも正常に動作しますが、すべてのページで、すべての人に対して、必要以上に遅くなっています。
修正方法
これは開発者がビルド設定を修正することで対応します。
- ビルドのブラウザーサポート対象を、古くなったレガシーなデフォルト設定ではなく、実際の訪問者が使用しているブラウザーに設定します。多くのビルドツールでは、プロジェクト内のブラウザーサポート宣言からこの情報を読み取ります。
- すべての機能のサポートを取り込む包括的なポリフィルのインポートを削除し、対象ブラウザーが本当に必要とするものだけをビルドに含めます。
- 一部のレガシーブラウザーを引き続きサポートする必要がある場合は、レガシービルドを全員に送信するのではなく、現在のブラウザー向けのモダンビルドと、それを必要とするブラウザーだけに提供するレガシービルドの2種類を用意します。
Silktide によるテスト方法
- 速度テスト用に設定されたデバイスタイプ、接続速度、テスト場所を使用して、実際のブラウザーでページを読み込みます。
- ページがダウンロードする JavaScript を調べ、最新のブラウザーには不要な既知のポリフィルや構文変換を確認します。
- レガシーコードを含む各ファイルと、削減可能なダウンロードサイズを報告します。
- 無駄になっている合計サイズに基づいてページを評価します。レガシーコードが約 30 KB あると評価が下がり、100 KB 以上ある場合は低評価になります。
トラブルシューティング
古いブラウザーも引き続きサポートする必要があります
訪問者が実際にそれらを使用しているか確認してください。確認にはアナリティクスを利用できます。本当に使用している訪問者がいる場合は、module/nomodule パターンを使うことで、必要なブラウザーにだけレガシーコードを提供できます。これにより、最新のブラウザーがそのコストを負担せずに済みます。
レガシーコードがサードパーティ製スクリプトに含まれています
他のプロバイダーが提供するスクリプトには、独自のレガシーコードが含まれていることがあり、その場合は自分で再ビルドできません。プロバイダーがモダンビルドを提供しているか確認し、そのスクリプトの価値とコストを比較検討してください。