vanilla-lazyload - npm Package Compare versions

Comparing version 8.1.0 to 8.2.0

.eslintrc.json

@@ -37,3 +37,3 @@ {
         "no-global-assign": 1,
-        "no-implicit-coercion": 1,
+        "no-implicit-coercion": 0,
         "no-implicit-globals": 1,
@@ -40,0 +40,0 @@ "no-implied-eval": 1,

dist/lazyload.es2015.js

@@ -13,3 +13,3 @@ (function (global, factory) {
     data_src: "original",
-    data_srcset: "originalSet",
+    data_srcset: "original-set",
     class_loading: "loading",
@@ -95,2 +95,12 @@ class_loaded: "loaded",
 
+const dataPrefix = "data-";
+
+const getData = (element, attribute) => {
+    return element.getAttribute(dataPrefix + attribute);
+};
+
+const setData = (element, attribute, value) => {
+    return element.setAttribute(dataPrefix + attribute, value);
+};
+
 const setSourcesForPicture = function (element, srcsetDataAttribute) {
@@ -104,3 +114,3 @@ const parent = element.parentElement;
         if (pictureChild.tagName === "SOURCE") {
-            let sourceSrcset = pictureChild.dataset[srcsetDataAttribute];
+            let sourceSrcset = getData(pictureChild, srcsetDataAttribute);
             if (sourceSrcset) {
@@ -115,6 +125,6 @@ pictureChild.setAttribute("srcset", sourceSrcset);
     const tagName = element.tagName;
-    const elementSrc = element.dataset[srcDataAttribute];
+    const elementSrc = getData(element, srcDataAttribute);
     if (tagName === "IMG") {
         setSourcesForPicture(element, srcsetDataAttribute);
-        const imgSrcset = element.dataset[srcsetDataAttribute];
+        const imgSrcset = getData(element, srcsetDataAttribute);
         if (imgSrcset) {
@@ -139,2 +149,20 @@ element.setAttribute("srcset", imgSrcset);
 
+const supportsClassList = !!document.body.classList;
+
+const addClass = (element, className) => {
+    if (supportsClassList) {
+        element.classList.add(className);
+        return;
+    }
+    element.className += (element.className ? " " : "") + className;
+};
+
+const removeClass = (element, className) => {
+    if (supportsClassList) {
+        element.classList.remove(className);
+        return;
+    }
+    element.className = element.className.replace(new RegExp("(^|\\s+)" + className + "(\\s+|$)"), " ").replace(/^\s+/, "").replace(/\s+$/, "");
+};
+
 /*
@@ -171,4 +199,4 @@ * Constructor
             element.removeEventListener("error", errorCallback);
-            element.classList.remove(settings.class_loading);
-            element.classList.add(settings.class_error);
+            removeClass(element, settings.class_loading);
+            addClass(element, settings.class_error);
             callCallback(settings.callback_error, element);
@@ -180,4 +208,4 @@ };
             if (!settings) { return; }
-            element.classList.remove(settings.class_loading);
-            element.classList.add(settings.class_loaded);
+            removeClass(element, settings.class_loading);
+            addClass(element, settings.class_loaded);
             element.removeEventListener("load", loadCallback);
@@ -192,3 +220,3 @@ element.removeEventListener("error", errorCallback);
             element.addEventListener("error", errorCallback);
-            element.classList.add(settings.class_loading);
+            addClass(element, settings.class_loading);
         }
@@ -218,3 +246,3 @@
                 if (firstLoop) {
-                    element.classList.add(settings.class_initial);
+                    addClass(element, settings.class_initial);
                 }
@@ -225,3 +253,3 @@ /* Start loading the image */
                 processedIndexes.push(i);
-                element.dataset.wasProcessed = true;
+                setData(element, "was-processed", true);
             }
@@ -254,3 +282,3 @@ }
             /* If the element has already been processed, skip it */
-            if (element.dataset.wasProcessed) {
+            if (getData(element, "was-processed")) {
                 elementsToPurge.push(i);
@@ -257,0 +285,0 @@ }

dist/lazyload.js

@@ -16,3 +16,3 @@ 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; };
         data_src: "original",
-        data_srcset: "originalSet",
+        data_srcset: "original-set",
         class_loading: "loading",
@@ -92,2 +92,12 @@ class_loaded: "loaded",
 
+    var dataPrefix = "data-";
+
+    var getData = function getData(element, attribute) {
+        return element.getAttribute(dataPrefix + attribute);
+    };
+
+    var setData = function setData(element, attribute, value) {
+        return element.setAttribute(dataPrefix + attribute, value);
+    };
+
     var setSourcesForPicture = function setSourcesForPicture(element, srcsetDataAttribute) {
@@ -101,3 +111,3 @@ var parent = element.parentElement;
             if (pictureChild.tagName === "SOURCE") {
-                var sourceSrcset = pictureChild.dataset[srcsetDataAttribute];
+                var sourceSrcset = getData(pictureChild, srcsetDataAttribute);
                 if (sourceSrcset) {
@@ -112,6 +122,6 @@ pictureChild.setAttribute("srcset", sourceSrcset);
         var tagName = element.tagName;
-        var elementSrc = element.dataset[srcDataAttribute];
+        var elementSrc = getData(element, srcDataAttribute);
         if (tagName === "IMG") {
             setSourcesForPicture(element, srcsetDataAttribute);
-            var imgSrcset = element.dataset[srcsetDataAttribute];
+            var imgSrcset = getData(element, srcsetDataAttribute);
             if (imgSrcset) {
@@ -136,2 +146,20 @@ element.setAttribute("srcset", imgSrcset);
 
+    var supportsClassList = !!document.body.classList;
+
+    var addClass = function addClass(element, className) {
+        if (supportsClassList) {
+            element.classList.add(className);
+            return;
+        }
+        element.className += (element.className ? " " : "") + className;
+    };
+
+    var removeClass = function removeClass(element, className) {
+        if (supportsClassList) {
+            element.classList.remove(className);
+            return;
+        }
+        element.className = element.className.replace(new RegExp("(^|\\s+)" + className + "(\\s+|$)"), " ").replace(/^\s+/, "").replace(/\s+$/, "");
+    };
+
     /*
@@ -170,4 +198,4 @@ * Constructor
                 element.removeEventListener("error", errorCallback);
-                element.classList.remove(settings.class_loading);
-                element.classList.add(settings.class_error);
+                removeClass(element, settings.class_loading);
+                addClass(element, settings.class_error);
                 callCallback(settings.callback_error, element);
@@ -181,4 +209,4 @@ };
                 }
-                element.classList.remove(settings.class_loading);
-                element.classList.add(settings.class_loaded);
+                removeClass(element, settings.class_loading);
+                addClass(element, settings.class_loaded);
                 element.removeEventListener("load", loadCallback);
@@ -193,3 +221,3 @@ element.removeEventListener("error", errorCallback);
                 element.addEventListener("error", errorCallback);
-                element.classList.add(settings.class_loading);
+                addClass(element, settings.class_loading);
             }
@@ -219,3 +247,3 @@
                     if (firstLoop) {
-                        element.classList.add(settings.class_initial);
+                        addClass(element, settings.class_initial);
                     }
@@ -226,3 +254,3 @@ /* Start loading the image */
                     processedIndexes.push(i);
-                    element.dataset.wasProcessed = true;
+                    setData(element, "was-processed", true);
                 }
@@ -255,3 +283,3 @@ }
                 /* If the element has already been processed, skip it */
-                if (element.dataset.wasProcessed) {
+                if (getData(element, "was-processed")) {
                     elementsToPurge.push(i);
@@ -258,0 +286,0 @@ }

dist/lazyload.min.js

@@ -1,1 +0,1 @@
-var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var o=arguments[e];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[n]=o[n])}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";var t={elements_selector:"img",container:window,threshold:300,throttle:150,data_src:"original",data_srcset:"originalSet",class_loading:"loading",class_loaded:"loaded",class_error:"error",class_initial:"initial",skip_invisible:!0,callback_load:null,callback_error:null,callback_set:null,callback_processed:null},e=!("onscroll"in window)||/glebot/.test(navigator.userAgent),o=function(t,e){t&&t(e)},n=function(t){return t.getBoundingClientRect().top+window.pageYOffset-t.ownerDocument.documentElement.clientTop},i=function(t,e,o){return(e===window?window.innerHeight+window.pageYOffset:n(e)+e.offsetHeight)<=n(t)-o},s=function(t){return t.getBoundingClientRect().left+window.pageXOffset-t.ownerDocument.documentElement.clientLeft},l=function(t,e,o){var n=window.innerWidth;return(e===window?n+window.pageXOffset:s(e)+n)<=s(t)-o},r=function(t,e,o){return(e===window?window.pageYOffset:n(e))>=n(t)+o+t.offsetHeight},a=function(t,e,o){return(e===window?window.pageXOffset:s(e))>=s(t)+o+t.offsetWidth},c=function(t,e,o){return!(i(t,e,o)||r(t,e,o)||l(t,e,o)||a(t,e,o))},d=function(t,e){var o=new t(e),n=new CustomEvent("LazyLoad::Initialized",{detail:{instance:o}});window.dispatchEvent(n)},u=function(t,e){var o=t.parentElement;if("PICTURE"===o.tagName)for(var n=0;n<o.children.length;n++){var i=o.children[n];if("SOURCE"===i.tagName){var s=i.dataset[e];s&&i.setAttribute("srcset",s)}}},h=function(t,e,o){var n=t.tagName,i=t.dataset[o];if("IMG"===n){u(t,e);var s=t.dataset[e];return s&&t.setAttribute("srcset",s),void(i&&t.setAttribute("src",i))}"IFRAME"!==n?i&&(t.style.backgroundImage='url("'+i+'")'):i&&t.setAttribute("src",i)},_=function(e){this._settings=_extends({},t,e),this._queryOriginNode=this._settings.container===window?document:this._settings.container,this._previousLoopTime=0,this._loopTimeout=null,this._boundHandleScroll=this.handleScroll.bind(this),this._isFirstLoop=!0,window.addEventListener("resize",this._boundHandleScroll),this.update()};_.prototype={_reveal:function(t){var e=this._settings,n=function n(){e&&(t.removeEventListener("load",i),t.removeEventListener("error",n),t.classList.remove(e.class_loading),t.classList.add(e.class_error),o(e.callback_error,t))},i=function i(){e&&(t.classList.remove(e.class_loading),t.classList.add(e.class_loaded),t.removeEventListener("load",i),t.removeEventListener("error",n),o(e.callback_load,t))};"IMG"!==t.tagName&&"IFRAME"!==t.tagName||(t.addEventListener("load",i),t.addEventListener("error",n),t.classList.add(e.class_loading)),h(t,e.data_srcset,e.data_src),o(e.callback_set,t)},_loopThroughElements:function(){var t=this._settings,n=this._elements,i=n?n.length:0,s=void 0,l=[],r=this._isFirstLoop;for(s=0;s<i;s++){var a=n[s];t.skip_invisible&&null===a.offsetParent||(e||c(a,t.container,t.threshold))&&(r&&a.classList.add(t.class_initial),this._reveal(a),l.push(s),a.dataset.wasProcessed=!0)}for(;l.length;)n.splice(l.pop(),1),o(t.callback_processed,n.length);0===i&&this._stopScrollHandler(),r&&(this._isFirstLoop=!1)},_purgeElements:function(){var t=this._elements,e=t.length,o=void 0,n=[];for(o=0;o<e;o++)t[o].dataset.wasProcessed&&n.push(o);for(;n.length>0;)t.splice(n.pop(),1)},_startScrollHandler:function(){this._isHandlingScroll||(this._isHandlingScroll=!0,this._settings.container.addEventListener("scroll",this._boundHandleScroll))},_stopScrollHandler:function(){this._isHandlingScroll&&(this._isHandlingScroll=!1,this._settings.container.removeEventListener("scroll",this._boundHandleScroll))},handleScroll:function(){var t=this._settings.throttle;if(0!==t){var e=Date.now(),o=t-(e-this._previousLoopTime);o<=0||o>t?(this._loopTimeout&&(clearTimeout(this._loopTimeout),this._loopTimeout=null),this._previousLoopTime=e,this._loopThroughElements()):this._loopTimeout||(this._loopTimeout=setTimeout(function(){this._previousLoopTime=Date.now(),this._loopTimeout=null,this._loopThroughElements()}.bind(this),o))}else this._loopThroughElements()},update:function(){this._elements=Array.prototype.slice.call(this._queryOriginNode.querySelectorAll(this._settings.elements_selector)),this._purgeElements(),this._loopThroughElements(),this._startScrollHandler()},destroy:function(){window.removeEventListener("resize",this._boundHandleScroll),this._loopTimeout&&(clearTimeout(this._loopTimeout),this._loopTimeout=null),this._stopScrollHandler(),this._elements=null,this._queryOriginNode=null,this._settings=null}};var f=window.lazyLoadOptions;return f&&function(t,e){var o=e.length;if(o)for(var n=0;n<o;n++)d(t,e[n]);else d(t,e)}(_,f),_});
+var _extends=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};!function(e,t){"object"===("undefined"==typeof exports?"undefined":_typeof(exports))&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.LazyLoad=t()}(this,function(){"use strict";var e={elements_selector:"img",container:window,threshold:300,throttle:150,data_src:"original",data_srcset:"original-set",class_loading:"loading",class_loaded:"loaded",class_error:"error",class_initial:"initial",skip_invisible:!0,callback_load:null,callback_error:null,callback_set:null,callback_processed:null},t=!("onscroll"in window)||/glebot/.test(navigator.userAgent),n=function(e,t){e&&e(t)},o=function(e){return e.getBoundingClientRect().top+window.pageYOffset-e.ownerDocument.documentElement.clientTop},i=function(e,t,n){return(t===window?window.innerHeight+window.pageYOffset:o(t)+t.offsetHeight)<=o(e)-n},s=function(e){return e.getBoundingClientRect().left+window.pageXOffset-e.ownerDocument.documentElement.clientLeft},r=function(e,t,n){var o=window.innerWidth;return(t===window?o+window.pageXOffset:s(t)+o)<=s(e)-n},l=function(e,t,n){return(t===window?window.pageYOffset:o(t))>=o(e)+n+e.offsetHeight},a=function(e,t,n){return(t===window?window.pageXOffset:s(t))>=s(e)+n+e.offsetWidth},c=function(e,t,n){return!(i(e,t,n)||l(e,t,n)||r(e,t,n)||a(e,t,n))},u=function(e,t){var n=new e(t),o=new CustomEvent("LazyLoad::Initialized",{detail:{instance:n}});window.dispatchEvent(o)},d=function(e,t){return e.getAttribute("data-"+t)},h=function(e,t,n){return e.setAttribute("data-"+t,n)},f=function(e,t){var n=e.parentElement;if("PICTURE"===n.tagName)for(var o=0;o<n.children.length;o++){var i=n.children[o];if("SOURCE"===i.tagName){var s=d(i,t);s&&i.setAttribute("srcset",s)}}},_=function(e,t,n){var o=e.tagName,i=d(e,n);if("IMG"===o){f(e,t);var s=d(e,t);return s&&e.setAttribute("srcset",s),void(i&&e.setAttribute("src",i))}"IFRAME"!==o?i&&(e.style.backgroundImage='url("'+i+'")'):i&&e.setAttribute("src",i)},p=!!document.body.classList,m=function(e,t){p?e.classList.add(t):e.className+=(e.className?" ":"")+t},g=function(e,t){p?e.classList.remove(t):e.className=e.className.replace(new RegExp("(^|\\s+)"+t+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,"")},v=function(t){this._settings=_extends({},e,t),this._queryOriginNode=this._settings.container===window?document:this._settings.container,this._previousLoopTime=0,this._loopTimeout=null,this._boundHandleScroll=this.handleScroll.bind(this),this._isFirstLoop=!0,window.addEventListener("resize",this._boundHandleScroll),this.update()};v.prototype={_reveal:function(e){var t=this._settings,o=function o(){t&&(e.removeEventListener("load",i),e.removeEventListener("error",o),g(e,t.class_loading),m(e,t.class_error),n(t.callback_error,e))},i=function i(){t&&(g(e,t.class_loading),m(e,t.class_loaded),e.removeEventListener("load",i),e.removeEventListener("error",o),n(t.callback_load,e))};"IMG"!==e.tagName&&"IFRAME"!==e.tagName||(e.addEventListener("load",i),e.addEventListener("error",o),m(e,t.class_loading)),_(e,t.data_srcset,t.data_src),n(t.callback_set,e)},_loopThroughElements:function(){var e=this._settings,o=this._elements,i=o?o.length:0,s=void 0,r=[],l=this._isFirstLoop;for(s=0;s<i;s++){var a=o[s];e.skip_invisible&&null===a.offsetParent||(t||c(a,e.container,e.threshold))&&(l&&m(a,e.class_initial),this._reveal(a),r.push(s),h(a,"was-processed",!0))}for(;r.length;)o.splice(r.pop(),1),n(e.callback_processed,o.length);0===i&&this._stopScrollHandler(),l&&(this._isFirstLoop=!1)},_purgeElements:function(){var e=this._elements,t=e.length,n=void 0,o=[];for(n=0;n<t;n++){var i=e[n];d(i,"was-processed")&&o.push(n)}for(;o.length>0;)e.splice(o.pop(),1)},_startScrollHandler:function(){this._isHandlingScroll||(this._isHandlingScroll=!0,this._settings.container.addEventListener("scroll",this._boundHandleScroll))},_stopScrollHandler:function(){this._isHandlingScroll&&(this._isHandlingScroll=!1,this._settings.container.removeEventListener("scroll",this._boundHandleScroll))},handleScroll:function(){var e=this._settings.throttle;if(0!==e){var t=Date.now(),n=e-(t-this._previousLoopTime);n<=0||n>e?(this._loopTimeout&&(clearTimeout(this._loopTimeout),this._loopTimeout=null),this._previousLoopTime=t,this._loopThroughElements()):this._loopTimeout||(this._loopTimeout=setTimeout(function(){this._previousLoopTime=Date.now(),this._loopTimeout=null,this._loopThroughElements()}.bind(this),n))}else this._loopThroughElements()},update:function(){this._elements=Array.prototype.slice.call(this._queryOriginNode.querySelectorAll(this._settings.elements_selector)),this._purgeElements(),this._loopThroughElements(),this._startScrollHandler()},destroy:function(){window.removeEventListener("resize",this._boundHandleScroll),this._loopTimeout&&(clearTimeout(this._loopTimeout),this._loopTimeout=null),this._stopScrollHandler(),this._elements=null,this._queryOriginNode=null,this._settings=null}};var w=window.lazyLoadOptions;return w&&function(e,t){var n=t.length;if(n)for(var o=0;o<n;o++)u(e,t[o]);else u(e,t)}(v,w),v});

package.json

 {
   "name": "vanilla-lazyload",
-  "version": "8.1.0",
+  "version": "8.2.0",
   "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",
@@ -5,0 +5,0 @@ "main": "dist/lazyload.min.js",

README.md

@@ -436,4 +436,4 @@ LazyLoad is a fast, lightweight and flexible script that _speeds up your web application_ by **loading images only as they enter the viewport**. LazyLoad is written in plain (vanilla) Javascript, it supports [responsive images](https://alistapart.com/article/responsive-images-in-practice), it's SEO friendly and it has some other [notable features](#notable-features).
 | `throttle` | The time that has to pass between one element parsing and the following, when fast scroll events occur | `150` |
-| `data_src` | The name of the dataset property containing the original image source. See [dataset naming note](#dataset-naming-note) below. | `"original"` |
-| `data_srcset` | The name of the dataset property containing the original image source set in either `img` and `source` tags. See [dataset naming note](#dataset-naming-note) below. | `"originalSet"` |
+| `data_src` | The name of the data attribute containing the original image source, excluding the `data-`, e.g. if your data attribute is named `data-original`, just pass `original` | `"original"` |
+| `data_srcset` | The name of the data attribute containing the original image source set in either `img` and `source` tags. , e.g. if your data attribute is named `data-original-set`, just pass `original-set` | `"original-set"` |
 | `class_loading` | The class applied to the elements while the loading is in progress. | `"loading"` |
@@ -449,9 +449,3 @@ | `class_loaded` | The class applied to the elements when the loading is complete | `"loaded"` |
 
-#### Dataset naming note
 
-Please note that dataset properties of hyphenated data attributes (like `data-my-custom-attribute`) are automatically [converted to camel case](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset) by Javascript (so `myCustomAttribute`).
-
-[Demo here](https://codepen.io/verlok/pen/LybvYy?editors=1011)
-
-
 ### Methods
@@ -458,0 +452,0 @@

src/lazyload.defaults.js

@@ -7,3 +7,3 @@ export default {
     data_src: "original",
-    data_srcset: "originalSet",
+    data_srcset: "original-set",
     class_loading: "loading",
@@ -10,0 +10,0 @@ class_loaded: "loaded",

src/lazyload.js

@@ -6,2 +6,4 @@ import defaultSettings from "./lazyload.defaults";
 import setSources from "./lazyload.setSources";
+import {addClass, removeClass} from "./lazyload.class";
+import {getData, setData} from "./lazyload.data";
 
@@ -39,4 +41,4 @@ /*
             element.removeEventListener("error", errorCallback);
-            element.classList.remove(settings.class_loading);
-            element.classList.add(settings.class_error);
+            removeClass(element, settings.class_loading);
+            addClass(element, settings.class_error);
             callCallback(settings.callback_error, element);
@@ -48,4 +50,4 @@ };
             if (!settings) { return; }
-            element.classList.remove(settings.class_loading);
-            element.classList.add(settings.class_loaded);
+            removeClass(element, settings.class_loading);
+            addClass(element, settings.class_loaded);
             element.removeEventListener("load", loadCallback);
@@ -60,3 +62,3 @@ element.removeEventListener("error", errorCallback);
             element.addEventListener("error", errorCallback);
-            element.classList.add(settings.class_loading);
+            addClass(element, settings.class_loading);
         }
@@ -86,3 +88,3 @@
                 if (firstLoop) {
-                    element.classList.add(settings.class_initial);
+                    addClass(element, settings.class_initial);
                 }
@@ -93,3 +95,3 @@ /* Start loading the image */
                 processedIndexes.push(i);
-                element.dataset.wasProcessed = true;
+                setData(element, "was-processed", true);
             }
@@ -122,3 +124,3 @@ }
             /* If the element has already been processed, skip it */
-            if (element.dataset.wasProcessed) {
+            if (getData(element, "was-processed")) {
                 elementsToPurge.push(i);
@@ -125,0 +127,0 @@ }

src/lazyload.setSources.js

@@ -0,1 +1,3 @@
+import {getData} from "./lazyload.data";
+
 const setSourcesForPicture = function (element, srcsetDataAttribute) {
@@ -9,3 +11,3 @@ const parent = element.parentElement;
         if (pictureChild.tagName === "SOURCE") {
-            let sourceSrcset = pictureChild.dataset[srcsetDataAttribute];
+            let sourceSrcset = getData(pictureChild, srcsetDataAttribute);
             if (sourceSrcset) {
@@ -20,6 +22,6 @@ pictureChild.setAttribute("srcset", sourceSrcset);
     const tagName = element.tagName;
-    const elementSrc = element.dataset[srcDataAttribute];
+    const elementSrc = getData(element, srcDataAttribute);
     if (tagName === "IMG") {
         setSourcesForPicture(element, srcsetDataAttribute);
-        const imgSrcset = element.dataset[srcsetDataAttribute];
+        const imgSrcset = getData(element, srcsetDataAttribute);
         if (imgSrcset) {
@@ -26,0 +28,0 @@ element.setAttribute("srcset", imgSrcset);

No alert changes

Improved metrics

Total package byte prevSize

879196

increased by0.24%

Number of package files

125

increased by0.81%

Lines of code

1100

increased by6.49%

Worsened metrics

Number of lines in readme file

484

decreased by-1.22%

No dependency changes