フロントエンドを再学習する-パフォーマンス最適化の記録

プロファイル外のパフォーマンスについて話すことはお勧めできません。パフォーマンスは純粋に技術的なゲームではありません。パフォーマンスの最適化については、特定のビジネスシナリオに従って検討する必要があります。パフォーマンスの最適化はエンジニアリングに重点を置き、フロントエンドとバックエンドの両方を検討する必要があります。。

パフォーマンスシステムの最適化の実践プロセスは、次のプロセスに分かれています。

-現在の状況の評価と指標の確立。
パフォーマンスの最適化をうまくやりたい場合は、最初に現在の状況の評価を実施し、最適化の指標を確立する必要があります。
エンジニアとして、指標では2つの要素を考慮する必要があります。一方では、ユーザーにとって、どのパフォーマンス指標がそのエクスペリエンスをより適切に評価できるでしょうか？一方、企業にとって、どのような指標が事業価値に影響を与えるのでしょうか。
パフォーマンスの問題は多くの側面に分けることができます。最も重要なポイントは、ページの読み込みパフォーマンス、アニメーションと操作のパフォーマンス、メモリと消費電力です。ここでは、「パフォーマンス」という2つの単語のみを分析および解釈していることに注意してください。
大量のユーザーデータを分析した結果、これら3つの部分で、「ページの読み込みパフォーマンス」はユーザーの解約率と非常に強い相関関係があり、解約率は会社のビジネス価値を非常に重視していることを示していることがわかりました。。
したがって、次のステップは、主にページの読み込みパフォーマンスを例として説明することです。ページの読み込みパフォーマンスの適切な評価指標は、2番目の開封率です。2番目の開封率は、ユーザーの総数に対する1秒以内に開封したユーザーの割合を示します。
-技術計画;
次に、特定の実装計画を策定する必要があります。
まず、URLを入力してEnterキーを押した後に何が起こったのかを簡単に分析する必要があります。ブラウザの原則コースでは、ブラウザの一般的な動作プロセスについて説明しましたが、いくつかのことを理解する必要があります。ドメイン名からIPアドレスまで、DNSプロトコルを使用してクエリを実行する必要があります。HTTPプロトコルはによって送信されます。 TCPなので、TCP接続プロセスがあります。HTTPSが使用されている場合は、HTTPS交換証明書もあります。Webページごとに写真などの要求があります。この分析と実際のテストの結果から、Webページのロード時間だけでなく、要求の数に、ボリュームに関連していないので、我々は最終的に設計された技術的な解決策は、おおよそ次のように分けることができます。
ここに画像の説明を挿入します
ここにパフォーマンスの最適化のみがリストされています。私の意見では、技術ソリューションの一部がより重要な部分です。関係するフロントエンドテクノロジーだけでなく、サーバー、クライアント、および設計者チームも含まれていることがわかります。したがって、パフォーマンスを最適化する場合は、自分自身を使用しないでください。部分的な観点に限定して、良い結果を得るには、ビジネス全体を一緒に検討する必要があります。
- 実施した;
次に、技術計画に従って、特定の実装プロセスを策定します。
会社の実情によって、プロジェクトの実施度は異なるかもしれませんが、プロジェクトのレベルを低から高まで、純粋な管理、制度化、自動化の3つの段階に分けました。

純粋な管理管理とは、マネージャーが純粋な管理方法を使用して計画を実行することを意味します。たとえば、フロントエンドチームのリーダーとして、会議を開催し、チーム全体に前述の技術ソリューションの使用を要求できます。しかし、純粋な管理管理にはいくつかの問題があります。一方で、必要な管理リソースが利用できない場合があります。たとえば、バックエンドチームに協力を強制することはできません。一方、純粋な管理方法では、チーム自体に良い経験がない。チームの成長につながる最も重要なことは、純粋な管理アプローチが簡単に不十分な実行につながる可能性があるということです。このタイプの実行は、ほとんどの場合、技術的でないポジションで発生します。
制度化された実施方法は、人間の命令を規則に置き換え、責任者を任命し、トレーニング、チェックリスト、定期的なレビューなどの特定の手段を通じて実施を確実にすることです。制度化された実装は管理ワークロードを大幅に削減でき、最近のインターネット企業のほとんどは同様の方法を採用します。しかし、人々のイニシアチブに依存する制度化された実行方法の大部分はまだあります。プログラマーにとって、より良い方法があります：自動化。
自動化された方法は、いくつかの重要な操作パスにルールを設定することです。パフォーマンスを最適化するには、これに適した2つのポイントがあります。1つは開発ページをオンラインで公開すること、もう1つは開発ページのURLをホームページへのリンクに公開することです。、など。以前の作業では、テストチームと協力して、ページ上の最適化可能なポイントを自動的にスキャンするページパフォーマンススコアリングシステムを開発し、公開プラットフォームと配信プラットフォームと協力して、それを日常のメカニズムに追加しました。現在、ほとんどの企業は、制度化された実行計画と自動化された実行計画の組み合わせを採用します。
-結果の評価とモニタリング。
実装が完了した後、結果の特定の要約、つまり完全なプロジェクトの実装が必要です。さらに、どのプロジェクトの実装でも、特定の長期的なメカニズムが必要であり、劣化を最適化することはできません。これらはすべて、ワイヤー上の監視メカニズム。
オンライン監視を行う場合は、データ収集とデータ表示の2つの部分に分かれています。
監視と特定のシステムを組み合わせることで、チーム全体のパフォーマンスを保証できます。パフォーマンスは静的なものではなく、指標を継続的に最適化する必要があり、技術ソリューションを技術開発、システムと繰り返す必要があることに注意してください。、および自動化ツール。また、継続的な改善が必要であり、最終的な監視プラットフォーム製品は新しい要件を作成するのに失敗することはないため、パフォーマンスはチームの日常業務の一部になり、継続する必要があります。