初回ユーザイベントで発火する：onLazy.js

3

関数の遅延呼び出しです。loadイベント以降の、初回ユーザイベント後に発火します。各種遅延読み込みのトリガーとして利用することを想定しています。

仕様

  • lazyのカスタムイベントを発信します
  • loadイベント以降の初回ユーザーイベントの後で発火します
  • loadイベント以前にユーザーイベントが発火した場合、loadイベント時に発火します
  • loadイベント時にドキュメントの先頭でない場合も発火します
    • 更新時 or ページ内リンク時
  • カスタムイベント登録は、「loadイベントより前」または「onLazy.js実行より前」に実施して下さい

※初回ユーザイベント時の最速の実行を目的としていません
　FIDを考慮して少し遅めに実行します
※初回ユーザイベントは、取り逃す前提で処理してください
※IE9+対応

コード

使用例

上記の遅延読み込みコードをonLazy.jsで使用する例

使用例(function() {
  // 読込みコード本体
  function main() {
    // GoogleAdSense読込み
    var ad = document.createElement('script');
    ad.type = 'text/javascript';
    ad.async = true;
    // 新コードの場合、サイト運営者IDを書き換えてコメントアウトを外す
    //ad.dataset.adClient = 'ca-pub-XXXXXXXXXXXXXXXX';
    ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
    var sc = document.getElementsByTagName('script')[0];
    sc.parentNode.insertBefore(ad, sc);
  }
  // lazyのカスタムイベントに登録
  window.addEventListener('lazy', main);
})();

... onLazy.jsのコード

※上記コードが<script>内に含まれる形で</body>直前に配置する

関連記事