問題タブ [preconnect]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - dns-prefetch の利点を確認するには?
Web アプリケーションのパフォーマンス テストをいくつか行っていますが、実際には、リンク内の dns-prefetch の Web ページ テスト結果を理解する方法がわかりません。
追加したリンクについてはlink rel="dns-prefetch"、各リンクの最初のリクエストの先頭に緑色の部分が表示されます。しかし、私の期待は、図の最初に dns-handshake が表示されることでした (添付の画像で矢印が指し示している場所)。リンクも使用されました。
それは期待される動作ですか？DNS をプリフェッチせずにテストしてきたため、ダイアグラムは非常に似ています。
reactjs - PageSpeed Insights は、サードパーティのオリジンを事前に接続するように指示し、事前接続後にブラウザーで使用されていないことを伝えます
PageSpeed Insights を実行したところ、次のように表示されました
私は Gatsby を使用しているので、プラグイン gatsby-plugin-preconnect を使用してそれらを接続しました
次に、PageSpeed Insights を再度実行すると、次のように表示されます
それらが事前に接続されていると、パフォーマンススコアが大幅に低下しました