Performance optimization.

dist/js/splide-renderer.min.js

@@ -1,6 +1,6 @@
 /*!
  * Splide.js
- * Version  : 3.6.1
+ * Version  : 3.6.3
  * License  : MIT
  * Copyright: 2021 Naotoshi Fujita
  */

dist/js/splide.cjs.js

@@ -1,6 +1,6 @@
 /*!
  * Splide.js
- * Version  : 3.6.1
+ * Version  : 3.6.3
  * License  : MIT
  * Copyright: 2021 Naotoshi Fujita
  */
@@ -2047,8 +2047,8 @@ function LazyLoad(Splide2, Components2, options) {
   function onLoad(data, error) {
     const { _Slide } = data;
     removeClass(_Slide.slide, CLASS_LOADING);
+    remove(data._spinner);
     if (!error) {
-      remove(data._spinner);
       display(data._img, "");
       emit(EVENT_LAZYLOAD_LOADED, data._img, _Slide);
       emit(EVENT_RESIZE);

dist/js/splide.esm.js

@@ -1,6 +1,6 @@
 /*!
  * Splide.js
- * Version  : 3.6.1
+ * Version  : 3.6.3
  * License  : MIT
  * Copyright: 2021 Naotoshi Fujita
  */
@@ -2043,8 +2043,8 @@ function LazyLoad(Splide2, Components2, options) {
   function onLoad(data, error) {
     const { _Slide } = data;
     removeClass(_Slide.slide, CLASS_LOADING);
+    remove(data._spinner);
     if (!error) {
-      remove(data._spinner);
       display(data._img, "");
       emit(EVENT_LAZYLOAD_LOADED, data._img, _Slide);
       emit(EVENT_RESIZE);

dist/js/splide.js

@@ -4,7 +4,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
 
 /*!
  * Splide.js
- * Version  : 3.6.1
+ * Version  : 3.6.3
  * License  : MIT
  * Copyright: 2021 Naotoshi Fujita
  */
@@ -2482,9 +2482,9 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     function onLoad(data, error) {
       var _Slide = data._Slide;
       removeClass(_Slide.slide, CLASS_LOADING);
+      remove(data._spinner);
 
       if (!error) {
-        remove(data._spinner);
         display(data._img, "");
         emit(EVENT_LAZYLOAD_LOADED, data._img, _Slide);
         emit(EVENT_RESIZE);

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@splidejs/splide",
-  "version": "3.6.2",
+  "version": "3.6.3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@splidejs/splide",
-  "version": "3.6.2",
+  "version": "3.6.3",
   "description": "Splide is a lightweight, flexible and accessible slider/carousel. No dependencies, no Lighthouse errors.",
   "author": "Naotoshi Fujita",
   "license": "MIT",

src/css/core/object/objects/spinner.scss

@@ -2,8 +2,9 @@ $size: 20px !default;
 $border: 2px solid #999 !default;
 
 .splide {
+  $root: &;
+
   &__spinner {
-    animation: splide-loading 1s infinite linear;
     border: $border;
     border-left-color: transparent;
     border-radius: 50%;
@@ -17,4 +18,12 @@ $border: 2px solid #999 !default;
     top: 0;
     width: $size;
   }
+
+  &__slide {
+    &.is-loading {
+      #{ $root }__spinner {
+        animation: splide-loading 1s infinite linear;
+      }
+    }
+  }
 }

src/js/components/LazyLoad/LazyLoad.ts

@@ -176,9 +176,9 @@ export function LazyLoad( Splide: Splide, Components: Components, options: Optio
     const { _Slide } = data;
 
     removeClass( _Slide.slide, CLASS_LOADING );
+    remove( data._spinner );
 
     if ( ! error ) {
-      remove( data._spinner );
       display( data._img, '' );
       emit( EVENT_LAZYLOAD_LOADED, data._img, _Slide );
       emit( EVENT_RESIZE );