【WordPressで試しました】ヘッダー内に「事前レンダリング技術」を設定すると、表示時間が体感的にも全然違った

「事前レンダリング」技術をこちらのサイトで知りました。有益な情報が多くて、大変参考になります。

 

事前レンダリングの概要

事前レンダリングで指定したurlに対して、あらかじめページの読み込みを行うという仕組みのようです。というわけで、早速私のこのブログでも試しました。

 

 

トップページを指定する場合(WordPressの場合)

 

例として、トップページを「事前レンダリング」したいとします。下のコードを<head>~</head>の間に入れます。

<link rel="prerender" href="<?php echo home_url(); ?>">

 

以上で設置完了です。記事ページや固定ページから、トップページに戻ると、すごく速く感じます。(比較ができればもっといいですね)

 

表示時間が変わらないこともある

私の持っている、とても古いモバイル端末xperia(so-01b)で試したんですが、ほとんど変わりませんでした。ですので、設置はPCからの閲覧の場合のみ。モバイルからの閲覧の場合は、現段階では記述しないようにしました。 閲覧環境(回線や端末)に依存するって感じですね。

 

上記の点含め、以下参考リンクには「事前レンダリング」について対応ブラウザなど注意点が書かれています。とても参考になりました。

 

 

参考リンク

 

事前レンダリングでウェブページの表示時間を高速化 | 海外SEO情報ブログ

事前レンダリングでウェブページの表示時間を高速化を試してみたよ!

Web Developer’s Guide to Prerendering in Chrome – Google Chrome — Google Developers

http://msdn.microsoft.com/ja-jp/library/ie/dn265039(v=vs.85).aspx

 

 

追記:複数指定はできるのか、有効期限など

 

最近何かと交流させて頂いている、インターネット自主防衛マニュアルさんから、さらに詳しく教えて頂きました。

https://twitter.com/LifeisCrimeInfo/status/400147375890513920

https://twitter.com/LifeisCrimeInfo/status/400149365106290688

 

なるほどっす、詳しい!!ありがとうございます。もうちょっと勉強しないとな~。

著者:bouya Imamura