htmx 4.0.0 додав streaming, morph і CSP-режим: що змінити перед міграцією
Великий реліз перебудовує streaming, SSE і WebSocket, додає hx-live, морфінг DOM, кілька цілей оновлення та жорсткіший CSP-контур.

htmx 4.0.0 вийшов як велике переосмислення гіпермедійної бібліотеки: розробники винесли SSE та WebSocket у розширення, додали streaming-сценарії, морфінг DOM, роботу з кількома цілями, CSP-режим і нову реактивну модель hx-live. Це не «безшовний» patch-реліз. Проєктам на htmx 2 потрібно планувати міграцію, перевіряти розширення й поведінку історії, а не просто замінювати номер пакета.

Потокові відповіді стають повноцінним сценарієм
У четвертій гілці з’явився шаблон streaming response: запит можна тримати відкритим, доки розширення споживає частини відповіді. Для довгих операцій це дає змогу надсилати готові HTML-фрагменти поступово, не будуючи окремий клієнтський стан. Поруч розвиваються multipart-відповіді з resume cursors, щоб клієнт міг продовжити потік після переривання.
WebSocket і SSE тепер мають узгодженіші події та конфігурацію. SSE винесено з ядра в окреме розширення, додано відновлення через Last-Event-ID, контроль паузи у фоновій вкладці й виправлення гонки під час скасування reader. Це зменшує вагу базового сценарію, але означає, що залежності й підключення розширень слід перевірити окремо.
Морфінг, partials і кілька областей оновлення
Новий набір змін покращує morph matching, збереження активних полів і focused buttons, роботу web components та скриптів у фрагментах. Підтримка кількох цілей у out-of-band і partial-оновленнях дозволяє однією серверною відповіддю синхронізувати різні частини документа. Це зручно для лічильників, навігації й основного контенту, але збільшує значення стабільних ідентифікаторів DOM.
Якщо сервер повертає неоднозначні або дубльовані ID, алгоритм морфінгу може зіставити вузли не так, як очікує застосунок. Для форм особливо важливо протестувати курсор, selection, checkbox, radio, defaultValue та повернення назад через browser history. Візуально правильний swap ще не доводить, що стан форми збережено.
Безпека: nonce, Trusted Types і контроль eval
Розширення hx-csp додає nonce-gating для внутрішніх eval-викликів, safe-eval і підтримку Trusted Types. Це допомагає вписати htmx у жорсткішу Content Security Policy. Водночас саме підключення розширення не робить довільний HTML безпечним: сервер має екранувати дані, обмежувати дозволені джерела скриптів і не вставляти неперевірений користувацький контент.
Практичний висновок: CSP потрібно перевіряти у режимі report-only, а потім увімкнути enforcement. Інакше приховані inline-скрипти або сторонні віджети можуть зламати production уже після міграції.
Нова реактивність без окремого SPA
hx-live додає декларативні прив’язки та DOM-орієнтований реактивний стан. У релізному циклі команда оптимізувала кешування виразів, пропуск оновлень без змін, debounce інтервалів і взаємодію з Alpine. Ідея приваблива для локальної інтерактивності, але вона створює ще один життєвий цикл поруч із серверними swaps.
Не варто переносити в hx-live весь доменний стан лише тому, що така можливість з’явилася. Краще залишити істину на сервері, а локально тримати короткоживучий UI-стан: розкриті панелі, попередній перегляд або значення, які ще не відправлені. Це спрощує відновлення сторінки й тестування.
Як мігрувати без сюрпризів
- Зафіксувати поточну версію та скласти список усіх htmx-розширень і власних event handlers.
- Пройти офіційний migration guide, а не покладатися лише на список pull request.
- Перевірити hx-boost, history restore, redirect-refresh, focus і scroll restoration у всіх браузерах.
- Окремо протестувати SSE, WebSocket, multipart і скасування запиту при видаленні елемента.
- Увімкнути CSP report-only та перевірити nonce й Trusted Types до production-релізу.
Повний changelog охоплює сотні змін між 2.0.8 і 4.0.0, включно з новими headers, custom methods, hx-query, асинхронним confirm і численними виправленнями історії та morph. Саме масштаб є головним обмеженням: оновлення краще проводити як окремий проєкт із canary, а не як звичайне підняття frontend-залежності.
Джерело та права
Матеріал є самостійним українським перекладом-переказом release notes htmx 4.0.0, опублікованих 28 серпня 2026 року командою htmx. Код, документація та release notes репозиторію доступні за Zero-Clause BSD. Перекладено, адаптовано й доповнено редакцією «Бібліотеки програміста». Обкладинка створена редакцією за допомогою AI і не входить до першоджерела.
Матеріал перекладено, переказано та доповнено редакцією українською мовою.
Читайте далі — ми вже розбираємо наступну важливу тему.


