1. パフォーマンス:
   原則 1: http リクエストを削減し、画像、CSS ファイルを結合する
   原則 2: キャッシュ使用率: CDN を使用し、外部 JS と CSS を使用し、Exp を追加します。 ires ヘッダー、DNS クエリの削減、Etag の設定、Ajax キャッシュの使用。
   原則 3: 帯域幅の要求: GZIP を有効にし、js を合理化し、重複したスクリプトを削除し、画像を最適化します。
   原則 4: ページ構造: スタイルを先頭に、js を一番下に配置し、ドキュメント出力をできるだけ早く更新します
   原則 5: CSS 式を避け、リダイレクトを避ける
   実際、具体的なビジネス シナリオから始めると、さらに理解できるようになりますたとえば、検索結果ページ

。

2. セキュリティ:
   XSS

最近面接の準備をしているので、私なりの意見をまとめてみました

パフォーマンス

httpリクエスト

http リクエストを減らす主な考え方は、HTML ドキュメント内でリンクされているリソースの数を減らすことです。

• プロジェクトがオンラインになると、ソースファイルの数とサイズを減らすためにCSS`JavaScript`とその他のファイルが圧縮、マージ、パッケージ化されます

• 複数の小さな画像をスプライトに作成します

• リソースをbase64エンコーディング

に変換する

• キャッシュを使用すると、Webページを開く速度が向上し、httpリクエストを効果的に削減できます

• 遅延読み込みを使用して、対応するリソースをオンデマンドでロードします

ページを開く速度

• CDN を使用してリソースをロードする

• ページのちらつきを防ぐためにCSSをページの先頭に配置します

• JavaScriptが実行されたりページの読み込みがブロックされたりするのを防ぐために、JavaScriptを非同期または遅延して読み込みます

• 最初の画面外のファイルに対するリクエストを遅らせます。つまり、最初の画面のコンテンツを最初に読み込みます。

実行効率

• セレクターは右から左に解析され、ネスト順序が深すぎてはなりません

• JavaScript でのスコープ チェーン ルックアップを減らし、eval和Function やその他のパフォーマンスの低いインターフェイスの使用を回避します

• DOM 操作は非常に負荷が高いため、DocumentFragment を使用してドキュメントに一度に挿入されるノードを一時的に保存できます

フロントエンドセキュリティ

フロントエンド セキュリティは主に、ブラウザを通じてユーザー データに間接的に影響を与えるセキュリティ問題を指します。

XSS

クロスサイトスクリプティングとは、悪意のある攻撃者がWebページに悪意のあるスクリプトコードを挿入し、Webページに埋め込まれたスクリプトコードが実行され、ユーザーを盗むなどの悪意のある攻撃を行うことを指します。ユーザーのクッキー。 XSS の問題は、たとえば、特定の編集コンテンツがユーザーの入力を処理せずにデータベースに直接保存されている場合、ユーザーがページにアクセスしたときに、ターゲット Web サイトに挿入される可能性のある脆弱性を見つけることです。 、悪意のあるスクリプトがページ上に表示され、対応する攻撃が実行される可能性があります。

実装方法は、まず悪意のあるWebサイト上でGETリクエストを構築し（Ajaxの同一オリジン制限により、imgなどのsrcリクエストが利用可能）、その後、対象となるWebサイトのユーザーをだまして悪意のあるWebサイトにアクセスさせます。ウェブサイトにアクセスすると、対応するリクエストが開始され（および対応する Cookie などのユーザー識別情報があれば）、この時点でも攻撃が発生します

パフォーマンスコード圧縮、画像圧縮、httpリクエストの削減、Ajax非同期などはすべてパフォーマンスに有益です

安全なXXS暗号化コード