Add lazy loading for champions images

Vianpyro · Sep 29, 2024 · 1e28cbd · 1e28cbd
1 parent c037ba4
commit 1e28cbd
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -37,6 +37,7 @@ <h1 id="loading-champions">Loading champions...</h1>
                 <img id="modal-image">
             </section>
             <section id="modal-right">
+                <h3>Abilities:</h3>
                 <ul id="modal-abilities"></ul>
             </section>
         </div>

diff --git a/resources/javascript/load_champions.js b/resources/javascript/load_champions.js
@@ -25,6 +25,7 @@ const loadingChampionsMessage = document.getElementById("loading-champions");
         const championPortrait = document.createElement("img");
         championPortrait.src = `${dataDragonUrl}/cdn/${version}/img/champion/${champion.image.full}`;
         championPortrait.alt = champion.name;
+        championPortrait.loading = 'lazy';
 
         // Create element for champion's name
         const championName = document.createElement("h3");