コメント:ブラウザ開発者であろうと通常のWebアプリケーション開発者であろうと、彼らはすべて共同の努力をしています。ウェブサイトをより速くすることができる多くの既知の手法があります。CSSスプライトを使用し、画像最適化ツールを使用し、.htaccessを使用してページヘッダー情報とキャッシュ時間、JavaScript圧縮、CDNを使用します。
このサイトで使用されるいくつかの速度最適化手法を導入しました。 HTML5では、Webサイトの速度を最適化するために新機能が登場しました。ページリソースのプリロード/プリ読み取り(リンクプリフェッチ)。
Page Resource Preload/Pre-Read(Link Prefetch)とは何ですか? MDNからの説明:
ページリソースのプリロード(リンクプリフェッチ)は、ブラウザが提供するスキルであり、ブラウザが自由時間中にドキュメントリソースをダウンロードまたは事前に読み取ることができるように設計されており、ユーザーは将来これらのリソースにアクセスします。 Webページは、ブラウザの一連のプリロード命令を設定できます。ブラウザが現在のページをロードすると、指定されたドキュメントが背景に静かにロードされ、キャッシュに保存されます。ユーザーがこれらのプリロードされたドキュメントにアクセスすると、ブラウザはそれらをキャッシュからユーザーにすばやく抽出できます。
簡単に言えば、ブラウザが他のリソース(ページ、写真、ビデオなど)をプリロードして、ユーザーが現在のページにアクセスした後にアクセスする可能性が最も高いようにします。そして、この方法は非常にシンプルです!
HTML5ページリソースプリロード(リンクプレッチ)ライティング方法
<! - ページ全体をプリロード - >
<link href = "http://www.vevb.com/misc/3d-album/"/> </p> <p> <! - preload a picture->
<link href = "<a href =" http://www.vevb.com/wordpress/ "> </a>
wp-content/uploads/2014/04/b-334x193.jpg "/>
HTML5ページリソースプリロード/プリリード(リンクプリフェッチ)関数は、リンクタグを介して実装されます。 REL属性は、HREF属性にロードされるプリフェッチとアドレスとして指定されています。 Firefoxブラウザは、追加の属性サポートも提供します。
<リンク
title = "Mozillaのために設計" href = "mozspecific.css" _fcksavedurl = "" mozspecific.css "" />
<link href = "2.html" />
HTTPSプロトコルリソースの下では、プレッチも使用できます。
どのような状況で、ページリソースをプリロードする必要があります
あなたのページにどのようなリソースがロードされ、それがすべてあなた次第です。ここにいくつかの提案があります:
1.ページにスライドのようなサービスがある場合は、次の1〜3ページと前の1〜3ページをプリロード/事前読み取ります。
2。ウェブサイト全体に共通の写真をプリロードします。
3.ウェブサイトの検索結果の次のページをプリロードします。
ページリソースのプリロードを禁止する(リンクプリフェッチ)
Firefoxブラウザには、ページリソースのプリロード(リンクプリフェッチ)関数を禁止するオプションがあります。あなたはそれをこのように設定することができます:
1.user_pref(network.prefetch-next、false);
2。ページリソースプリロードの予防策(リンクプリフェッチ)
ページリソースのプリロード(リンクプリフェッチ)に関するいくつかのメモを次に示します。
1. Preload(Link Prefett)は、ドメイン全体でCookieを引くなど、ドメイン間で動作することはできません。
2。プリロード(リンクプリフェッチ)は、ブラウザにプリロードされた一部のページが実際にユーザーが訪問しない可能性があるため、ウェブサイトに訪問する統計を汚染します。
3. Firefoxブラウザーは、2003年以来、このプリロード(リンクプリフェッチ)テクノロジーをサポートしています。
ブラウザの自由時間を使用して追加のリソースファイルをロードすると、エキサイティングで危険なように見えます。これらのテクノロジーを試してみませんか?