DNSプリフェッチ – 業務改善コンサルティング情報ブログ https://www.trilogyforce.com/blog 業務改善で収益改善！ Mon, 17 Jun 2024 01:21:12 +0900 ja hourly 1 https://wordpress.org/?v=6.9.1 ウェブの表示速度をさらに追求 https://www.trilogyforce.com/blog/further-pursue-web-display-speed/ https://www.trilogyforce.com/blog/further-pursue-web-display-speed/#respond Mon, 26 Mar 2018 11:30:48 +0900 https://www.trilogyforce.com/blog/?p=5689 このブログでも何度か取り上げていたかと思いますが、今の時代、ウェブサイト（ページ）の表示速度は結構重要な要素となります。

Pagespeed ページスピード

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

最近、ウェブの表示スピードの話しがよくでるようになってきています。

理由は簡単です。

Google（グーグル）がウェブページの表示スピードにこだわっているところがあるからです。

Googleは、『スクロールせずに見える範囲のコンテンツは1秒以内に読み込まれるようにすべき』という見解をもっています。

1秒は1000ミリ秒ですが、『1秒以内に読み込まれるようにすべき』をクリアするには、非常に細かな部分にこだわって表示速度を追求する必要性があります。

数日前、『DNSプリフェッチでの速度改善』に関して書いた記事を覚えていますでしょうか？

それに近いものはありますが、もう1つの方法をお話しします。

ウェブの表示速度をさらに追求する

先日の記事にも書いた通り、昨今のウェブサイト（ページ）では外部リソースの読み込みが多くあります。

FacebookやTwitterなど、SNS系のプラグインを使っているのであれば間違いありません。

そして、先日ご紹介した『DNS prefetch（プリフェッチ）』は事前にDNS lookup（ルックアップ）を解決しておくものでしたが、それより少し先に行っているものがあります。

『preconnect（プリコネクト）』というものです。

この『preconnect』を指定した場合、DNSの解決、TCPハンドシェイク開始、TLSネゴシエーションを事前に行えるようにしてくれます。

では、実際にどのように記述するのか？

内に以下のような記述を加えればOKです。

<link rel=”preconnect” href=”//example.com”>

ただし、『DNS prefetch（プリフェッチ）』と『preconnect（プリコネクト）』では若干ブラウザの対応状況が異なります。

例えば、ChromeとFirefoxはpreconnect、DNS prefetchのどちらにも対応していますが、IE11（internet explorer11）はpreconnectは現時点で対応しておらず、DNS prefetchには対応しています。

従って、メジャーなブラウザに幅広く対応しておくには、preconnect、DNS prefetch、どちらも記述しておく方が得策ですので、

<link rel=”preconnect dns-prefetch” href=”//example.com”>

という感じで、preconnectとDNS prefetchを併記しておくことも良いでしょう。

]]> https://www.trilogyforce.com/blog/further-pursue-web-display-speed/feed/ 0 DNSプリフェッチでの速度改善 https://www.trilogyforce.com/blog/speed-improvement-with-dns-prefetch/ https://www.trilogyforce.com/blog/speed-improvement-with-dns-prefetch/#respond Thu, 22 Mar 2018 11:21:14 +0900 https://www.trilogyforce.com/blog/?p=5677 DNS prefetch（プリフェッチ）とは、ドメインの名前解決におけるDNS lookup（ルックアップ）を事前に解決しておくこと。これによって、外部ドメインを参照するリンクが多くある場合には速度改善に効果があるとされています。

HTML

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

インターネット上の多くのウェブサイト（ページ）では、さまざまなリンクが貼られています。

その中でも、Google MapsやGoogle Analytics、FacebookやTwitterなどのSNSとの連携がある場合にはそれぞれの個別のスクリプトファイルを読み込んでいます。

これらにおいて、実行に必要なアクセス先のURLを参照する際に『DNS lookup（ルックアップ）』が発生します。

そのため、外部との連携がある場合においてはホスト名とIPアドレスの変換が生じ、ウェブサイト（ページ）の表示にロスが生じます。

では、それはどのようにして解決すれば良いのでしょうか？

DNSプリフェッチで速度改善を図る

前述のDNS lookup（ルックアップ）における表示ロスを改善するには、DNS prefetch（プリフェッチ）を用いて改善を図ることができます。

ウェブサイト構築によく用いられる『WordPress』においても、バージョン4.6以降からはそれが実装されています。

では実際の対処法ですが、<head></head>内に以下のような記述を加えることになります。

（WordPress 4.6以降は自動挿入）

<link rel=”dns-prefetch” href=”//example.com”>

WordPress 4.6以降では、<link rel=”dns-prefetch” href=”//s.w.org”>が自動挿入されるようになっています。

ただし、この『DNS prefetch（プリフェッチ）』による対処は爆発的な改善を及ぼすことはありません。

また、デフォルトではHTTPSページでホスト名をプリフェッチしないとされています。

（Googleのサイトには未だDNS prefetch（プリフェッチ）の記述が残っていますが。。。）

私が試した限りでは、速度測定サイトにおけるスコアが＋１～＋３アップする程度ではありますが、ごくわずかな変化はありそうです。

現在、ウェブの高速化は軽視（無視）できない時代になっていますので、少しでも速度改善を望まれる方は一度試してみるのも良いでしょう。

]]> https://www.trilogyforce.com/blog/speed-improvement-with-dns-prefetch/feed/ 0