---
title: "The future of progressive image rendering"
publication: "Frontend Focus"
issue: 715
published_at: "2025-10-29"
canonical_url: "https://frontendfoc.us/issues/715"
---

Plus reports of the web's death are greatly exaggerated (though plain HTTP's days are numbered). |       

Together with [![Sentry logo\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,e_trim,w_350,h_100/e_make_transparent/co_white,e_outline:7/xdmchdxkka938lxfr86f.png)](https://sentry.io/resources/holiday-e-commerce-checklist/?utm_source=frontendfocus&utm_medium=paid-community&utm_campaign=frontend-fy26q3-ecommerceguide&utm_content=newsletter-ecomm-holiday-learnmore)        

🚀 **Frontend** Focus 

#​715 — October 29, 2025 | [Read on the web](https://frontendfoc.us/issues/715)      

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1761736308/fg4ro1px2ykwcqnnnppo.png)](https://www.joshwcomeau.com/animation/linear-timing-function/)  

[Springs and Bounces in Native CSS](https://www.joshwcomeau.com/animation/linear-timing-function/) — Josh looks into how to approach using the `linear()` timing function for animations, and shares some pointers on the best approach to use them right now by “_storing a handful of common timing functions in globally-available CSS variables_”. As always, he includes plenty of interactive demos and code examples. 

Josh W. Comeau   

ℹ️ FYI, as Josh notes, the `linear` timing function preset and the `linear()` timing function are two different things. [Browser support](https://caniuse.com/mdn-css_types_easing-function_linear-function) for this function is currently at around 88%.  

🔒 [Google Says It's (Almost) Time for HTTPS by Default](https://security.googleblog.com/2025/10/https-by-default.html) — Chrome 154 is expected to be released in October 2026 with _“Always Use Secure Connections”_ enabled by default meaning users will get a warning if they try to access any non-https sites at all. Google explains its thinking here. 

Google Online Security Blog   [![\](https://res.cloudinary.com/cpress/image/upload/c_limit,w_480,h_480,q_auto/copm/d21ba40e.png)](https://sentry.io/resources/holiday-e-commerce-checklist/?utm_source=frontendfocus&utm_medium=paid-community&utm_campaign=frontend-fy26q3-ecommerceguide&utm_content=newsletter-ecomm-holiday-learnmore) 

[Keep Your E-Commerce Site Stable This Holiday Season](https://sentry.io/resources/holiday-e-commerce-checklist/?utm_source=frontendfocus&utm_medium=paid-community&utm_campaign=frontend-fy26q3-ecommerceguide&utm_content=newsletter-ecomm-holiday-learnmore) — Avoid checkout chaos this holiday season. Set up and test your error and performance monitoring before code freezes hit. With proven systems in place, you’ll get instant answers when traffic peaks, not panic. Here’s your holiday monitoring checklist. 

Sentry sponsor   

🖼️ [The Present and Potential Future of Progressive Image Rendering](https://jakearchibald.com/2025/present-and-future-of-progressive-image-rendering/) — Just how useful is progressive image rendering today? Jake explores the current state of things (with demos) looking at various image formats (AVIF, JPEG XL, etc) across different browsers and varying network conditions. 

Jake Archibald     

⚡️ IN BRIEF 

- 🎨 CSS `@starting-style` debugging is [now available in Chrome DevTools](https://www.bram.us/2025/10/21/css-starting-style-debugging-is-available-in-chrome-devtools/).
- 🆕 Rachel Andrew shares [what's new in Chrome 142](https://developer.chrome.com/blog/new-in-chrome-142?hl=en), including the `:target-before` and `:target-after` pseudo-classes.
- 📱 Loren Stewart [built the same app ten different times](https://www.lorenstew.art/blog/10-kanban-boards) to compare the performance differences between frameworks on mobile devices.
- 🗓️ [HTML5 reached 'Recommendation' status](https://www.w3.org/press-releases/2014/html5-rec/) 11 years ago this week.
- 🤔 [The 'Principles' module](https://piccalil.li/links/the-entire-principles-module-of-complete-css-is-now-free/) of Piccalilli's popular Complete CSS course is now free to access.      

📙 Articles, Opinions & Tutorials  

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1761734953/iqn0ogcnvtk0vukfqrsp.png)](https://ishadeed.com/article/modern-css-section-layout/)  

[Solved By Modern CSS: Section Layout](https://ishadeed.com/article/modern-css-section-layout/) — Looks at how to approach building a fairly typical pattern, but making it dynamic with features such as `clamp()`, style queries, `:has()`, and more. A good, illustrated example of the potential modern CSS unlocks. 

Ahmad Shadeed   

[The Road to Next](https://www.road-to-next.com/?utm_source=frontend_weekly&utm_medium=newsletter&utm_campaign=next_course) — Learn full-stack web development with Next.js 15 and React 19. The perfect match for JavaScript developers ready to go beyond the frontend. 

Robin Wieruch sponsor   

[The CSS Reset, Again](https://pawelgrzybek.com/the-css-reset-again/) — Paweł looks at some popular resets crafted by others, picking out some highlights along with the rationale for using them. 

Paweł Grzybek   

[For Your Convenience, This CSS Will Self-Destruct](https://scottjehl.com/posts/this-css-will-self-destruct/) — Scott shares a performance pleasing pattern he’s been using to make elements visible with a CSS keyframe animation in the event that JavaScript fails to do its thing. 

Scott Jehl  

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1761747046/oocjjmcx7gqe6fzmyovo.png)](https://heypresents.com/talks/around-the-wwworld-web-midi-web-audio-and-what-the-web-does-best)  

▶[Web MIDI, Web Audio, and What the Web Does Best](https://heypresents.com/talks/around-the-wwworld-web-midi-web-audio-and-what-the-web-does-best) — A fun, and well explained, exploration of what Web MIDI, the Web Audio API and other tools can do when brought together. The end result? A creatively-coded take on Daft Punk’s 1997 hit ‘Around the World’. 

Katie Fenn   

[CSS Layout Explained: Flexbox, Grid, Media Queries and Container Queries](https://2ality.com/2025/10/css-layout.html) — Part of Dr. Axel’s excellent, broader ‘web development for beginners’ series and a handy primer for CSS layout topics generally. 

Dr. Axel Rauschmayer   

[The Man Who Keeps Predicting the Web’s Death](https://tedium.co/2025/10/25/web-dead-predictions-george-colony/) — “_You can think the Web is dying or dead all you want. Many folks have said it over the years. But maybe don’t keep saying it periodically over a 30-year period, in constantly changing contexts_”. 

Ernie Smith   

[Page Headings Don’t Belong in the Header](https://www.tempertemper.net/blog/page-headings-dont-belong-in-the-header) — Some semantic pointers to keep in mind. 

Martin Underhill   

[Liquid Glass is 'Cracked' and Usability Suffers in iOS 26](https://www.nngroup.com/articles/liquid-glass/) — There’s some valid design critique here. 
Raluca Budiu   

[CSS Animations That Leverage the Parent-Child Relationship](https://css-tricks.com/css-animations-that-leverage-the-parent-child-relationship/) 
Preethi Sam   

[Inlining Critical CSS: Does It Make Your Website Faster?](https://www.debugbear.com/blog/critical-css) 
Matt Zeunert    

🧰 Tools, Code & Resources  

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1761747572/mw2kcsc9plxv0alppfam.png)](https://typingsvg.vercel.app/)  

[TypingSVG: Generate Animated SVGs to Represent Natural 'Typing' Effects](https://typingsvg.vercel.app/) — An online tool that generates SVGs that show the process of typing some text that you supply. Has full Google Fonts support, lets you set typing speed and spacing on a line-by-line basis, supports backspacing, and more. A good eye catcher. 

whiteSHADOW1234   

[Augment Guidelines: Brand Guidelines in the Agent Era](https://fandf.co/4qvcqjU) — Brand guidelines–colors, icons, spacing, and more–can (and must) be defined for your AI coding agent. 

Augment Code sponsor   

🎨 [oklch.fyi: A One-Stop Resource for Learning About and Using OKLCH Colors](https://oklch.fyi/) — If you’re new to the OKLCH color space, this is a good place to get started. Includes simple explanations as well as tools to create palettes, gradients, along with a gamut visualizer and color converter. 

Jakub Krehel   

[uikit 1.0: Build 3D UIs in _React Three Fiber_ Apps](https://pmndrs.github.io/uikit/docs/getting-started/introduction) — Ideal for games, XR (VR/AR), and web-based spatial-style apps. [v1.0](https://github.com/pmndrs/uikit/releases/tag/v1.0.46) takes some steps to align more closely with commonly accepted HTML/CSS behavior and techniques. [GitHub repo.](https://github.com/pmndrs/uikit) 

Poimandres   

[Helium: A Small Library That Makes HTML Interactive](https://github.com/daz-codes/helium) — Sort of like a lightweight HTMX or Alpine.js, allowing you to create simple interactive page elements without the usual JS overhead. Try some examples [in this CodePen](https://codepen.io/daz4126/pen/YPwwdBK). 

Helium   

[DevTUI: A Swiss-Army App for Developers](https://devtui.com/) — Another option for a local, native all-in-one toolkit with things like encoders, decoders, formatters, converters, and more, but this one consolidates the utilities into a TUI and CLI. 

Stanislav Katkov    

📸 ...and finally  

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/zlvoasodz3qnocbvai9r.jpg)](https://www.youtube.com/watch?v=dQw4w9WgXcQ)  

The always interesting [Web Design Museum](https://www.webdesignmuseum.org/) reminded us that the first ever banner ad appeared on the Web **thirty-one years ago** this week. The creator of the banner, which ran on HotWired, [wrote about its impact](https://www.theguardian.com/media-network/media-network-blog/2013/dec/12/first-ever-banner-ad-advertising) for _The Guardian_ in 2013. 

Much maligned, I'd certainly take untargeted ads like this on the Web now over the intrusive junk we see on many sites.. but I may be showing my age 😅    

📬 

**Got a new email address?** You can [change your email here](https://frontendfoc.us/edit_subscription/*|UID|*). 

--- 

**Bored of us?** Click [here to stop getting this newsletter](https://frontendfoc.us/leave/*|UID|*). 

--- 

**Got a link for us?** Reply and tell us. We can't include everything but we'll take a look. 

--- 

Published by Cooper Press Ltd.
Curated by [Chris Brandrick](https://bsky.app/profile/brandrick.bsky.social) & [Peter Cooper](https://twitter.com/cooperx86).
Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom 

[Stop getting this newsletter](https://frontendfoc.us/leave/*|UID|*)  

[Ipx.](https://frontendfoc.us/open/715/*|UID|*?ipx=t)
