☰

Behance - fetch lazy-load images immediately

Fetch lazy-load images immediately at document load

  1. // ==UserScript==
  2. // @name        Behance - fetch lazy-load images immediately
  3. // @description Fetch lazy-load images immediately at document load
  4. // @include     https://www.behance.net/*
  5. // @version     1.0.5
  6. // @namespace   wOxxOm.scripts
  7. // @author      wOxxOm
  8. // @license     MIT License
  9. // @run-at      document-start
  10. // @require     https://greasyfork.org/scripts/12228/code/setMutationHandler.js
  11. // ==/UserScript==
  12.  
  13. window.addEventListener('DOMContentLoaded', function(e) {
  14.   processNodes([].slice.call(document.querySelectorAll('.js-picture-lazy')));
  15.   setMutationHandler(document.body, '.js-picture-lazy', processNodes);
  16. });
  17.  
  18. function processNodes(nodes) {
  19.   nodes.forEach(function(n) {
  20.     if (img = n.querySelector('img')) {
  21.       img.src = img.dataset.src;
  22.       img.removeAttribute('width');
  23.       img.removeAttribute('height');
  24.       img.removeAttribute('style');
  25.     }
  26.     var picture = document.createElement('picture');
  27.     while (n.firstElementChild)
  28.       picture.appendChild(n.removeChild(n.firstElementChild));
  29.     n.parentNode.replaceChild(picture, n);
  30.     n.remove();
  31.   });
  32. }