What’s New in Web? 2026 Edition

Christian is a member of the World Wide Web’s architecture board, the Technical Architecture Group (TAG) of W3C. As such, he has insights into what’s going on in the web platform. In his session, you'll gain insights into the latest discussions among standards bodies, browser vendors, and web developers. And you have the opportunity to report your wishes back to the Web’s architecture board. Don't miss this opportunity to stay updated on the forefront of web technologies.

Transcript

1. What’s New in Web? 2026 Edition Christian Liebel @christianliebel Consultant
2. Hello, it’s me. What’s New in Web? Christian Liebel W3C WebApps, WebML & TAG christian.liebel @thinktecture.com Angular, PWA & Generative AI Microsoft MVP & Google GDE 2026 Edition
3. Technical Architecture Group What’s New in Web? 2026 Edition TAG
4. What’s New in Web? 2026 Edition
5. var let const using What’s New in Web? 2026 Edition Variable Declaration
6. function example() { using resource = new Resource(); return resource.getValue(); } What’s New in Web? 2026 Edition using class Resource { value = Math.random(); #isDisposed = false; getValue() { if (this.#isDisposed) { throw new Error("Already disposed"); } return this.value; } [Symbol.dispose]() { this.#isDisposed = true; console.log("Resource disposed"); } } https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/using
7. Method Safe Idempotent Body GET ✅ ✅ ❌ POST ❌ ❌ ✅ PUT ❌ ✅ ✅ DELETE ❌ ✅ ❌ What’s New in Web? 2026 Edition HTTP Methods
8. Method Safe Idempotent Body GET ✅ ✅ ❌ ✅ ✅ ✅ POST ❌ ❌ ✅ PUT ❌ ✅ ✅ DELETE ❌ ✅ ❌ What’s New in Web? 2026 Edition HTTP Methods
9. Method Safe Idempotent Body GET ✅ ✅ ❌ QUERY ✅ ✅ ✅ POST ❌ ❌ ✅ PUT ❌ ✅ ✅ DELETE ❌ ✅ ❌ What’s New in Web? 2026 Edition HTTP Methods
10. What’s New in Web? 2026 Edition QUERY method https://datatracker.ietf.org/doc/html/rfc10008
11. What’s New in Web? 2026 Edition Signals https://github.com/tc39/proposal-signals
12. const counter = new Signal.State(0); const isEven = new Signal.Computed(() => (counter.get() & 1) == 0); const parity = new Signal.Computed(() => isEven.get() ? "even" : "odd"); // A library or framework defines effects based on other Signal primitives declare function effect(cb: () => void): (() => void); effect(() => element.innerText = parity.get()); // Simulate external updates to counter... setInterval(() => counter.set(counter.get() + 1), 1000); What’s New in Web? 2026 Edition Signals
13. What’s New in Web? 2026 Edition Digital Credentials API https://developer.chrome.com/blog/digital-credentials-api-origin-trial
14. What’s New in Web? 2026 Edition https://www.w3.org/2001/tag/doc/prevent-credential-abuse/#harms
15. What’s New in Web? 2026 Edition Digital Credentials API https://appfigures.com/resources/insights/20250808?f=2
16. Second Implementer navigator.serial.getPorts() .then((ports) => { // Initialize the list of available ports with `ports` on page load. }); What’s New in Web? 2026 Edition Web Serial API https://www.theregister.com/2026/04/14/firefox_nightly_web_serial/
17. Firefox supports PWA installation on Windows What’s New in Web? 2026 Edition Web Install
18. beforeinstallprompt navigator.install() <install> What’s New in Web? 2026 Edition Web Install
19. Dark Color Scheme { "theme_color": "blue", "background_color": "white", "color_scheme_dark": { "theme_color": "red", "background_color": "black" } } What’s New in Web? 2026 Edition Web App Manifest Manifest Localization { "lang": "de", "name": "Donau", "name_localized": { "sr-Latn-RS": "Dunav" } }
20. <button fancy>Test</button> <pre src="src.js"></pre> <video start-at="0:05"> </video> What’s New in Web? 2026 Edition Custom Attributes https://github.com/WICG/webcomponents/issues/1029
21. aka Masonry What’s New in Web? 2026 Edition CSS Grid Lanes https://developer.chrome.com/blog/masonry-update .blog { display: grid-lanes; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 2rem; }
22. .sudoku { display: grid; grid-template-columns: repeat(9, 1fr); grid-template-rows: repeat(9, 1fr); gap: 6px; column-rule-width: repeat(2, 1px) 4px repeat(2, 1px) 4px repeat(2, 1px); column-rule-style: solid; column-rule-color: var(--secondary); row-rule-width: repeat(2, 1px) 4px repeat(2, 1px) 4px repeat(2, 1px); row-rule-style: solid; row-rule-color: var(--secondary); } What’s New in Web? 2026 Edition CSS Gap Decorations https://developer.chrome.com/blog/gap-decorations
23. Baseline Newly available October 2025 (single-document) What’s New in Web? 2026 Edition View Transitions https://view-transitions.chrome.dev/ DEMO
24. What’s New in Web? 2026 Edition Element-Scoped View Transitions https://view-transitions.chrome.dev/my-patagonia-trip/ DEMO
25. What’s New in Web? 2026 Edition WebNN https://huggingface.co/webnn/spaces DEMO
26. Prompt API const languageModel = await LanguageModel.create(); console.log(await languageModel.prompt("Capital of Germany?")); What’s New in Web? 2026 Edition Built-in AI DEMO
27. What’s New in Web? 2026 Edition Agentic Browsers DEMO
28. What’s New in Web? 2026 Edition WebMCP https://webmcp-maze.bandarra.me/ DEMO
29. User needs come before the needs of web page authors, which come before the needs of user agent implementors, which come before the needs of specification writers, which come before theoretical purity. What’s New in Web? 2026 Edition Priority of Constituencies https://www.w3.org/TR/design-principles/#priority-of-constituencies
30. Thank you for your kind attention! Christian Liebel @christianliebel christian.liebel@thinktecture.com