GoogleのChrome teamがquiclinkというOSSを公開しています。

https://github.com/GoogleChromeLabs/quicklink

quicklinkは、画面表示領域のリンクをプリフェッチしてくれるモジュールです。

遷移が早くなるのでUXの向上が期待できます

動きとしてはこんな感じです。

  • viewportのリンクを検出
  • ブラウザがアイドルするまで待つ
  • ユーザが遅いコネクションかどうかをチェックする(data-saverが有効チェック)
  • リンクをプリフェッチする

最も簡単な例だと、quicklinkを読み込んで、関数をコールするだけ。

<script src="dist/quicklink.js"></script>
<script>
quicklink();
</script>

APIでtimeoutやpriorityなど細かい設定をすることも可能です。 詳細はREADMEを参照してください。

npm install --save quicklink


Back To Top