Above the Fold に含まれるリソースの一覧を抽出するスクリプト。

atf.js

(function(d) {
  var resources = {};
  var re = /url\(([^)]+)\)/;
	
  // 画面の左下の座標を取得
  var maxWidth = window.innerWidth;
  var maxHeight = window.innerHeight;

  [].forEach.call(d.getElementsByTagName('*'), function(elem) {
    var rect = elem.getClientRects()[0];
    
    // 領域外の要素は無視する
    if (!rect || rect.left > maxWidth || rect.top > maxHeight) {
      return;
    }

    // src 属性の URL を取得
    if (elem.src) {
      var url = elem.src;
      if (url.indexOf("?") === -1) {
      	resources[url] = true;
      }
    }

    // background-image プロパティの URL を抽出
    var style = window.getComputedStyle(elem);
    var bgi = style.getPropertyValue("background-image");
    if (bgi.match(re)) {
      resources[RegExp.$1] = true;
    }
  });
  
  // 出力
  console.log(Object.keys(resources));
})(document);