重複したJavaScript
Silktideは、ページがダウンロードするコードに同じものが複数回含まれていないかをチェックします。重複したコードは、訪問者に何も追加の価値を提供しないまま、ページを大きくし、読み込みを遅くします。
最新のは通常、多数の小さなモジュールを組み合わせ、いくつかの大きなファイルにまとめて構成されます。複数のバンドルが個別にビルドされる場合(たとえば、独自のコードと埋め込みウィジェットなど)、それぞれに同じモジュールのコピーが含まれることがあり、訪問者は同一の機能を二重にダウンロードすることになります。
これが重要な理由
重複したモジュールはそれぞれ、ダウンロード時間、処理時間、モバイルデータを消費しますが、その見返りは何もありません。高速なオフィス接続では無駄が目立たないかもしれませんが、スマートフォンや低速なネットワークを利用する訪問者は、ページの表示や応答に時間がかかるという形で、その影響を直接受けます。
重複は気づかないうちに増える傾向もあります。サイトに新しいスクリプトやウィジェットを追加するたびに、共通ライブラリのコピーが独自に持ち込まれる可能性があるため、誰かが確認しない限り、時間の経過とともに無駄が積み重なります。
修正方法
これは、サイトのコンテンツではなく、サイトのビルドプロセスで開発者が対応する修正です。
- サイトのJavaScriptがどのようにバンドルされているかを分析します。多くのバンドルツールには、各出力ファイルの内容を視覚化する分析モードがあり、重複したモジュールを簡単に見つけられます。
- 共有依存関係を重複排除するようにビルドを設定します。複数の場所で使用されるライブラリを各バンドルにコピーするのではなく、一度だけ含めて共有できるようにします。
- バージョンをそろえます。同じライブラリでもバージョンが異なると統合できないため、すべてを1つのバージョンにアップグレードすることが、本当の解決策になる場合がよくあります。
- 重複が再ビルドできないサードパーティ製スクリプトによるものの場合は、提供元に軽量なビルドを依頼するか、別のものに置き換えます。
Silktideによるテスト方法
- 速度テスト用に設定されたデバイスの種類、接続速度、テスト場所を使用して、実際のブラウザーでページを読み込みます。
- ページがダウンロードするJavaScriptファイルを調べ、複数のファイルに登場するモジュールを特定します。コピーは内容ではなく機能によって照合されるため、ファイルのフォーマットやの方法が異なっていても見つけられます。
- 重複している各モジュール、そのモジュールが含まれるファイル、余分なコピーを削除することで節約できるダウンロードサイズを報告します。
- ページを、無駄になっているダウンロードサイズの合計で評価します。重複が約10 KBあるだけでも評価が下がり、50 KB以上ある場合は不十分と評価されます。
トラブルシューティング
2つのファイルに同一のコードが含まれていない
このチェックでは、正確なテキストではなく、モジュールの内容に基づいて照合します。同じモジュールは、圧縮後に2つのバンドル内で大きく異なって見える場合でも、重複した同一のコードとして認識されます。
重複がサードパーティ製スクリプト内にある
他者が作成したバンドルを再ビルドすることはできません。提供元に相談するか、依存関係を共有できる別の方法でそのスクリプトを読み込むか、スクリプトの価値がコストを上回る場合はそのまま使用します。