feat: refactor image loading

src/pages/books/index.html

@@ -13,7 +13,7 @@ permalink: "/books/index.html"
 {% capture alt %}{{ book.title }} by {{ book.authors }}{% endcapture %}
 <article class="book-entry">
   <a href="{{ book.url }}">
-    {% image book.image, alt %}
+    <img src="https://coryd.dev/.netlify/images/?url={{ book.image }}&fm=webp&q=85&w=137&h=209&fit=cover" alt="{{ alt }}" loading="eager" decoding="async" />
   </a>
   <div class="book-meta">
     <a href="{{ book.url }}">

src/pages/errors/404.html

@@ -5,7 +5,7 @@ permalink: /404.html
 image: /assets/img/404.jpg
 ---
 <div class="four-oh-four-wrapper">
-  {% image 'https://coryd.dev/.netlify/images/?url=/assets/img/404.jpg&w=1000', title, 'image-banner', 'eager' %}
+  <img src="https://coryd.dev/.netlify/images/?url=/assets/img/404.jpg&fm=webp&q=85&w=1000" alt="{{ alt }}" class="image-banner" loading="eager" decoding="async" />
   <div class="text-centered">
     <h2 class="page-header">{{ title }}</h2>
     What kind of idiots do you have working here? <a href="/">Hurry up and skip out on the room service bill!</a>

src/pages/main/about.md

@@ -9,7 +9,7 @@ permalink: /about.html
 <div class="avatar-wrapper flex-centered">
   <div class="interior">
   {%- capture about_alt -%}{{ meta.siteName }} - image by David Neal / @reverentgeek{%- endcapture -%}
-  {% image 'https://coryd.dev/.netlify/images/?url=/assets/img/default.png&w=600', about_alt, '', 'eager' %}
+  <img src="https://coryd.dev/.netlify/images/?url=/assets/img/default.png&w=600" alt="{{ about_alt }}" loading="eager" decoding="async" />
   </div>
 </div>
 <h2 class="page-header text-centered">Hi, I'm Cory</h2>