vanilla-lazyload - npm Package Compare versions

Comparing version 10.19.0 to 10.19.1

CHANGELOG.md

@@ -5,2 +5,10 @@ # CHANGELOG
 
+#### 10.19.1
+
+- Fixed build for those using React + SSR, see #287
+- TypeScript definitions clearified, see #283
+- Gulp updated to v.4.0.0 to make it work with node 10
+
+Thanks to @AlexCSR and @muturgan for contributing.
+
 #### 10.19.0
@@ -175,2 +183,7 @@
 
+#### 8.17.0
+
+- Added the ability to know when all images have been downloaded through the `callback_finish` callback.
+- Added the file `demos/print.html` to demo how to print lazy images.
+
 #### 8.16.0
@@ -177,0 +190,0 @@

dist/lazyload.amd.js

@@ -6,5 +6,30 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
+	var replaceExtToWebp = function replaceExtToWebp(value, condition) {
+		return condition ? value.replace(/\.(jpe?g|png)/gi, ".webp") : value;
+	};
+
+	var detectWebp = function detectWebp() {
+		var webpString = "image/webp";
+		var canvas = document.createElement("canvas");
+
+		if (canvas.getContext && canvas.getContext("2d")) {
+			return canvas.toDataURL(webpString).indexOf("data:" + webpString) === 0;
+		}
+
+		return false;
+	};
+
+	var runningOnBrowser = typeof window !== "undefined";
+
+	var isBot = runningOnBrowser && !("onscroll" in window) || typeof navigator !== "undefined" && /(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
+
+	var supportsIntersectionObserver = runningOnBrowser && "IntersectionObserver" in window;
+
+	var supportsClassList = runningOnBrowser && "classList" in document.createElement("p");
+
+	var supportsWebp = runningOnBrowser && detectWebp();
+
 	var defaultSettings = {
 		elements_selector: "img",
-		container: document,
+		container: isBot || runningOnBrowser ? document : null,
 		threshold: 300,
@@ -111,27 +136,2 @@ thresholds: null,
 
-	var replaceExtToWebp = function replaceExtToWebp(value, condition) {
-		return condition ? value.replace(/\.(jpe?g|png)/gi, ".webp") : value;
-	};
-
-	var detectWebp = function detectWebp() {
-		var webpString = "image/webp";
-		var canvas = document.createElement("canvas");
-
-		if (canvas.getContext && canvas.getContext("2d")) {
-			return canvas.toDataURL(webpString).indexOf("data:" + webpString) === 0;
-		}
-
-		return false;
-	};
-
-	var runningOnBrowser = typeof window !== "undefined";
-
-	var isBot = runningOnBrowser && !("onscroll" in window) || /(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
-
-	var supportsIntersectionObserver = runningOnBrowser && "IntersectionObserver" in window;
-
-	var supportsClassList = runningOnBrowser && "classList" in document.createElement("p");
-
-	var supportsWebp = runningOnBrowser && detectWebp();
-
 	var setSourcesInChildren = function setSourcesInChildren(parentTag, attrName, dataAttrName, toWebpFlag) {
@@ -138,0 +138,0 @@ for (var i = 0, childTag; childTag = parentTag.children[i]; i += 1) {

dist/lazyload.amd.min.js

@@ -1,2 +0,2 @@
-var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t};define(function(){"use strict";function t(t,e,n){var r=e._settings;!n&&i(t)||(C(r.callback_enter,t),R.indexOf(t.tagName)>-1&&(x(t,e),y(t,r.class_loading)),I(t,e),s(t),C(r.callback_set,t))}var e={elements_selector:"img",container:document,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"loading",class_loaded:"loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},n=function(t){return _extends({},e,t)},r=function(t,e){return t.getAttribute("data-"+e)},a=function(t,e,n){var r="data-"+e;null!==n?t.setAttribute(r,n):t.removeAttribute(r)},s=function(t){return a(t,"was-processed","true")},i=function(t){return"true"===r(t,"was-processed")},o=function(t,e){return a(t,"ll-timeout",e)},c=function(t){return r(t,"ll-timeout")},l=function(t){return t.filter(function(t){return!i(t)})},u=function(t,e){return t.filter(function(t){return t!==e})},d=function(t,e){var n,r=new t(e);try{n=new CustomEvent("LazyLoad::Initialized",{detail:{instance:r}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent("LazyLoad::Initialized",!1,!1,{instance:r})}window.dispatchEvent(n)},f=function(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t},_="undefined"!=typeof window,v=_&&!("onscroll"in window)||/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),g=_&&"IntersectionObserver"in window,h=_&&"classList"in document.createElement("p"),b=_&&function(){var t=document.createElement("canvas");return!(!t.getContext||!t.getContext("2d"))&&0===t.toDataURL("image/webp").indexOf("data:image/webp")}(),m=function(t,e,n,a){for(var s,i=0;s=t.children[i];i+=1)if("SOURCE"===s.tagName){var o=r(s,n);p(s,e,o,a)}},p=function(t,e,n,r){n&&t.setAttribute(e,f(n,r))},w=function(t,e){var n=b&&e.to_webp,a=r(t,e.data_src),s=r(t,e.data_bg);if(a){var i=f(a,n);t.style.backgroundImage='url("'+i+'")'}if(s){var o=f(s,n);t.style.backgroundImage=o}},E={IMG:function(t,e){var n=b&&e.to_webp,a=e.data_srcset,s=t.parentNode;s&&"PICTURE"===s.tagName&&m(s,"srcset",a,n);var i=r(t,e.data_sizes);p(t,"sizes",i);var o=r(t,a);p(t,"srcset",o,n);var c=r(t,e.data_src);p(t,"src",c,n)},IFRAME:function(t,e){var n=r(t,e.data_src);p(t,"src",n)},VIDEO:function(t,e){var n=e.data_src,a=r(t,n);m(t,"src",n),p(t,"src",a),t.load()}},I=function(t,e){var n=e._settings,r=t.tagName,a=E[r];if(a)return a(t,n),e._updateLoadingCount(1),void(e._elements=u(e._elements,t));w(t,n)},y=function(t,e){h?t.classList.add(e):t.className+=(t.className?" ":"")+e},L=function(t,e){h?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s+)"+e+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,"")},C=function(t,e){t&&t(e)},O=function(t,e,n){t.addEventListener(e,n)},k=function(t,e,n){t.removeEventListener(e,n)},A=function(t,e,n){O(t,"load",e),O(t,"loadeddata",e),O(t,"error",n)},z=function(t,e,n){k(t,"load",e),k(t,"loadeddata",e),k(t,"error",n)},N=function(t,e,n){var r=n._settings,a=e?r.class_loaded:r.class_error,s=e?r.callback_load:r.callback_error,i=t.target;L(i,r.class_loading),y(i,a),C(s,i),n._updateLoadingCount(-1)},x=function(t,e){var n=function n(a){N(a,!0,e),z(t,n,r)},r=function r(a){N(a,!1,e),z(t,n,r)};A(t,n,r)},R=["IMG","IFRAME","VIDEO"],M=function(e,n,r){t(e,r),n.unobserve(e)},j=function(t){var e=c(t);e&&(clearTimeout(e),o(t,null))},D=function(t,e,n){var r=n._settings.load_delay,a=c(t);a||(a=setTimeout(function(){M(t,e,n),j(t)},r),o(t,a))},T=function(t){return t.isIntersecting||t.intersectionRatio>0},U=function(t){return{root:t.container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}},F=function(t,e){this._settings=n(t),this._setObserver(),this._loadingCount=0,this.update(e)};return F.prototype={_manageIntersection:function(t){var e=this._observer,n=this._settings.load_delay,r=t.target;n?T(t)?D(r,e,this):j(r):T(t)&&M(r,e,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){g&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),U(this._settings)))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&C(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,r=t||n.container.querySelectorAll(n.elements_selector);this._elements=l(Array.prototype.slice.call(r)),!v&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var t=this;this._observer&&(this._elements.forEach(function(e){t._observer.unobserve(e)}),this._observer=null),this._elements=null,this._settings=null},load:function(e,n){t(e,this,n)},loadAll:function(){var t=this;this._elements.forEach(function(e){t.load(e)})}},_&&function(t,e){if(e)if(e.length)for(var n,r=0;n=e[r];r+=1)d(t,n);else d(t,e)}(F,window.lazyLoadOptions),F});
+var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(t[a]=n[a])}return t};define(function(){"use strict";function t(t,e,n){var a=e._settings;!n&&f(t)||(C(a.callback_enter,t),R.indexOf(t.tagName)>-1&&(x(t,e),I(t,a.class_loading)),y(t,e),d(t),C(a.callback_set,t))}var e=function(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t},n="undefined"!=typeof window,a=n&&!("onscroll"in window)||"undefined"!=typeof navigator&&/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),r=n&&"IntersectionObserver"in window,s=n&&"classList"in document.createElement("p"),i=n&&function(){var t=document.createElement("canvas");return!(!t.getContext||!t.getContext("2d"))&&0===t.toDataURL("image/webp").indexOf("data:image/webp")}(),o={elements_selector:"img",container:a||n?document:null,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"loading",class_loaded:"loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},c=function(t){return _extends({},o,t)},l=function(t,e){return t.getAttribute("data-"+e)},u=function(t,e,n){var a="data-"+e;null!==n?t.setAttribute(a,n):t.removeAttribute(a)},d=function(t){return u(t,"was-processed","true")},f=function(t){return"true"===l(t,"was-processed")},_=function(t,e){return u(t,"ll-timeout",e)},v=function(t){return l(t,"ll-timeout")},g=function(t){return t.filter(function(t){return!f(t)})},h=function(t,e){return t.filter(function(t){return t!==e})},b=function(t,e){var n,a=new t(e);try{n=new CustomEvent("LazyLoad::Initialized",{detail:{instance:a}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent("LazyLoad::Initialized",!1,!1,{instance:a})}window.dispatchEvent(n)},m=function(t,e,n,a){for(var r,s=0;r=t.children[s];s+=1)if("SOURCE"===r.tagName){var i=l(r,n);p(r,e,i,a)}},p=function(t,n,a,r){a&&t.setAttribute(n,e(a,r))},w=function(t,n){var a=i&&n.to_webp,r=l(t,n.data_src),s=l(t,n.data_bg);if(r){var o=e(r,a);t.style.backgroundImage='url("'+o+'")'}if(s){var c=e(s,a);t.style.backgroundImage=c}},E={IMG:function(t,e){var n=i&&e.to_webp,a=e.data_srcset,r=t.parentNode;r&&"PICTURE"===r.tagName&&m(r,"srcset",a,n);var s=l(t,e.data_sizes);p(t,"sizes",s);var o=l(t,a);p(t,"srcset",o,n);var c=l(t,e.data_src);p(t,"src",c,n)},IFRAME:function(t,e){var n=l(t,e.data_src);p(t,"src",n)},VIDEO:function(t,e){var n=e.data_src,a=l(t,n);m(t,"src",n),p(t,"src",a),t.load()}},y=function(t,e){var n=e._settings,a=t.tagName,r=E[a];if(r)return r(t,n),e._updateLoadingCount(1),void(e._elements=h(e._elements,t));w(t,n)},I=function(t,e){s?t.classList.add(e):t.className+=(t.className?" ":"")+e},L=function(t,e){s?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s+)"+e+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,"")},C=function(t,e){t&&t(e)},O=function(t,e,n){t.addEventListener(e,n)},k=function(t,e,n){t.removeEventListener(e,n)},A=function(t,e,n){O(t,"load",e),O(t,"loadeddata",e),O(t,"error",n)},z=function(t,e,n){k(t,"load",e),k(t,"loadeddata",e),k(t,"error",n)},N=function(t,e,n){var a=n._settings,r=e?a.class_loaded:a.class_error,s=e?a.callback_load:a.callback_error,i=t.target;L(i,a.class_loading),I(i,r),C(s,i),n._updateLoadingCount(-1)},x=function(t,e){var n=function n(r){N(r,!0,e),z(t,n,a)},a=function a(r){N(r,!1,e),z(t,n,a)};A(t,n,a)},R=["IMG","IFRAME","VIDEO"],M=function(e,n,a){t(e,a),n.unobserve(e)},j=function(t){var e=v(t);e&&(clearTimeout(e),_(t,null))},D=function(t,e,n){var a=n._settings.load_delay,r=v(t);r||(r=setTimeout(function(){M(t,e,n),j(t)},a),_(t,r))},T=function(t){return t.isIntersecting||t.intersectionRatio>0},U=function(t){return{root:t.container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}},F=function(t,e){this._settings=c(t),this._setObserver(),this._loadingCount=0,this.update(e)};return F.prototype={_manageIntersection:function(t){var e=this._observer,n=this._settings.load_delay,a=t.target;n?T(t)?D(a,e,this):j(a):T(t)&&M(a,e,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){r&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),U(this._settings)))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&C(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,r=t||n.container.querySelectorAll(n.elements_selector);this._elements=g(Array.prototype.slice.call(r)),!a&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var t=this;this._observer&&(this._elements.forEach(function(e){t._observer.unobserve(e)}),this._observer=null),this._elements=null,this._settings=null},load:function(e,n){t(e,this,n)},loadAll:function(){var t=this;this._elements.forEach(function(e){t.load(e)})}},n&&function(t,e){if(e)if(e.length)for(var n,a=0;n=e[a];a+=1)b(t,n);else b(t,e)}(F,window.lazyLoadOptions),F});
 //# sourceMappingURL=lazyload.amd.min.js.map

dist/lazyload.es2015.js

@@ -0,4 +1,35 @@
+const replaceExtToWebp = (value, condition) =>
+	condition ? value.replace(/\.(jpe?g|png)/gi, ".webp") : value;
+
+const detectWebp = () => {
+	var webpString = "image/webp";
+	var canvas = document.createElement("canvas");
+
+	if (canvas.getContext && canvas.getContext("2d")) {
+		return canvas.toDataURL(webpString).indexOf(`data:${webpString}`) === 0;
+	}
+
+	return false;
+};
+
+const runningOnBrowser = typeof window !== "undefined";
+
+const isBot =
+	(runningOnBrowser && !("onscroll" in window)) ||
+	(
+		typeof navigator !== "undefined" &&
+		/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent)
+	);
+
+const supportsIntersectionObserver =
+	runningOnBrowser && "IntersectionObserver" in window;
+
+const supportsClassList =
+	runningOnBrowser && "classList" in document.createElement("p");
+
+const supportsWebp = runningOnBrowser && detectWebp();
+
 const defaultSettings = {
 	elements_selector: "img",
-	container: document,
+	container: isBot || runningOnBrowser ? document : null,
 	threshold: 300,
@@ -96,30 +127,2 @@ thresholds: null,
 
-const replaceExtToWebp = (value, condition) =>
-	condition ? value.replace(/\.(jpe?g|png)/gi, ".webp") : value;
-
-const detectWebp = () => {
-	var webpString = "image/webp";
-	var canvas = document.createElement("canvas");
-
-	if (canvas.getContext && canvas.getContext("2d")) {
-		return canvas.toDataURL(webpString).indexOf(`data:${webpString}`) === 0;
-	}
-
-	return false;
-};
-
-const runningOnBrowser = typeof window !== "undefined";
-
-const isBot =
-	(runningOnBrowser && !("onscroll" in window)) ||
-	/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
-
-const supportsIntersectionObserver =
-	runningOnBrowser && "IntersectionObserver" in window;
-
-const supportsClassList =
-	runningOnBrowser && "classList" in document.createElement("p");
-
-const supportsWebp = runningOnBrowser && detectWebp();
-
 const setSourcesInChildren = function(
@@ -126,0 +129,0 @@ parentTag,

dist/lazyload.iife.js

@@ -6,5 +6,30 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
+	var replaceExtToWebp = function replaceExtToWebp(value, condition) {
+		return condition ? value.replace(/\.(jpe?g|png)/gi, ".webp") : value;
+	};
+
+	var detectWebp = function detectWebp() {
+		var webpString = "image/webp";
+		var canvas = document.createElement("canvas");
+
+		if (canvas.getContext && canvas.getContext("2d")) {
+			return canvas.toDataURL(webpString).indexOf("data:" + webpString) === 0;
+		}
+
+		return false;
+	};
+
+	var runningOnBrowser = typeof window !== "undefined";
+
+	var isBot = runningOnBrowser && !("onscroll" in window) || typeof navigator !== "undefined" && /(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
+
+	var supportsIntersectionObserver = runningOnBrowser && "IntersectionObserver" in window;
+
+	var supportsClassList = runningOnBrowser && "classList" in document.createElement("p");
+
+	var supportsWebp = runningOnBrowser && detectWebp();
+
 	var defaultSettings = {
 		elements_selector: "img",
-		container: document,
+		container: isBot || runningOnBrowser ? document : null,
 		threshold: 300,
@@ -111,27 +136,2 @@ thresholds: null,
 
-	var replaceExtToWebp = function replaceExtToWebp(value, condition) {
-		return condition ? value.replace(/\.(jpe?g|png)/gi, ".webp") : value;
-	};
-
-	var detectWebp = function detectWebp() {
-		var webpString = "image/webp";
-		var canvas = document.createElement("canvas");
-
-		if (canvas.getContext && canvas.getContext("2d")) {
-			return canvas.toDataURL(webpString).indexOf("data:" + webpString) === 0;
-		}
-
-		return false;
-	};
-
-	var runningOnBrowser = typeof window !== "undefined";
-
-	var isBot = runningOnBrowser && !("onscroll" in window) || /(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
-
-	var supportsIntersectionObserver = runningOnBrowser && "IntersectionObserver" in window;
-
-	var supportsClassList = runningOnBrowser && "classList" in document.createElement("p");
-
-	var supportsWebp = runningOnBrowser && detectWebp();
-
 	var setSourcesInChildren = function setSourcesInChildren(parentTag, attrName, dataAttrName, toWebpFlag) {
@@ -138,0 +138,0 @@ for (var i = 0, childTag; childTag = parentTag.children[i]; i += 1) {

dist/lazyload.iife.min.js

@@ -1,2 +0,2 @@
-var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(t[a]=n[a])}return t},LazyLoad=function(){"use strict";function t(t,e,n){var a=e._settings;!n&&i(t)||(C(a.callback_enter,t),R.indexOf(t.tagName)>-1&&(x(t,e),I(t,a.class_loading)),y(t,e),s(t),C(a.callback_set,t))}var e={elements_selector:"img",container:document,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"loading",class_loaded:"loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},n=function(t){return _extends({},e,t)},a=function(t,e){return t.getAttribute("data-"+e)},r=function(t,e,n){var a="data-"+e;null!==n?t.setAttribute(a,n):t.removeAttribute(a)},s=function(t){return r(t,"was-processed","true")},i=function(t){return"true"===a(t,"was-processed")},o=function(t,e){return r(t,"ll-timeout",e)},c=function(t){return a(t,"ll-timeout")},l=function(t){return t.filter(function(t){return!i(t)})},u=function(t,e){return t.filter(function(t){return t!==e})},d=function(t,e){var n,a=new t(e);try{n=new CustomEvent("LazyLoad::Initialized",{detail:{instance:a}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent("LazyLoad::Initialized",!1,!1,{instance:a})}window.dispatchEvent(n)},f=function(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t},_="undefined"!=typeof window,v=_&&!("onscroll"in window)||/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),g=_&&"IntersectionObserver"in window,h=_&&"classList"in document.createElement("p"),b=_&&function(){var t=document.createElement("canvas");return!(!t.getContext||!t.getContext("2d"))&&0===t.toDataURL("image/webp").indexOf("data:image/webp")}(),m=function(t,e,n,r){for(var s,i=0;s=t.children[i];i+=1)if("SOURCE"===s.tagName){var o=a(s,n);p(s,e,o,r)}},p=function(t,e,n,a){n&&t.setAttribute(e,f(n,a))},w=function(t,e){var n=b&&e.to_webp,r=a(t,e.data_src),s=a(t,e.data_bg);if(r){var i=f(r,n);t.style.backgroundImage='url("'+i+'")'}if(s){var o=f(s,n);t.style.backgroundImage=o}},E={IMG:function(t,e){var n=b&&e.to_webp,r=e.data_srcset,s=t.parentNode;s&&"PICTURE"===s.tagName&&m(s,"srcset",r,n);var i=a(t,e.data_sizes);p(t,"sizes",i);var o=a(t,r);p(t,"srcset",o,n);var c=a(t,e.data_src);p(t,"src",c,n)},IFRAME:function(t,e){var n=a(t,e.data_src);p(t,"src",n)},VIDEO:function(t,e){var n=e.data_src,r=a(t,n);m(t,"src",n),p(t,"src",r),t.load()}},y=function(t,e){var n=e._settings,a=t.tagName,r=E[a];if(r)return r(t,n),e._updateLoadingCount(1),void(e._elements=u(e._elements,t));w(t,n)},I=function(t,e){h?t.classList.add(e):t.className+=(t.className?" ":"")+e},L=function(t,e){h?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s+)"+e+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,"")},C=function(t,e){t&&t(e)},O=function(t,e,n){t.addEventListener(e,n)},k=function(t,e,n){t.removeEventListener(e,n)},A=function(t,e,n){O(t,"load",e),O(t,"loadeddata",e),O(t,"error",n)},z=function(t,e,n){k(t,"load",e),k(t,"loadeddata",e),k(t,"error",n)},N=function(t,e,n){var a=n._settings,r=e?a.class_loaded:a.class_error,s=e?a.callback_load:a.callback_error,i=t.target;L(i,a.class_loading),I(i,r),C(s,i),n._updateLoadingCount(-1)},x=function(t,e){var n=function n(r){N(r,!0,e),z(t,n,a)},a=function a(r){N(r,!1,e),z(t,n,a)};A(t,n,a)},R=["IMG","IFRAME","VIDEO"],M=function(e,n,a){t(e,a),n.unobserve(e)},j=function(t){var e=c(t);e&&(clearTimeout(e),o(t,null))},D=function(t,e,n){var a=n._settings.load_delay,r=c(t);r||(r=setTimeout(function(){M(t,e,n),j(t)},a),o(t,r))},T=function(t){return t.isIntersecting||t.intersectionRatio>0},U=function(t){return{root:t.container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}},F=function(t,e){this._settings=n(t),this._setObserver(),this._loadingCount=0,this.update(e)};return F.prototype={_manageIntersection:function(t){var e=this._observer,n=this._settings.load_delay,a=t.target;n?T(t)?D(a,e,this):j(a):T(t)&&M(a,e,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){g&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),U(this._settings)))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&C(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,a=t||n.container.querySelectorAll(n.elements_selector);this._elements=l(Array.prototype.slice.call(a)),!v&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var t=this;this._observer&&(this._elements.forEach(function(e){t._observer.unobserve(e)}),this._observer=null),this._elements=null,this._settings=null},load:function(e,n){t(e,this,n)},loadAll:function(){var t=this;this._elements.forEach(function(e){t.load(e)})}},_&&function(t,e){if(e)if(e.length)for(var n,a=0;n=e[a];a+=1)d(t,n);else d(t,e)}(F,window.lazyLoadOptions),F}();
+var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(t[a]=n[a])}return t},LazyLoad=function(){"use strict";function t(t,e,n){var a=e._settings;!n&&f(t)||(C(a.callback_enter,t),R.indexOf(t.tagName)>-1&&(x(t,e),I(t,a.class_loading)),y(t,e),d(t),C(a.callback_set,t))}var e=function(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t},n="undefined"!=typeof window,a=n&&!("onscroll"in window)||"undefined"!=typeof navigator&&/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),r=n&&"IntersectionObserver"in window,s=n&&"classList"in document.createElement("p"),i=n&&function(){var t=document.createElement("canvas");return!(!t.getContext||!t.getContext("2d"))&&0===t.toDataURL("image/webp").indexOf("data:image/webp")}(),o={elements_selector:"img",container:a||n?document:null,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"loading",class_loaded:"loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},c=function(t){return _extends({},o,t)},l=function(t,e){return t.getAttribute("data-"+e)},u=function(t,e,n){var a="data-"+e;null!==n?t.setAttribute(a,n):t.removeAttribute(a)},d=function(t){return u(t,"was-processed","true")},f=function(t){return"true"===l(t,"was-processed")},_=function(t,e){return u(t,"ll-timeout",e)},v=function(t){return l(t,"ll-timeout")},g=function(t){return t.filter(function(t){return!f(t)})},h=function(t,e){return t.filter(function(t){return t!==e})},b=function(t,e){var n,a=new t(e);try{n=new CustomEvent("LazyLoad::Initialized",{detail:{instance:a}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent("LazyLoad::Initialized",!1,!1,{instance:a})}window.dispatchEvent(n)},m=function(t,e,n,a){for(var r,s=0;r=t.children[s];s+=1)if("SOURCE"===r.tagName){var i=l(r,n);p(r,e,i,a)}},p=function(t,n,a,r){a&&t.setAttribute(n,e(a,r))},w=function(t,n){var a=i&&n.to_webp,r=l(t,n.data_src),s=l(t,n.data_bg);if(r){var o=e(r,a);t.style.backgroundImage='url("'+o+'")'}if(s){var c=e(s,a);t.style.backgroundImage=c}},E={IMG:function(t,e){var n=i&&e.to_webp,a=e.data_srcset,r=t.parentNode;r&&"PICTURE"===r.tagName&&m(r,"srcset",a,n);var s=l(t,e.data_sizes);p(t,"sizes",s);var o=l(t,a);p(t,"srcset",o,n);var c=l(t,e.data_src);p(t,"src",c,n)},IFRAME:function(t,e){var n=l(t,e.data_src);p(t,"src",n)},VIDEO:function(t,e){var n=e.data_src,a=l(t,n);m(t,"src",n),p(t,"src",a),t.load()}},y=function(t,e){var n=e._settings,a=t.tagName,r=E[a];if(r)return r(t,n),e._updateLoadingCount(1),void(e._elements=h(e._elements,t));w(t,n)},I=function(t,e){s?t.classList.add(e):t.className+=(t.className?" ":"")+e},L=function(t,e){s?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s+)"+e+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,"")},C=function(t,e){t&&t(e)},O=function(t,e,n){t.addEventListener(e,n)},k=function(t,e,n){t.removeEventListener(e,n)},A=function(t,e,n){O(t,"load",e),O(t,"loadeddata",e),O(t,"error",n)},z=function(t,e,n){k(t,"load",e),k(t,"loadeddata",e),k(t,"error",n)},N=function(t,e,n){var a=n._settings,r=e?a.class_loaded:a.class_error,s=e?a.callback_load:a.callback_error,i=t.target;L(i,a.class_loading),I(i,r),C(s,i),n._updateLoadingCount(-1)},x=function(t,e){var n=function n(r){N(r,!0,e),z(t,n,a)},a=function a(r){N(r,!1,e),z(t,n,a)};A(t,n,a)},R=["IMG","IFRAME","VIDEO"],M=function(e,n,a){t(e,a),n.unobserve(e)},j=function(t){var e=v(t);e&&(clearTimeout(e),_(t,null))},D=function(t,e,n){var a=n._settings.load_delay,r=v(t);r||(r=setTimeout(function(){M(t,e,n),j(t)},a),_(t,r))},T=function(t){return t.isIntersecting||t.intersectionRatio>0},U=function(t){return{root:t.container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}},F=function(t,e){this._settings=c(t),this._setObserver(),this._loadingCount=0,this.update(e)};return F.prototype={_manageIntersection:function(t){var e=this._observer,n=this._settings.load_delay,a=t.target;n?T(t)?D(a,e,this):j(a):T(t)&&M(a,e,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){r&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),U(this._settings)))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&C(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,r=t||n.container.querySelectorAll(n.elements_selector);this._elements=g(Array.prototype.slice.call(r)),!a&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var t=this;this._observer&&(this._elements.forEach(function(e){t._observer.unobserve(e)}),this._observer=null),this._elements=null,this._settings=null},load:function(e,n){t(e,this,n)},loadAll:function(){var t=this;this._elements.forEach(function(e){t.load(e)})}},n&&function(t,e){if(e)if(e.length)for(var n,a=0;n=e[a];a+=1)b(t,n);else b(t,e)}(F,window.lazyLoadOptions),F}();
 //# sourceMappingURL=lazyload.iife.min.js.map

dist/lazyload.js

@@ -10,5 +10,30 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
+	var replaceExtToWebp = function replaceExtToWebp(value, condition) {
+		return condition ? value.replace(/\.(jpe?g|png)/gi, ".webp") : value;
+	};
+
+	var detectWebp = function detectWebp() {
+		var webpString = "image/webp";
+		var canvas = document.createElement("canvas");
+
+		if (canvas.getContext && canvas.getContext("2d")) {
+			return canvas.toDataURL(webpString).indexOf('data:' + webpString) === 0;
+		}
+
+		return false;
+	};
+
+	var runningOnBrowser = typeof window !== "undefined";
+
+	var isBot = runningOnBrowser && !("onscroll" in window) || typeof navigator !== "undefined" && /(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
+
+	var supportsIntersectionObserver = runningOnBrowser && "IntersectionObserver" in window;
+
+	var supportsClassList = runningOnBrowser && "classList" in document.createElement("p");
+
+	var supportsWebp = runningOnBrowser && detectWebp();
+
 	var defaultSettings = {
 		elements_selector: "img",
-		container: document,
+		container: isBot || runningOnBrowser ? document : null,
 		threshold: 300,
@@ -115,27 +140,2 @@ thresholds: null,
 
-	var replaceExtToWebp = function replaceExtToWebp(value, condition) {
-		return condition ? value.replace(/\.(jpe?g|png)/gi, ".webp") : value;
-	};
-
-	var detectWebp = function detectWebp() {
-		var webpString = "image/webp";
-		var canvas = document.createElement("canvas");
-
-		if (canvas.getContext && canvas.getContext("2d")) {
-			return canvas.toDataURL(webpString).indexOf('data:' + webpString) === 0;
-		}
-
-		return false;
-	};
-
-	var runningOnBrowser = typeof window !== "undefined";
-
-	var isBot = runningOnBrowser && !("onscroll" in window) || /(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
-
-	var supportsIntersectionObserver = runningOnBrowser && "IntersectionObserver" in window;
-
-	var supportsClassList = runningOnBrowser && "classList" in document.createElement("p");
-
-	var supportsWebp = runningOnBrowser && detectWebp();
-
 	var setSourcesInChildren = function setSourcesInChildren(parentTag, attrName, dataAttrName, toWebpFlag) {
@@ -142,0 +142,0 @@ for (var i = 0, childTag; childTag = parentTag.children[i]; i += 1) {

dist/lazyload.min.js

@@ -1,2 +0,2 @@
-var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};!function(t,e){"object"===("undefined"==typeof exports?"undefined":_typeof(exports))&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.LazyLoad=e()}(this,function(){"use strict";function t(t,e,n){var o=e._settings;!n&&i(t)||(C(o.callback_enter,t),R.indexOf(t.tagName)>-1&&(N(t,e),I(t,o.class_loading)),E(t,e),a(t),C(o.callback_set,t))}var e={elements_selector:"img",container:document,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"loading",class_loaded:"loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},n=function(t){return _extends({},e,t)},o=function(t,e){return t.getAttribute("data-"+e)},r=function(t,e,n){var o="data-"+e;null!==n?t.setAttribute(o,n):t.removeAttribute(o)},a=function(t){return r(t,"was-processed","true")},i=function(t){return"true"===o(t,"was-processed")},s=function(t,e){return r(t,"ll-timeout",e)},c=function(t){return o(t,"ll-timeout")},l=function(t){return t.filter(function(t){return!i(t)})},u=function(t,e){return t.filter(function(t){return t!==e})},d=function(t,e){var n,o=new t(e);try{n=new CustomEvent("LazyLoad::Initialized",{detail:{instance:o}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent("LazyLoad::Initialized",!1,!1,{instance:o})}window.dispatchEvent(n)},f=function(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t},_="undefined"!=typeof window,v=_&&!("onscroll"in window)||/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),g=_&&"IntersectionObserver"in window,h=_&&"classList"in document.createElement("p"),b=_&&function(){var t=document.createElement("canvas");return!(!t.getContext||!t.getContext("2d"))&&0===t.toDataURL("image/webp").indexOf("data:image/webp")}(),m=function(t,e,n,r){for(var a,i=0;a=t.children[i];i+=1)if("SOURCE"===a.tagName){var s=o(a,n);p(a,e,s,r)}},p=function(t,e,n,o){n&&t.setAttribute(e,f(n,o))},y=function(t,e){var n=b&&e.to_webp,r=o(t,e.data_src),a=o(t,e.data_bg);if(r){var i=f(r,n);t.style.backgroundImage='url("'+i+'")'}if(a){var s=f(a,n);t.style.backgroundImage=s}},w={IMG:function(t,e){var n=b&&e.to_webp,r=e.data_srcset,a=t.parentNode;a&&"PICTURE"===a.tagName&&m(a,"srcset",r,n);var i=o(t,e.data_sizes);p(t,"sizes",i);var s=o(t,r);p(t,"srcset",s,n);var c=o(t,e.data_src);p(t,"src",c,n)},IFRAME:function(t,e){var n=o(t,e.data_src);p(t,"src",n)},VIDEO:function(t,e){var n=e.data_src,r=o(t,n);m(t,"src",n),p(t,"src",r),t.load()}},E=function(t,e){var n=e._settings,o=t.tagName,r=w[o];if(r)return r(t,n),e._updateLoadingCount(1),void(e._elements=u(e._elements,t));y(t,n)},I=function(t,e){h?t.classList.add(e):t.className+=(t.className?" ":"")+e},L=function(t,e){h?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s+)"+e+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,"")},C=function(t,e){t&&t(e)},O=function(t,e,n){t.addEventListener(e,n)},k=function(t,e,n){t.removeEventListener(e,n)},x=function(t,e,n){O(t,"load",e),O(t,"loadeddata",e),O(t,"error",n)},A=function(t,e,n){k(t,"load",e),k(t,"loadeddata",e),k(t,"error",n)},z=function(t,e,n){var o=n._settings,r=e?o.class_loaded:o.class_error,a=e?o.callback_load:o.callback_error,i=t.target;L(i,o.class_loading),I(i,r),C(a,i),n._updateLoadingCount(-1)},N=function(t,e){var n=function n(r){z(r,!0,e),A(t,n,o)},o=function o(r){z(r,!1,e),A(t,n,o)};x(t,n,o)},R=["IMG","IFRAME","VIDEO"],S=function(e,n,o){t(e,o),n.unobserve(e)},M=function(t){var e=c(t);e&&(clearTimeout(e),s(t,null))},j=function(t,e,n){var o=n._settings.load_delay,r=c(t);r||(r=setTimeout(function(){S(t,e,n),M(t)},o),s(t,r))},D=function(t){return t.isIntersecting||t.intersectionRatio>0},T=function(t){return{root:t.container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}},U=function(t,e){this._settings=n(t),this._setObserver(),this._loadingCount=0,this.update(e)};return U.prototype={_manageIntersection:function(t){var e=this._observer,n=this._settings.load_delay,o=t.target;n?D(t)?j(o,e,this):M(o):D(t)&&S(o,e,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){g&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),T(this._settings)))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&C(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,o=t||n.container.querySelectorAll(n.elements_selector);this._elements=l(Array.prototype.slice.call(o)),!v&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var t=this;this._observer&&(this._elements.forEach(function(e){t._observer.unobserve(e)}),this._observer=null),this._elements=null,this._settings=null},load:function(e,n){t(e,this,n)},loadAll:function(){var t=this;this._elements.forEach(function(e){t.load(e)})}},_&&function(t,e){if(e)if(e.length)for(var n,o=0;n=e[o];o+=1)d(t,n);else d(t,e)}(U,window.lazyLoadOptions),U});
+var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};!function(t,e){"object"===("undefined"==typeof exports?"undefined":_typeof(exports))&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.LazyLoad=e()}(this,function(){"use strict";function t(t,e,n){var o=e._settings;!n&&f(t)||(C(o.callback_enter,t),R.indexOf(t.tagName)>-1&&(N(t,e),I(t,o.class_loading)),E(t,e),d(t),C(o.callback_set,t))}var e=function(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t},n="undefined"!=typeof window,o=n&&!("onscroll"in window)||"undefined"!=typeof navigator&&/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),r=n&&"IntersectionObserver"in window,a=n&&"classList"in document.createElement("p"),i=n&&function(){var t=document.createElement("canvas");return!(!t.getContext||!t.getContext("2d"))&&0===t.toDataURL("image/webp").indexOf("data:image/webp")}(),s={elements_selector:"img",container:o||n?document:null,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"loading",class_loaded:"loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},c=function(t){return _extends({},s,t)},l=function(t,e){return t.getAttribute("data-"+e)},u=function(t,e,n){var o="data-"+e;null!==n?t.setAttribute(o,n):t.removeAttribute(o)},d=function(t){return u(t,"was-processed","true")},f=function(t){return"true"===l(t,"was-processed")},_=function(t,e){return u(t,"ll-timeout",e)},v=function(t){return l(t,"ll-timeout")},g=function(t){return t.filter(function(t){return!f(t)})},h=function(t,e){return t.filter(function(t){return t!==e})},b=function(t,e){var n,o=new t(e);try{n=new CustomEvent("LazyLoad::Initialized",{detail:{instance:o}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent("LazyLoad::Initialized",!1,!1,{instance:o})}window.dispatchEvent(n)},m=function(t,e,n,o){for(var r,a=0;r=t.children[a];a+=1)if("SOURCE"===r.tagName){var i=l(r,n);p(r,e,i,o)}},p=function(t,n,o,r){o&&t.setAttribute(n,e(o,r))},y=function(t,n){var o=i&&n.to_webp,r=l(t,n.data_src),a=l(t,n.data_bg);if(r){var s=e(r,o);t.style.backgroundImage='url("'+s+'")'}if(a){var c=e(a,o);t.style.backgroundImage=c}},w={IMG:function(t,e){var n=i&&e.to_webp,o=e.data_srcset,r=t.parentNode;r&&"PICTURE"===r.tagName&&m(r,"srcset",o,n);var a=l(t,e.data_sizes);p(t,"sizes",a);var s=l(t,o);p(t,"srcset",s,n);var c=l(t,e.data_src);p(t,"src",c,n)},IFRAME:function(t,e){var n=l(t,e.data_src);p(t,"src",n)},VIDEO:function(t,e){var n=e.data_src,o=l(t,n);m(t,"src",n),p(t,"src",o),t.load()}},E=function(t,e){var n=e._settings,o=t.tagName,r=w[o];if(r)return r(t,n),e._updateLoadingCount(1),void(e._elements=h(e._elements,t));y(t,n)},I=function(t,e){a?t.classList.add(e):t.className+=(t.className?" ":"")+e},L=function(t,e){a?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s+)"+e+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,"")},C=function(t,e){t&&t(e)},O=function(t,e,n){t.addEventListener(e,n)},k=function(t,e,n){t.removeEventListener(e,n)},x=function(t,e,n){O(t,"load",e),O(t,"loadeddata",e),O(t,"error",n)},A=function(t,e,n){k(t,"load",e),k(t,"loadeddata",e),k(t,"error",n)},z=function(t,e,n){var o=n._settings,r=e?o.class_loaded:o.class_error,a=e?o.callback_load:o.callback_error,i=t.target;L(i,o.class_loading),I(i,r),C(a,i),n._updateLoadingCount(-1)},N=function(t,e){var n=function n(r){z(r,!0,e),A(t,n,o)},o=function o(r){z(r,!1,e),A(t,n,o)};x(t,n,o)},R=["IMG","IFRAME","VIDEO"],S=function(e,n,o){t(e,o),n.unobserve(e)},M=function(t){var e=v(t);e&&(clearTimeout(e),_(t,null))},j=function(t,e,n){var o=n._settings.load_delay,r=v(t);r||(r=setTimeout(function(){S(t,e,n),M(t)},o),_(t,r))},D=function(t){return t.isIntersecting||t.intersectionRatio>0},T=function(t){return{root:t.container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}},U=function(t,e){this._settings=c(t),this._setObserver(),this._loadingCount=0,this.update(e)};return U.prototype={_manageIntersection:function(t){var e=this._observer,n=this._settings.load_delay,o=t.target;n?D(t)?j(o,e,this):M(o):D(t)&&S(o,e,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){r&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),T(this._settings)))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&C(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,r=t||n.container.querySelectorAll(n.elements_selector);this._elements=g(Array.prototype.slice.call(r)),!o&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var t=this;this._observer&&(this._elements.forEach(function(e){t._observer.unobserve(e)}),this._observer=null),this._elements=null,this._settings=null},load:function(e,n){t(e,this,n)},loadAll:function(){var t=this;this._elements.forEach(function(e){t.load(e)})}},n&&function(t,e){if(e)if(e.length)for(var n,o=0;n=e[o];o+=1)b(t,n);else b(t,e)}(U,window.lazyLoadOptions),U});
 //# sourceMappingURL=lazyload.min.js.map

gulpfile.js

@@ -125,2 +125,2 @@ var gulp = require("gulp");
 
-gulp.task("default", ["lint", "dist-umd", "dist-es", "dist-amd", "dist-iife"]);
+gulp.task("default", gulp.parallel("lint", "dist-umd", "dist-es", "dist-amd", "dist-iife"));

package.json

 {
 	"name": "vanilla-lazyload",
-	"version": "10.19.0",
+	"version": "10.19.1",
 	"description": "A fast, lightweight script to load images as they enter the viewport. SEO friendly, it supports responsive images (both srcset + sizes and picture) and progressive JPEG",
@@ -11,3 +11,3 @@ "main": "dist/lazyload.min.js",
 		"babel-preset-es2015": "^6.24.1",
-		"gulp": "^3.9.1",
+		"gulp": "^4.0.0",
 		"gulp-babel": "^7.0.1",
@@ -14,0 +14,0 @@ "gulp-eslint": "^4.0.0",

README.md

@@ -15,5 +15,5 @@ LazyLoad is a fast, lightweight and flexible script that _speeds up your web application_ by **loading images, video or iframes as they enter the viewport**. It's written in plain "vanilla" JavaScript, uses [Intersection Observers](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API), and supports [responsive images](https://alistapart.com/article/responsive-images-in-practice). It's also SEO-friendly and it has some other [notable features](#-notable-features).
 
-Version **8.x** is recommended for [local install](#local-install), but you can be smart and [conditionally load the best version](#conditional-load) from cdnjs instead.
+Version **8.x** is recommended for [local install](#local-install), but you can be smart and [conditionally load the best version](#conditional-load) from [jsdelivr](https://www.jsdelivr.com) instead.
 
-### Include as script from cdnjs
+### Include as script from jsdelivr
 
@@ -23,3 +23,3 @@ Version 8.x - [versions info](#versions-information)
 ```html
-<script src="https://cdnjs.cloudflare.com/ajax/libs/vanilla-lazyload/8.16.0/lazyload.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@8.17.0/dist/lazyload.min.js"></script>
 ```
@@ -30,3 +30,3 @@
 ```html
-<script src="https://cdnjs.cloudflare.com/ajax/libs/vanilla-lazyload/10.17.0/lazyload.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@10.19.1/dist/lazyload.min.js"></script>
 ```
@@ -51,5 +51,5 @@
     var s = d.createElement("script"); 
-    var v = !("IntersectionObserver" in w) ? "8.16.0" : "10.17.0";
+    var v = !("IntersectionObserver" in w) ? "8.17.0" : "10.19.1";
     s.async = true; // This includes the script as async. See the "recipes" section for more information about async loading of LazyLoad.
-    s.src = "https://cdnjs.cloudflare.com/ajax/libs/vanilla-lazyload/" + v + "/lazyload.min.js";
+    s.src = "https://cdn.jsdelivr.net/npm/vanilla-lazyload@" + v + "/dist/lazyload.min.js";
     w.lazyLoadOptions = {/* Your options here */};
@@ -70,3 +70,3 @@ b.appendChild(s);
 ```js
-define("vanilla-lazyLoad", ["https://cdnjs.cloudflare.com/ajax/libs/vanilla-lazyload/8.16.0/lazyload.amd.min.js"], function (LazyLoad) {
+define("vanilla-lazyLoad", ["https://cdn.jsdelivr.net/npm/vanilla-lazyload@10.19.1/dist/lazyload.amd.min.js"], function (LazyLoad) {
     return LazyLoad;
@@ -79,4 +79,4 @@ });
 ```js
-var v = !("IntersectionObserver" in window) ? "8.16.0" : "10.17.0";
-define("vanilla-lazyLoad", ["https://cdnjs.cloudflare.com/ajax/libs/vanilla-lazyload/" + v + "/lazyload.amd.min.js"], function (LazyLoad) {
+var v = !("IntersectionObserver" in window) ? "8.17.0" : "10.19.1";
+define("vanilla-lazyLoad", ["https://cdn.jsdelivr.net/npm/vanilla-lazyload@" + v + "/dist/lazyload.amd.min.js"], function (LazyLoad) {
     return LazyLoad;
@@ -95,3 +95,3 @@ });
 ```
-npm install vanilla-lazyload@8.16.0
+npm install vanilla-lazyload@8.17.0
 ```
@@ -102,3 +102,3 @@
 ```
-npm install vanilla-lazyload@10.17.0
+npm install vanilla-lazyload@10.19.1
 ```
@@ -745,6 +745,7 @@
 | `load_delay`        | The time (in milliseconds) each image needs to stay inside the viewport before its loading begins.<br>Available only in version 10.x, gracefully degrades on version 8.x                                                                                                                                                                                                                                                                                                                                                                                | `0`           | `300`                                    |
-| `callback_enter`    | A function to be called when the DOM element enters the viewport.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `null`        | `(el)=>{console.log("Entered", el)}`     |
-| `callback_set`      | A function to be called after the src of an image is set in the DOM.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `null`        | `(el)=>{console.log("Set", el)}`         |
-| `callback_load`     | A function to be called when an element was loaded.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | `null`        | `(el)=>{console.log("Loaded", el)}`      |
-| `callback_error`    | A function to be called when an element triggers an error.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | `null`        | `(el)=>{console.log("Error", el)}`       |
+| `callback_enter`    | A function which is called when an element enters the viewport.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `null`        | `(el)=>{console.log("Entered", el)}`     |
+| `callback_set`      | A function which is called after the `src`/`srcset` of an element is set in the DOM.                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `null`        | `(el)=>{console.log("Set", el)}`         |
+| `callback_load`     | A function which is called when an element was loaded.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `null`        | `(el)=>{console.log("Loaded", el)}`      |
+| `callback_error`    | A function which is called when an element triggers an error.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | `null`        | `(el)=>{console.log("Error", el)}`       |
+| `callback_finish`   | A function which is called when there are no more elements to load and all elements have been downloaded.                                                                                                                                                                                                                                                                                                                                                                                                                                               | `null`        | `()=>{console.log("Finish")}`            |
 
@@ -751,0 +752,0 @@ ### Methods

src/lazyload.defaults.js

@@ -0,4 +1,6 @@
+import { isBot, runningOnBrowser } from "./lazyload.environment";
+
 const defaultSettings = {
 	elements_selector: "img",
-	container: document,
+	container: isBot || runningOnBrowser ? document : null,
 	threshold: 300,
@@ -5,0 +7,0 @@ thresholds: null,

src/lazyload.environment.js

@@ -7,3 +7,6 @@ import { detectWebp } from "./lazyload.webp";
 	(runningOnBrowser && !("onscroll" in window)) ||
-	/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
+	(
+		typeof navigator !== "undefined" &&
+		/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent)
+	);
 
@@ -10,0 +13,0 @@ export const supportsIntersectionObserver =

typings/lazyload.d.ts

 interface ILazyLoadOptions {
-    threshold?: number;
-    container?: HTMLElement;
-    elements_selector?: any;
-    throttle?: number;
-    data_src?: string;
-    data_srcset?: string;
-    class_loading?: string;
-    class_loaded?: string;
-    class_error?: string;
-    skip_invisible?: boolean;
-    show_while_loading?: boolean;
-    callback_set?: (elt:HTMLImageElement) => void;
-    callback_load?: (elt:HTMLImageElement) => void;
-    callback_error?: (elt:HTMLImageElement) => void;
-    callback_processed?: (elts:HTMLImageElement[]) => void;
-    placeholder?: string;
+	elements_selector?: string;
+	container?: HTMLElement;
+	threshold?: number;
+	thresholds?: string;
+	throttle?: number;
+	data_src?: string;
+	data_srcset?: string;
+	data_sizes?: string;
+	data_bg?: string;
+	class_loading?: string;
+	class_loaded?: string;
+	class_error?: string;
+	skip_invisible?: boolean;
+	callback_load?: (elt: HTMLImageElement) => void;
+	callback_error?: (elt: HTMLImageElement) => void;
+	callback_set?: (elt: HTMLImageElement) => void;
+	callback_enter?: (elt: HTMLImageElement) => void;
+	callback_finish?: () => void;
+	to_webp?: boolean;
 }
 interface ILazyLoad {
-    new (options?: ILazyLoadOptions);
-    update();
-    destroy();
-    handleScroll();
+	new (options?: ILazyLoadOptions, elements?: NodeListOf<HTMLImageElement>);
+	update: (elements?: NodeListOf<HTMLImageElement>) => void;
+	destroy: () => void;
+	load:(element: HTMLImageElement, force?: boolean) => void;
+	loadAll: () => void;
 }
-declare var LazyLoad: ILazyLoad;
+declare var LazyLoad: ILazyLoad;

No alert changes

Improved metrics

Total package byte prevSize

1156516

increased by0.19%

Lines of code

2511

increased by0.48%

Number of lines in readme file

785

increased by0.13%

No dependency changes