▲

Defer.js demo
By りも.

【Defer.js】ユーザーアクションを待機して遅延

  • Defer.js 適用（使用コードはページ下部参照）
  • ユーザーアクション（スクロール・マウス移動等）が起きるまで、遅延読み込みを待機（defer.js v3.0 以降）
  • PageSpeed Insights（参考値：90前後）

本ページで使用しているコード

const twitterEmbed = document.getElementsByClassName('twitter-tweet');
const instaEmbed = document.getElementsByClassName('instagram-media');
try {
    if (twitterEmbed.length !== 0) Defer.js('//platform.twitter.com/widgets.js','widgets-js',0,null,true);
    if (instaEmbed.length !== 0) Defer.js('//www.instagram.com/embed.js','embed-js',0,null,true);
} catch (error) {
    console.log(error);
}

defer.js v3.0 以降の機能です。

Defer.js(...)の最後にtrueの値を入れることで、ユーザーアクション待機がオンになります。

参照：GitHub - shinsenter/defer.js

© 2023 Limosuki