Progressive enhancement

React combines <form action>, useActionState, and useOptimistic to handle pending feedback and optimistic updates while keeping form submission available before JavaScript runs. The article shows how this continuity can enhance the interface after hydration without giving up the browser’s native form behavior.

The key is to keep the server action directly in action: inserting a client function breaks submission without JavaScript. For optimistic updates, useHydrated() lets the form choose between the server action and its client-enhanced version.

Josh W. Comeau reviews ten proposals being considered for Interop 2027: CSS functions, custom border shapes, anchor- and scroll-related queries, reading order, intrinsic-size animations, and grid decorations. Several address practical problems: reading-flow could align keyboard navigation with a responsive layout, while grid decorations could draw separators without adding empty DOM cells.

The proposals are at different stages of maturity. As of October 2026, several are available in Chromium but not yet in Firefox or Safari; inherit() is implemented in no browser. The article shows where progressive enhancement is feasible, with safeguards such as @supports for height transitions.

The CSS random() function adds visual variation in the browser, without JavaScript or Sass loops. Brecht De Ruyte demonstrates it with subtly tilted letters, cards animated on scroll, and shadows that respond to card rotation. A caching key can keep multiple properties in sync, while sibling-index() calculates the structure of a fanned-out card stack.

These effects are best suited to decorative elements: the article advises against randomizing grids, body text, or interactive targets. With browser support still rolling out, it recommends a stable baseline enhanced through @supports, and stresses respecting prefers-reduced-motion and screen-reader access.