SandBox

img 要素の画像サイズ一覧を出すブックマークレット

javascript:

var urlSuffix = '?' + Math.random ();
var imageURLs = {};
Array.prototype.forEach.call (document.querySelectorAll ("img"), function (e) {
  imageURLs[e.src + urlSuffix] = true;
});

Promise.all (
  Object.keys (imageURLs).map (function (u) {
    return new Promise (function (ok) {
      var img = new Image;
      img.src = u;
      img.onload = ok;
    });
  })
).then (function () {
  var imageSizes = {};
  Array.prototype.forEach.call (performance.getEntries (), function (p) {
    if (imageURLs[p.name]) {
      imageSizes[p.name] = p.transferSize;
    }
  });

  console.log (imageSizes);
});

[1] 同じ起源でないと 0 になる。

javascript:

var imageURLs = {};
Array.prototype.forEach.call (document.querySelectorAll ("img"), function (e) {
  imageURLs[e.src] = true;
});

Promise.all (
  Object.keys (imageURLs).map (function (u) {
    return fetch (u, {headers: "cache-control", "no-store,no-cache"}).catch (function () { });
  })
).then (function () {
  var imageSizes = {};
  Array.prototype.forEach.call (performance.getEntries (), function (p) {
    if (imageURLs[p.name]) {
      imageSizes[p.name] = p.transferSize;
    }
  });

  console.log (imageSizes);
});