diff --git a/gallery/static/js/pre/main.js b/gallery/static/js/pre/main.js
index c5ba3cf..11a1163 100644
--- a/gallery/static/js/pre/main.js
+++ b/gallery/static/js/pre/main.js
@@ -5,14 +5,12 @@ function imgFade(obj, time = 250) {
 }
 // Lazy load images when they are in view
 function loadOnView() {
-    let lazyLoad = document.querySelectorAll('#lazy-load');
+    const lazyLoad = document.querySelectorAll('#lazy-load');
 
     for (let i = 0; i < lazyLoad.length; i++) {
         let image = lazyLoad[i];
         if (image.getBoundingClientRect().top < window.innerHeight && image.getBoundingClientRect().bottom > 0) {
-            if (!image.src) {
-                image.src = `/api/file/${image.getAttribute('data-src')}?r=thumb` // e=webp
-            }
+            if (!image.src) { image.src = image.getAttribute('data-src') }
         }
     }
 }
diff --git a/gallery/templates/groups/group.html b/gallery/templates/groups/group.html
index 9376051..e0378ad 100644
--- a/gallery/templates/groups/group.html
+++ b/gallery/templates/groups/group.html
@@ -68,7 +68,7 @@
                         <p class="image-subtitle"></p>
                         <p class="image-title"><span class="time">{{ image.created_at }}</span></p>
                     </div>
-                    <img alt="{{ image.post_alt }}" data-src="{{ image.file_name }}" onload="this.classList.add('loaded');" id="lazy-load"/>
+                    <img alt="{{ image.post_alt }}" data-src="{{ url_for('api.file', file_name=image.file_name) }}?r=thumb" onload="this.classList.add('loaded');" id="lazy-load"/>
                 </a>
             {% endfor %}
         </div>
diff --git a/gallery/templates/groups/list.html b/gallery/templates/groups/list.html
index ef726f8..9a89232 100644
--- a/gallery/templates/groups/list.html
+++ b/gallery/templates/groups/list.html
@@ -31,7 +31,7 @@
                     <div class="images size-{{ group.images|length }}">
                         {% if group.images|length > 0 %}
                             {% for image in group.images %}
-                                <img data-src="{{ image.file_name }}" onload="this.classList.add('loaded');" id="lazy-load" class="data-{{ loop.index }}"/>
+                                <img data-src="{{ url_for('api.file', file_name=image.file_name) }}?r=thumb" onload="this.classList.add('loaded');" id="lazy-load" class="data-{{ loop.index }}"/>
                             {% endfor %}
                         {% else %}
                             <img src="{{ url_for('static', filename='error.png') }}" class="loaded"/>
diff --git a/gallery/templates/index.html b/gallery/templates/index.html
index 2a91c77..e4289ac 100644
--- a/gallery/templates/index.html
+++ b/gallery/templates/index.html
@@ -21,7 +21,7 @@
                         <p class="image-subtitle"></p>
                         <p class="image-title"><span class="time">{{ image.created_at }}</span></p>
                     </div>
-                    <img fetchpriority="low" alt="{{ image.post_alt }}" data-src="{{ image.file_name }}" onload="this.classList.add('loaded');" id="lazy-load"/>
+                    <img fetchpriority="low" alt="{{ image.post_alt }}" data-src="{{ url_for('api.file', file_name=image.file_name) }}?r=thumb" onload="this.classList.add('loaded');" id="lazy-load"/>
                 </a>
             {% endfor %}
         </div>
diff --git a/gallery/views/api.py b/gallery/views/api.py
index 0bbacaa..bb3faa2 100644
--- a/gallery/views/api.py
+++ b/gallery/views/api.py
@@ -38,7 +38,7 @@ def file(file_name):
     file_name = secure_filename(file_name)  # Sanitize file name
 
     # if no args are passed, return the raw file
-    if not request.args:
+    if not res and not ext:
         if not os.path.exists(os.path.join(current_app.config['UPLOAD_FOLDER'], file_name)):
             abort(404)
         return send_from_directory(current_app.config['UPLOAD_FOLDER'], file_name)