Add eager loading and high fetchpriority for LCP image

layouts/shortcodes/figure.html

@@ -0,0 +1,61 @@
+{{ $disableImageOptimization := .Site.Params.disableImageOptimization | default
+false }} {{ if .Get "default" }} {{ partial
+"hugo-embedded/shortcodes/figure-default.html" . }} {{ else }} {{- $url :=
+urls.Parse (.Get "src") }} {{- $altText := .Get "alt" }} {{- $caption := .Get
+"caption" }} {{- $href := .Get "href" }} {{- $class := .Get "class" }} {{-
+$target := .Get "target" | default "_blank" }} {{- $nozoom := .Get "nozoom" |
+default false -}} {{- $loading := .Get "loading" | default "lazy" -}} {{-
+$fetchpriority := .Get "fetchpriority" | default "auto" -}}
+
+<figure>
+  {{- with $href }}<a
+    href="{{ . }}"
+    {{
+    with
+    $target
+    }}target="{{ . }}"
+    {{
+    end
+    }}
+    class="inline-block"
+    >{{ end -}} {{- if findRE "^https?" $url.Scheme }}
+    <img
+      class="my-0 rounded-md{{ with $nozoom }} nozoom{{ end }}{{ with $class }} {{ . }}{{ end }}"
+      src="{{ $url.String }}"
+      alt="{{ $altText }}"
+      loading="{{ $loading }}"
+      fetchpriority="{{ $fetchpriority }}"
+    />
+    {{- else }} {{- $resource := "" }} {{- if $.Page.Resources.GetMatch
+    ($url.String) }} {{- $resource = $.Page.Resources.GetMatch ($url.String) }}
+    {{- else if resources.GetMatch ($url.String) }} {{- $resource =
+    resources.Get ($url.String) }} {{- end }} {{- with $resource }} {{- if or
+    $disableImageOptimization (eq .MediaType.SubType "svg")}}
+    <img
+      class="my-0 rounded-md{{ with $nozoom }} nozoom{{ end }}{{ with $class }} {{ . }}{{ end }}"
+      src="{{ .RelPermalink }}"
+      alt="{{ $altText }}"
+      loading="{{ $loading }}"
+      fetchpriority="{{ $fetchpriority }}"
+    />
+    {{- else }} <img class="my-0 rounded-md{{ with $nozoom }} nozoom{{ end }}{{
+    with $class }} {{ . }}{{ end }}" loading="{{ $loading }}" decoding="async"
+    fetchpriority="{{ $fetchpriority }}" alt="{{ $altText }}" {{ with .Width
+    }}width="{{ . }}"{{ end }} {{ with .Height }}height="{{ . }}"{{ end }}
+    src="{{ (.Resize "800x").RelPermalink }}" srcset=" {{- (.Resize
+    "800x").RelPermalink }} 800w, {{- (.Resize "1280x").RelPermalink }} 1280w"
+    sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="{{ .RelPermalink }}" />
+    {{- end }} {{- else }}
+    <img
+      class="my-0 rounded-md{{ with $nozoom }} nozoom{{ end }}{{ with $class }} {{ . }}{{ end }}"
+      src="{{ $url.String }}"
+      alt="{{ $altText }}"
+      loading="{{ $loading }}"
+      fetchpriority="{{ $fetchpriority }}"
+    />
+    {{- end }} {{- end }} {{ if $href }}</a
+  >{{ end }} {{ with $caption }}
+  <figcaption>{{ . | markdownify }}</figcaption>
+  {{ end }}
+</figure>
+{{- end -}}