Remove PageSpeed Images

if Google-PageSpeed is loaded on your server, or your “pay-by-traffic” CDN,
you might want to save the image-loading only when really needed,
for example- when user has scrolled and the image-container is visible (usually done by placing a 1×1 pixel image at first..)

but this method relay on JavaScript, and scrolling around is getting really lags a lot.

if you are eBay’ing around you might notice that the page’s-source might contain something like this:
some-description

you can query the images using document.querySelectorAll('img[src][imgurl][onload*="pagespeed"]')
it is very specific, just because I care :],

you might want to destroy the pagespeed reference before messing around with images :]
self.pagespeed = null;
self.f = null;

and using the following code you can clean up the entire-page
document.querySelectorAll(‘img[src][imgurl][onload*=”pagespeed”]’).forEach(function(img){
img.removeAttribute(‘onload’);
img.onload = null;
setTimeout(function(){
img.src = img.getAttribute(‘imgurl’);
}, 10);
});


in-fact, you should do things thoroughly, and FIRST remove the listeners using the cloneNode trick,
or simply remove the image-node and create a new one (since it IS a flat data-less-1-element only node)

now, eBay does pre-load some of the images,
it uses a very weird method of iframe (about:blank/javascript:false) which injecting javascript code into that iframe, which in-turn “goes up” to the main window and run some-code, I think someone there suggested that it will “cure” the window.onload delay,
which is an urban myth of course.

– JavaScript is just a typecast language which is parsed by the engine (WebKit or SpiderMonkey for example),
so this “method” of loading, really does NOTHING –

anyway…

If you are re-writing the HTML using some-fancy pre-renderer chrome-extension for example,
you might want to also *kill* the window.parent.preloadcallback to save some reloading of an already loaded images..

in-fact start with the onscroll/onresize/onload (see the code below – 3 last lines..)
sadly since it is a private method you can’t unhook it properly unless you grab the HTML modify it and reload it (no point of using the cloneNode trick to unhook event on such complex object such as window anyway..)

so just to put is simply,
you’ll have to build a chrome-extension (for example) to fix the badly designed eBay pages..


wonder what is behind the ebay pagespeed code? I’ve reversed-engineer it (a bit):

window.pagespeed = window.pagespeed || {};
var f = window.pagespeed;

function g(a) { this.d = [];
  this.c = 500;
  this.e = !1;
  this.k = a;
  this.g = null;
  this.h = 0;
  this.j = 200;
  this.f = !1 }

function k(a, c) {
  var d = c.getAttribute("pagespeed_lazy_position");
  if (d) return parseInt(d, 0);
  var d = c.offsetTop
    , b = c.offsetParent;
  b && (d += k(a, b));
  d = Math.max(d, 0);
  c.setAttribute("pagespeed_lazy_position", d);
  return d }
g.prototype.i = function (a) {
  l(a);
  var c = this;
  window.setTimeout(function () {
    var d, b, e, p = a.getAttribute("imgurl");
    if (null != p) {
      if (!(b = c.e))
        if (c.f || 0 != a.offsetHeight && 0 != a.offsetWidth) {
          b: if (a.currentStyle) b = a.currentStyle.position;
            else {
              if (document.defaultView && document.defaultView.getComputedStyle && (b = document.defaultView.getComputedStyle(a, null))) { b = b.getPropertyValue("position");
                break b }
              b = a.style && a.style.position ? a.style.position : "" }if ("relative" == b) b = !0;
          else {
            e = 0;
            "number" == typeof window.pageYOffset ? e =
              window.pageYOffset : document.body && document.body.scrollTop ? e = document.body.scrollTop : document.documentElement && document.documentElement.scrollTop && (e = document.documentElement.scrollTop);
            d = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
            b = e;
            e += d;
            var h = a.getBoundingClientRect();
            h ? (e = h.top - d, b = h.bottom) : (h = k(c, a), d = h + a.offsetHeight, e = h - e, b = d - b);
            b = e <= c.c && 0 <= b + c.c
          }
        }
        else b = !1;
      b && -1 != a.src.indexOf(c.k) ? (b = a.parentNode, e = a.nextSibling, b && b.removeChild(a), a.a && (a.getAttribute =
        a.a), a.removeAttribute("onload"), a.removeAttribute("imgurl"), a.removeAttribute("pagespeed_lazy_replaced_functions"), b && b.insertBefore(a, e), a.src = p) : c.d.push(a)
    }
  }, 0)
};
g.prototype.loadIfVisible = g.prototype.i;
g.prototype.n = function () { this.e = !0;
  m(this) };
g.prototype.loadAllImages = g.prototype.n;

function m(a) {
  var c = a.d
    , d = c.length;
  a.d = [];
  for (var b = 0; b < d; ++b) a.i(c[b]) }

function n(a, c) {
  return a.l ? null != a.l(c) : null != a.getAttribute(c) }
g.prototype.o = function () {
  for (var a = document.getElementsByTagName("img"), c = 0; c < a.length; ++c) {
    var d = a[c];
    n(d, "imgurl") && l(d) } };
g.prototype.overrideAttributeFunctions = g.prototype.o;

function l(a) { n(a, "pagespeed_lazy_replaced_functions") || (a.a = a.getAttribute, a.getAttribute = function (a) { "src" == a.toLowerCase() && n(this, "imgurl") && (a = "imgurl");
    return this.a(a) }, a.setAttribute("pagespeed_lazy_replaced_functions", "1")) }
f.b = function (a, c) {
  var d = window;
  if (d.addEventListener) d.addEventListener(a, c, !1);
  else if (d.attachEvent) d.attachEvent("on" + a, c);
  else {
    var b = d["on" + a];
    d["on" + a] = function () { c.call(this);
      b && b.call(this) } } };
f.m = function (a, c, d) {
  function b() {
    if (!(e.f && a || e.g)) {
      var b = e.j;
      (new Date)
      .getTime() - e.h > e.j && (b = 0);
      e.g = window.setTimeout(function () { e.h = (new Date)
          .getTime();
        m(e);
        e.g = null }, b) } }
  var e = new g(c);
  f.lazyLoadImages = e;
  e.c = d || 500;
  f.b("load", function () { e.f = !0;
    e.e = a;
    m(e) });
  0 != c.indexOf("data") && ((new Image)
    .src = c);
  f.b("scroll", b);
  f.b("resize", b) };
f.lazyLoadInit = f.m;


pagespeed.lazyLoadInit(false, "http://ir.ebaystatic.com/pictures/aw/pics/s_1x2.gif", 500);