Webパフォーマンスの最適化
Webパフォーマンス最適化ガイド
1)Web性能決定要因
1.パフォーマンスのロード
🔱 リソースのロードのパフォーマンス(HTML、CSS、JS)
24791721π画像サイズの最適化
-画面で実際に使用されている画像の2倍のサイズを使用します.
-実際の画像を減らすことができない場合は、画像CDNを使用します.画像処理CDNとは?
CDN+ユーザに転送する前に画像処理を行う技術.
寸法、フォーマット変更等
ex) https://cdn.image.com?src=\[img src]&width=200&height=200
コンテンツ配信ネットワーク(CDN)とは?
物理的な距離の制限を克服するために、コンテンツ・サーバを消費者(ユーザー)に近い場所に配置する技術
24791722πコードsplitting
-余分なコードや重複したコードを必要とせずに、適切な時間に適切なサイズのコードをロードしてください.
- Route-based code splitting 24791723」テキスト圧縮2.レンダリングパフォーマンス
🔱 上記のリソースのパフォーマンスを表示
24791721ボトルネックコード最適化
2)分析ツール
-ページのロード時に実行されるタスクは、タイムラインとチャドとみなされます.
-Minor GCが関数を実行している場合、タスクが大量のメモリを消費していると判断される可能性があります.

-Opportunity(リソース)のロードに関連するパフォーマンスの最適化
-Diagnosticsレンダリングに関連するパフォーマンスの最適化

npm i -D cra-bundle-analyzer
npx cra-bundle-analyzer

Reference
この問題について(Webパフォーマンスの最適化), 我々は、より多くの情報をここで見つけました https://velog.io/@jgi0105/웹-성능-최적화テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol