DNS プリフェッチ (DNS Prefetch) とは、ブラウザがユーザーのクリックを予測して、リンク先ドメインの DNS 解決 (ドメイン名から IP アドレスへの変換) を事前に実行しておく最適化技術です。実際にリンクをクリックしたとき、DNS 解決が完了済みのため、その分だけページの読み込みが早く始まります。どれだけ短縮できるかは回線や DNS キャッシュの状況によって変わります。
DNS 解決にかかる時間は回線品質や DNS キャッシュの有無で変わり、モバイル回線では長くなりやすい部分です。DNS プリフェッチはこの待ち時間をクリック前に済ませておく技術です。HTML の head 内に <link rel="dns-prefetch" href="https://example.com/"> と記述するだけで有効になり、href にはスキームを含めた URL を指定します。
短縮 URL のリダイレクト速度を改善する手段として DNS プリフェッチは有効です。短縮 URL をクリックすると、まず短縮 URL サービスのドメインの DNS 解決が行われ、次にリダイレクト先ドメインの DNS 解決が行われます。リダイレクト先のドメインを事前にプリフェッチしておけば、2 回目の DNS 解決を省略でき、体感速度が向上します。
DNS プリフェッチに関連する技術として、preconnect (DNS 解決 + TCP 接続 + TLS ハンドシェイクを事前実行)、prefetch (リソース全体を事前ダウンロード)、prerender (ページ全体を事前レンダリング。ただし現在は非推奨で、ページ単位の先読み指定は Speculation Rules API に引き継がれています) があります。リソース消費と効果のバランスでは、dns-prefetch が最も軽量で副作用が少ないため、外部ドメインへのリンクが多いページで積極的に使えます。
注意点として、DNS プリフェッチは DNS サーバーへのリクエストを増加させます。ページ内のすべての外部リンクにプリフェッチを設定すると、DNS サーバーへの負荷が増えるため、重要なリンク先に絞って設定するのが望ましいです。また dns-prefetch が効くのは別オリジンのドメインに対してだけです。自分のサイトのドメインはページを読み込んだ時点ですでに解決済みなので、指定しても効果はありません。preconnect を使う場合も同じドメインに dns-prefetch を併記しておくと、preconnect に対応しないブラウザでも DNS 解決だけは先に済ませられます。