{# LCP-image preload on the listing page: the first post card with a
cover is the largest contentful paint candidate on most viewports.
Same imagesrcset / imagesizes as the card so the browser
fetches the right variant. Only emits on page 1 — paginated views
scroll into other LCPs and a wrong preload would waste bytes. #}
Skip to content
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
{# Browsers pick the smallest supported format (AVIF → WebP → JPEG)
AND the closest width for the layout. Cards render at ~320 px on
mobile, ~400 px on tablet, ~480 px in the 3-up desktop grid; 320 /
640 / 960 cover those at 1× / 2× / 2×-large-desktop. `sizes`
tells the browser the slot is roughly one-third of viewport on
large screens. #}
Get new articles on AI, growth, and B2B strategy — no noise.
{# No on purpose — see apps.blog.views.newsletter_subscribe
for the reasoning (anon pages must not Set-Cookie: csrftoken or the
nginx edge cache skips them). Protection is via Origin/Referer in
the view, not via the token. #}
