Ir al contenido

El medio de los artesanos de la web domingo, 30 de agosto de 2026

MailStudio
Front-end

htmx 4.0 adopta fetch() y vuelve explícita la herencia de atributos

Publicado el 28 de agosto de 2026, htmx 4.0.0 reescribe su motor sobre fetch() e introduce cambios de ruptura deliberados. La herencia de atributos, el nombre de los eventos y el historial cambian, pero la rama 2.x sigue siendo la instalación por…

La biblioteca htmx publicó su versión 4.0.0 el 28 de agosto de 2026, tras ocho meses de trabajo. El cambio más profundo es invisible para el usuario final: el motor interno abandona XMLHttpRequest en favor de fetch(). Esa base habilita el streaming de fragmentos HTML, pero llega con cambios de ruptura que todo proyecto en 2.x deberá asimilar antes de migrar.

De XMLHttpRequest a fetch(): un motor reescrito

El paso a fetch() simplifica la implementación y permite el renderizado progresivo: los fragmentos que devuelve el servidor pueden mostrarse a medida que llegan, sin esperar a la respuesta completa. La contrapartida es clara: cualquier extensión, interceptor o biblioteca que se enganchaba a la capa de peticiones de htmx 2.x dejará de funcionar hasta adaptarse a la nueva API.

Tres rupturas de comportamiento que conviene anticipar

La primera afecta a la herencia de atributos, ahora explícita. Un atributo ya no se propaga a los elementos hijos por defecto; debe llevar el sufijo :inherited. El atributo hx-disinherit, que servía para bloquear esa propagación, desaparece porque ya no tiene sentido.

<!-- htmx 2.x: heredado de forma implícita -->
<div hx-confirm="¿Confirmar?">…</div>

<!-- htmx 4.0: la herencia se declara -->
<div hx-confirm:inherited="¿Confirmar?">…</div>

La segunda concierne a los eventos, unificados según el patrón htmx:phase:action. Los scripts que escuchaban los nombres antiguos deben revisarse.

htmx 2.xhtmx 4.0
htmx:beforeRequesthtmx:before:request
htmx:afterRequesthtmx:after:request
htmx:beforeSwaphtmx:before:swap
htmx:configRequesthtmx:config:request
htmx:xhr:*eliminados
hx-varshx-vals con el prefijo js:
hx-promptextensión a cargar

La tercera trata del historial. htmx 4.0 ya no usa localStorage por defecto: al volver atrás, la página se vuelve a solicitar al servidor. Los proyectos que dependían de la caché local pueden restaurar un comportamiento parecido mediante la nueva extensión hx-history-cache, apoyada en sessionStorage.

El núcleo de htmx 4.0 no es una sintaxis nueva, sino un motor reescrito sobre fetch() que hace posible el streaming de HTML.

Morphing nativo, streaming y nuevas extensiones

htmx 4.0 integra el morphing de los intercambios sin dependencia externa, sobre la base del algoritmo idiomorph: un fragmento reemplaza al objetivo preservando el estado del DOM existente. Aparece una etiqueta <hx-partial> para orquestar reemplazos de tipo out-of-band de forma más legible. Alrededor del motor, una familia de extensiones acompaña la transición.

La versión 4.0 se mantiene publicada bajo la etiqueta npm next, mientras que la rama 2.x conserva latest hasta principios de 2027. Los proyectos que cargan htmx desde una URL de CDN sin número de versión no se actualizarán por accidente.

Entre las extensiones destacadas: hx-preload para la precarga, hx-download para la descarga de archivos, hx-sse y hx-ws para el streaming por flujo de eventos y WebSocket, hx-multipart para respuestas compuestas y hx-alpine-compat para convivir con Alpine.js. Un paquete htmax.js reúne htmx con un conjunto de extensiones listas para usar.

Migración: herramientas y calendario

Un verificador de línea de comandos revisa las plantillas y señala las herencias implícitas, los atributos renombrados o eliminados, los nombres de eventos antiguos y las API obsoletas.

npx [email protected] upgrade-check -- ./templates

El equipo también ofrece archivos de competencias para los asistentes de código (htmx-guidance, htmx-debugging, htmx-extension-authoring, htmx-upgrade-from-htmx2), para asistir el diagnóstico y la migración de una base 2.x.

Lo que conviene recordar

htmx 4.0.0 es una versión de ruptura asumida: el motor pasa a fetch(), la herencia se vuelve explícita, los eventos se renombran y el historial deja de apoyarse en localStorage. Nada obliga a migrar de inmediato, ya que 2.x sigue siendo la instalación por defecto, pero los equipos que buscan el streaming de fragmentos ya tienen un camino trazado, con herramienta de verificación incluida.

He desplegado htmx en producción en varios proyectos de clientes, y el sufijo :inherited es el tipo de ruptura que celebro: la herencia implícita de la 2.x era una fuente de sorpresas difíciles de rastrear. Mi consejo sigue siendo no precipitarse. Mientras la 2.x ocupe la etiqueta latest, conviene lanzar upgrade-check en una rama dedicada, medir el alcance del trabajo y migrar cuando el streaming aporte una ganancia real y no por reflejo de novedad. — Simon Janvier

Para profundizar

Anuncio oficial y notas de versión: htmx 4.0.0 has been released.

También en Mail Studio

Compartir LinkedIn Bluesky Hacker News E-mail

Leer también