Resource Hints API でリソースの投機的取得 | blog.jxck.io
Intro Resource Hints とは現在提案されている以下のドラフトであり、ブラウザに「次に必要となるリソースを教える」ことで、投機的な取得を行う API 群である。 https://w3c.github.io/resource-hints/ 主に以下がある。 dns-prefetch preconnect prefetch prerender 今回は本サイトでこれを適用した話。 投機的なリソース取得 例えば、ログインページの次には、そのサービスのメインページに遷移する頻度が高い。 そして、メインページでは、以下のような追加のリソースが必要になるだろう。 追加の JS 追加の CSS 追加の Image 追加の API アクセス それぞれを DNS 解決 -> TCP 接続 -> リソースのフェッチ、と繰り返していくと、イニシャル表示は必然的に時間がかかる。 ところが、この遷移に
Resource Hintsでリソースを事前取得しよう！ - Qiita
Resource Hintsとは？ 下記4つのAPIから構成される。IEについては10以降にはなるが、大体のブラウザでサポートされている。 - DNS-Prefetch - Preconnect - Prefetch - Prerender 詳しくはResource Hints参照。 DNS-Prefetch ソーシャルボタンの設置やCDNの利用など、外部サイトからリソースを読み込む場合、「DNSルックアップ（ドメインをIPアドレスに変換すること）」が複数発生します。下記のように指定することで、あらかじめドメインの名前解決を行うことが可能です。 (function(document) { var servers = [ /* evernote */ "static.evernote.com" /* pocket */ ,"d7x5nblzs94me.cloudfront.net" ,"wi
Webパフォーマンス虎の巻
Webパフォーマンス向上施策のために、今更ながら超速本1を読んだので、今までの自分の知見と合わせてまとめてみます。 なるべく柔らかく、改善施策ってまず何をどうすればいいの？という疑問を持った人に向けて書いています。 ▪️格言 そもそもWebは速い。遅くしているのは我々です。大抵は技術の問題ではなくて、人の問題。 引用元： テクニックではなく、今、本気で取り組むべきWebパフォーマンス （html5jパフォーマンス部 部長 竹洞さん） 心得 パフォーマンス向上に対する施策は大別すると以下の２通り 軽量化 （単純にやりとりするデータ容量を小さくすること） 圧縮 削除 最適化 （その時に最も適している実装・実行をとること） 経路・順番の変更 非同期 もっとも遅くしている原因を探して、それを対策するのが原則。「対効果」が絶対的正義である。手段から入るのは愚策。まず先に原因を知ることが重要。 ▪️1
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
