From 32dc3e84b9e23a9364b2d6ca76abbd2a27b3955c Mon Sep 17 00:00:00 2001
From: Alex Ling <hkalexling@gmail.com>
Date: Tue, 31 Mar 2020 08:44:07 +0000
Subject: [PATCH] Lazy load images in library/title page to improve page load
 time

---
 src/views/index.ecr | 4 ++--
 src/views/title.ecr | 6 +++---
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/views/index.ecr b/src/views/index.ecr
index 18175d7..d1b4184 100644
--- a/src/views/index.ecr
+++ b/src/views/index.ecr
@@ -27,9 +27,9 @@
         <div class="uk-card uk-card-default">
             <div class="uk-card-media-top">
 			<%- if t.entries.size > 0 -%>
-              <img src="<%= t.entries[0].cover_url %>" alt="">
+              <img data-src="<%= t.entries[0].cover_url %>" data-width data-height alt="" uk-img>
 			<%- else -%>
-              <img src="/img/icon.png" alt="">
+              <img data-src="/img/icon.png" data-width data-height alt="" uk-img>
 			<%- end -%>
             </div>
             <div class="uk-card-body">
diff --git a/src/views/title.ecr b/src/views/title.ecr
index 8aef1fb..6766e97 100644
--- a/src/views/title.ecr
+++ b/src/views/title.ecr
@@ -36,9 +36,9 @@
         <div class="uk-card uk-card-default">
             <div class="uk-card-media-top">
 			<%- if t.entries.size > 0 -%>
-              <img src="<%= t.entries[0].cover_url %>" alt="">
+              <img data-src="<%= t.entries[0].cover_url %>" data-width data-height alt="" uk-img>
 			<%- else -%>
-              <img src="/img/icon.png" alt="">
+              <img data-src="/img/icon.png" data-width data-height alt="" uk-img>
 			<%- end -%>
             </div>
             <div class="uk-card-body">
@@ -57,7 +57,7 @@
       <a class="acard">
 		  <div class="uk-card uk-card-default" onclick="showModal(&quot;<%= e.encoded_path %>&quot;, '<%= e.pages %>', <%= (percentage[i] * 100).round(1) %>, &quot;<%= title.encoded_title %>&quot;, &quot;<%= e.encoded_title %>&quot;, '<%= e.title_id %>', '<%= e.id %>')">
           <div class="uk-card-media-top">
-            <img src="<%= e.cover_url %>" alt="">
+            <img data-src="<%= e.cover_url %>" alt="" data-width data-height uk-img>
           </div>
           <div class="uk-card-body">
             <div class="uk-card-badge uk-label"><%= (percentage[i] * 100).round(1) %>%</div>