Plus Chrome's new HTML-in-Canvas API, and a guide to getting your social cards right.
Together with  Meticulous
🚀 Frontend Focus

#​764 — October 28, 2026 | Read on the web

🖼️ HTML-in-Canvas: Interactive DOM Inside 2D, WebGL and WebGPU Canvases — Arriving in stable Chrome next week, this long-incubated API draws real, live HTML into 2D, WebGL and WebGPU canvases, with text selection, form controls, Find-in-Page and screen readers all still working. Three.js, Babylon.js and PixiJS already support it. Chrome-only for now, but a big leap for canvas-heavy UIs. There's a related video here too.

Natalia Markoborodova (Chrome)

Creating Dynamic Social Media Cards for User Content — Chris digs into how links unfurl across Discord, X, Slack, Bluesky, iMessage and more, and argues most dynamic social cards waste the image by just restating the title and description. Then he shows what should go on it instead.

Chris Coyier

Would You Let Your AI Agent Grade Its Own Homework? — Agents write code faster than ever. They even review their own work. But who’s reviewing them? Dropbox, Notion & ElevenLabs don’t take the risk. With Meticulous, every change is exhaustively verified, with zero developer effort.

Meticulous sponsor

DeadTag: Forgotten Third-Party Script Tags Became a Delivery Network for Spyware — Attackers are buying up expired domains once used by analytics, ad and widget scripts, so any site still carrying the old tag now silently loads attacker code. A worthy reminder to go audit those tags!

Scott Helme

⚡️ IN BRIEF

📙 Articles, Opinions & Tutorials

WebKit Features for Safari 27.1 — A fresh release of Safari came out alongside Apple's new foldable. There's advice on how to create layouts for folding screens using Device Posture API and the Viewport Segments API. Both are behind feature flags for now.

Jen Simmons (WebKit)

💡 Safari 27.2 followed days later, adding ::field-content for styling a customizable select's displayed text, and renaming Grid Lanes' flow-tolerance to fit-tolerance.

Investigating a Curious Case of Font Format Fallbacks — Paul chases a bug in which a site's font loaded three times in a row, as WOFF2, then WOFF, then TTF, following the browser's error messages into Chromium's own source to find the cause.

Paul Calvano

🗓️ Workshop: How to Implement Session Replay — Filters, custom tags, and sampling settings for finding the sessions that matter. Nov 5, 10am PT.

Sentry sponsor

Performance Budgets Need a Representative Worst — Harry revises his own long-standing advice: a budget set from your single worst result lets one outlier hide real regressions, so start from a representative worst (P90 or P95 of recent data) instead. A spreadsheet template is included.

Harry Roberts

▶  The Most Vulnerable Week in Internet History — A fast recap of a rough security week: PHP2Shell (a pair of PHP engine bugs allowing unauthenticated RCE), a backdoored LiteLLM release, a CA with private keys that were numbers under 256, and more.

Fireship

Building an Isolated Preview for AI-Generated HTML — Any app that lets a model generate UI has to render the HTML it hands back. Keshav builds five demos showing how a preview can be attacked, then hardens it with iframe sandboxing, CSP and a carefully checked postMessage handler.

Keshav Malik

🖨️ Websites Should Be Printable — Brennen printed his own site, didn't like the result, and walks through the print stylesheet changes that fixed it: a hidden header, 12pt type, and black links.

Brennen Puth

▶  Why I'm Still Making CSS Tutorials — On caring about the craft of little details and why they matter in an age of agentic code generation.
Kevin Powell

🧰 Tools, Code & Resources

TitleArt: Make Text Like It's 1997 — Aww yeah, a big dose of nostalgia for users of Microsoft Office back in the 90s. Every classic WordArt style, shape and 3-D effect recreated in the browser.

Davey Barker

The “Last 90 Days” Filter Shouldn’t Need a Spinner — Bigger date ranges mean your chart’s query scans more rows. TimescaleDB keeps it fast in Postgres. Get $1000 credit.

Tiger Data (creators of TimescaleDB) sponsor

The Website Specification: Every Technical Detail a Site Needs Before Launch — A checklist you (or an agent) can work through before launch, covering SEO, accessibility, security, performance, privacy, i18n, and more.

Joost de Valk

browser-whisper 2.0: In-Browser Audio and Video Transcription with WebGPU — A library that runs Whisper, Moonshine and other speech models entirely in the browser over WebGPU (with a WASM fallback), complete with timestamped segments, cached models and live mic input.

Tanpreet Singh Jolly

🔊 UI SFX: A Library of 930+ Interface Sound Effects — 78 UI sound cues (clicks, toggles, success, add-to-cart, loading loops…) in 12 swappable styles, from minimal to arcade. A ~12KB runtime synthesizes them with Web Audio, or use the 936 CC0 MP3/Ogg files. Source code.

Romain Simon

MicroKit: 54 Copy-Paste React Microinteractions, CSS-First — Free animated buttons, hover effects, tabs and inputs, each available in TS or JS and in plain CSS or Tailwind. About half need no dependencies, and they're the sort of little details that lift a UI.

Henrique Barone

📰 Classifieds

📮 CraftForms: Hosted forms for any site, no backend needed. Two-line embed, unlimited submissions even on the free plan, no captcha.


🧾 Add PDF editing to your app with Foxit's API: Merge, split, rotate, replace pages and flatten annotations, with working code.

🌿 ...and finally

Overgrown: When Plants Invade Your Abandoned Tabs — Leave a tab unread too long and this Chrome extension has vines grow across it, until you work your way back in with a machete, chainsaw or flamethrower(!). It's not on the Web Store, so load it unpacked from the repo.

Charlie Gerard