feat: serve responsive WebP srcsets for faster mobile browsing
On-demand ?w= resize with a disk cache under webcache/; downloads stay full-resolution. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
+36
-4
@@ -13,8 +13,16 @@
|
||||
<h2>Original & Rembg</h2>
|
||||
<div class="pair-grid">
|
||||
{% if original_name %}
|
||||
{% set img = img_attrs(job_id, original_name, sizes=PAIR_SIZES) %}
|
||||
<figure>
|
||||
<img class="lightboxable" src="/jobs/{{ job_id }}/files/{{ original_name }}" alt="Original" loading="lazy">
|
||||
<img class="lightboxable"
|
||||
src="{{ img.src }}"
|
||||
srcset="{{ img.srcset }}"
|
||||
sizes="{{ img.sizes }}"
|
||||
data-full-src="{{ img.full_src }}"
|
||||
alt="Original"
|
||||
loading="lazy"
|
||||
decoding="async">
|
||||
<figcaption>
|
||||
Original ·
|
||||
<a href="/jobs/{{ job_id }}/files/{{ original_name }}" download>Download</a>
|
||||
@@ -22,8 +30,16 @@
|
||||
</figure>
|
||||
{% endif %}
|
||||
{% if has_rembg and rembg_name %}
|
||||
{% set img = img_attrs(job_id, rembg_name, sizes=PAIR_SIZES) %}
|
||||
<figure>
|
||||
<img class="lightboxable" src="/jobs/{{ job_id }}/files/{{ rembg_name }}" alt="Freigestellt (rembg)" loading="lazy">
|
||||
<img class="lightboxable"
|
||||
src="{{ img.src }}"
|
||||
srcset="{{ img.srcset }}"
|
||||
sizes="{{ img.sizes }}"
|
||||
data-full-src="{{ img.full_src }}"
|
||||
alt="Freigestellt (rembg)"
|
||||
loading="lazy"
|
||||
decoding="async">
|
||||
<figcaption>
|
||||
Rembg ·
|
||||
<a href="/jobs/{{ job_id }}/files/{{ rembg_name }}" download>Download</a>
|
||||
@@ -45,8 +61,16 @@
|
||||
{% else %}
|
||||
<ul class="variant-grid">
|
||||
{% for v in manifest.variants %}
|
||||
{% set img = img_attrs(job_id, v.file) %}
|
||||
<li class="variant-card">
|
||||
<img class="lightboxable" src="/jobs/{{ job_id }}/files/{{ v.file }}" alt="Variante {{ v.id }}" loading="lazy">
|
||||
<img class="lightboxable"
|
||||
src="{{ img.src }}"
|
||||
srcset="{{ img.srcset }}"
|
||||
sizes="{{ img.sizes }}"
|
||||
data-full-src="{{ img.full_src }}"
|
||||
alt="Variante {{ v.id }}"
|
||||
loading="lazy"
|
||||
decoding="async">
|
||||
<div class="variant-meta">
|
||||
<strong>{{ v.id }}</strong> <span class="tag">{{ v.source }}</span>
|
||||
<dl>
|
||||
@@ -72,8 +96,16 @@
|
||||
<h2>Zwischenschritte</h2>
|
||||
<ul class="intermediate-grid">
|
||||
{% for name in intermediates %}
|
||||
{% set img = img_attrs(job_id, name) %}
|
||||
<li>
|
||||
<img class="lightboxable" src="/jobs/{{ job_id }}/files/{{ name }}" alt="{{ name }}" loading="lazy">
|
||||
<img class="lightboxable"
|
||||
src="{{ img.src }}"
|
||||
srcset="{{ img.srcset }}"
|
||||
sizes="{{ img.sizes }}"
|
||||
data-full-src="{{ img.full_src }}"
|
||||
alt="{{ name }}"
|
||||
loading="lazy"
|
||||
decoding="async">
|
||||
<span>{{ name }}</span>
|
||||
</li>
|
||||
{% endfor %}
|
||||
|
||||
Reference in New Issue
Block a user