Back
htmx 4.0.0 released after eight months of work
SiTech AI Team3 წთ. საკითხავი

htmx 4.0.0 released after eight months of work

The htmx team has published version 4.0.0: internals moved from XMLHttpRequest to fetch(), attribute inheritance became explicit, event names were standardized, and morph swaps arrive.

On August 28 the htmx team released version 4.0.0, the result of eight months of work, according to its announcement post. htmx is a library that lets developers build interactive interfaces by extending HTML attributes instead of writing large amounts of JavaScript; 4.0 is the first major release of the new line.

How the rewrite started

The author says the idea for htmx 4 emerged while he was creating a separate library, fixi, and becoming more familiar with JavaScript's fetch() API and async programming. htmx had always relied on XMLHttpRequest for backwards compatibility. A conversation with contributor Christian around streaming HTML convinced him that moving the internals to fetch() would simplify the library; Michael and Alex joined the effort, which began as a port of fixi plus the htmx test suite.

The three major changes

From a user's perspective htmx 4 is close to htmx 2, but three things change. First, attribute inheritance is now explicit rather than implicit: to pass an attribute from a parent element to its children, developers add an :inherited suffix, and a command-line tool — npx [email protected] upgrade-check — locates the places that need it.

Second, event names were standardized to the pattern htmx:phase:action, so htmx:beforeRequest becomes htmx:before:request. Most error events collapse into htmx:error, HTTP error responses fire htmx:response:error.

Third, history support no longer caches pages in localStorage by default. On back navigation htmx re-fetches the page and swaps it into body, or into the [hx-history-elt] element when one is present. The change addresses a long-standing source of bugs in which DOM mutations by third-party scripts were restored without the JavaScript logic behind them. Users who want local caching can add the hx-history-cache extension, which stores history in sessionStorage.

New features and extensions

Version 4 ships morphing swaps out of the box, based on the idiomorph algorithm, and a new tag that is clearer than out-of-band swaps when the goal goes beyond replacing a single element with a new version of itself. Internally, the move to fetch() let the team rethink extensions, producing hx-preload, hx-download, hx-alpine-compat and hx-history-cache, and refreshing the streaming extensions hx-sse, hx-ws and hx-multipart. There is also hx-live, a small front-end scripting solution, and an htmax.js bundle that packages htmx with the most popular extensions in one file.

Availability and support

htmx 4.0.0 can be installed from a package manager or loaded from a CDN. The project deliberately did not mark 4.0 as “latest” on npm, so that users relying on non-versioned CDN URLs are not force-upgraded: 2.x remains latest and the 4.0 line stays on the “next” tag until some point in early 2027. htmx 2 will continue to be supported indefinitely, and the team also published skill files for AI coding assistants covering development with htmx 4, debugging, extension authoring and migration from 2.x.

SSiTech

SiTech — AI-powered web development

We build fast, modern websites and bring AI into real business workflows. Have a project or a question? We'd love to help.