Merge branch 'release/16.1.0'

verlok · May 21, 2020 · 44a1109 · 44a1109
2 parents 2477591 + a7b6fb4
commit 44a1109
Show file tree

Hide file tree

Showing 29 changed files with 1,765 additions and 1,624 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,17 @@
 
 ## Version 16
 
+#### 16.1.0
+
+Improved speed, cleaning DOM, better working destroy, and also fixed 2 bugs.
+
+-   Cleaning up `data` attributes from the DOM when finished using them (mainly when elements have finished loading)
+-   Improved `destroy` method, which now also removes lazyload's additions to the DOM elements
+-   Video elements are now only listening to the `loadeddata` event, no longer to `load`
+-   Removed constants containing strings. I thought it would produced shorter minified code, but discovered that terser expands them to strings.
+-   Bugfix: when lazily loading videos, the error `_poster_ is undefined` was thrown
+-   Bugfix: when selecting native lazy loading, the `loading` class was added without knowing whether or not the loading had started
+
 #### 16.0.0
 
 Functional changes:

diff --git a/README.md b/README.md
@@ -144,7 +144,7 @@ Please note that the video poster can be lazily loaded too.
 
 ## 👩‍💻 Getting started - Script
 
-The latest, recommended version of LazyLoad is **16.0.0**.
+The latest, recommended version of LazyLoad is **16.1.0**.
 
 Quickly understand how to upgrade from a previous version reading the [practical upgrade guide](UPGRADE.md).
 
@@ -161,14 +161,14 @@ If you prefer to load a polyfill, the regular LazyLoad behaviour is granted.
 The easiest way to use LazyLoad is to include the script from a CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.0.0/dist/lazyload.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.1.0/dist/lazyload.min.js"></script>
 ```
 
 Or, with the IntersectionObserver polyfill:
 
 ```html
 <script src="https://cdn.jsdelivr.net/npm/[email protected]/intersection-observer.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.0.0/dist/lazyload.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.1.0/dist/lazyload.min.js"></script>
 ```
 
 Then, in your javascript code:
@@ -201,7 +201,7 @@ Include RequireJS:
 Then `require` the AMD version of LazyLoad, like this:
 
 ```js
-var lazyLoadAmdUrl = "https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.0.0/dist/lazyload.amd.min.js";
+var lazyLoadAmdUrl = "https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.1.0/dist/lazyload.amd.min.js";
 var polyfillAmdUrl = "https://cdn.jsdelivr.net/npm/[email protected]/intersection-observer-amd.js";
 
 /// Dynamically define the dependencies
@@ -247,7 +247,7 @@ Then include the script.
 ```html
 <script
     async
-    src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.0.0/dist/lazyload.min.js"
+    src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.1.0/dist/lazyload.min.js"
 ></script>
 ```
 
@@ -280,7 +280,7 @@ Then include the script.
 ```html
 <script
     async
-    src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.0.0/dist/lazyload.min.js"
+    src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@16.1.0/dist/lazyload.min.js"
 ></script>
 ```
 

diff --git a/currentFeature.md b/currentFeature.md
@@ -1,2 +1 @@
-# Current feature: ___
-
+# Current feature:
diff --git a/demos/cancel_on_exit.html b/demos/cancel_on_exit.html
@@ -86,37 +86,6 @@ <h1>Cancel on exit demo</h1>
                         />
                     </a>
                 </li>
-                <!--  <li>
-                    <a
-                        href="#"
-                        class="lazy"
-                        data-bg="https://via.placeholder.com/220x280?text=Img+05+BG"
-                        data-bg-hidpi="https://via.placeholder.com/440x560?text=Img+05+BG"
-                    ></a>
-                </li>
-                <li>
-                    <a
-                        href="#"
-                        class="lazy"
-                        data-bg="https://via.placeholder.com/220x280?text=Img+06+BG"
-                    ></a>
-                </li>
-                <li>
-                    <a
-                        href="#"
-                        class="lazy"
-                        data-bg="https://via.placeholder.com/220x280?text=Img+07+BG"
-                        data-bg-hidpi="https://via.placeholder.com/440x560?text=Img+07+BG"
-                    ></a>
-                </li>
-                <li>
-                    <a
-                        href="#"
-                        class="lazy"
-                        data-bg="https://via.placeholder.com/220x280?text=Img+08+BG"
-                        data-bg-hidpi="https://via.placeholder.com/440x560?text=Img+08+BG"
-                    ></a>
-                </li> -->
                 <li>
                     <a href="#">
                         <img
@@ -245,7 +214,6 @@ <h1>Cancel on exit demo</h1>
                         />
                     </a>
                 </li>
-                <!-- <iframe class="lazy" data-src="https://imoladomicilio.it/" frameborder="0"></iframe> -->
                 <li>
                     <a href="#">
                         <img
@@ -290,7 +258,6 @@ <h1>Cancel on exit demo</h1>
                         />
                     </a>
                 </li>
-                <!-- <iframe class="lazy" data-src="iframes/i02.html" frameborder="0"></iframe> -->
                 <li>
                     <a href="#">
                         <img
@@ -313,7 +280,6 @@ <h1>Cancel on exit demo</h1>
                         />
                     </a>
                 </li>
-                <!-- <iframe class="lazy" data-src="iframes/i03.html" frameborder="0"></iframe> -->
                 <li>
                     <a href="#">
                         <img

diff --git a/demos/lazily_load_lazyLoad.html b/demos/lazily_load_lazyLoad.html
@@ -1259,7 +1259,7 @@ <h1>Lazyly load lazyload demo</h1>
                 <figcaption>Lorem ipsum 15</figcaption>
             </figure>
         </div>
-        <script src="../dist/lazyload.js"></script>
+        <script src="../dist/lazyload.min.js"></script>
         <script>
             (function () {
                 var lazyLoadInstances = [];