Реліз htmx 4.0.0: внутрішній Fetch API, інтеграція Idiomorph та часткові оновлення
htmx 4.0.0 переходить з XMLHttpRequest на Fetch API та запроваджує явне успадкування атрибутів. Оновлення також додає вбудовану морфінг-заміну DOM та новий тег hx-partial для точкових оновлень.
Вплив: Високий
Чому це важливо
Ви можете оновити веб-додатки до швидшого підходу на Fetch API, перевіривши успадкування атрибутів за допомогою CLI-інструменту.
TL;DR
- 01htmx 4.0.0 переводить внутрішні HTTP-запити з XHR на fetch().
- 02Успадкування атрибутів тепер вимагає явного модифікатора :inherited.
- 03Запустіть npx htmx.org@4.0.0 upgrade-check для перевірки шаблонів на наявність змін.
Ключові факти
- Версія релізу
- 4.0.0
- Час розробки
- 8 місяців
- Тег NPM за замовчуванням
- 2.x залишається latest; 4.0.0 позначено як next до 2027
- HTTP рушій
- fetch() API (замість XMLHttpRequest)
Перехід на Fetch та явне успадкування
htmx 4.0.0 повністю замінює XMLHttpRequest на fetch(). Найважливіша зміна полягає в том, що атрибути більше не каскадуються на дочірні елементи за замовчуванням. Щоб зберегти успадкування, потрібно додавати суфікс :inherited, наприклад hx-confirm:inherited="Ви впевнені?".
Покращена історія та вбудований морфінг
Відновлення історії більше не використовує знімки DOM у localStorage, які спричиняли помилки при роботі зі сторонніми скриптами. При переході назад htmx повторно запитує сторінку та вставляє її в <body> або [hx-history-elt]. Також додано вбудований алгоритм idiomorph для морфінгу DOM та тег <hx-partial> для Out-of-Band оновлень.
Інструмент міграції CLI
Для полегшення оновлення команда випустила CLI-перевірник, який знаходить застарілі атрибути та події: npx htmx.org@4.0.0 upgrade-check -- ./templates
Спробуй за 2 хвилини
npx htmx.org@4.0.0 upgrade-check -- ./templatesbash
✓ Коли використовувати
- Розробка гіпермедіа-додатків із сучасними бекенд-фреймворками
- Оновлення існуючих htmx 2.x додатків за допомогою CLI-аудиту
- Потреба у вбудованому морфінгу DOM та точкових OOB-оновленнях
✕ Коли НЕ варто
- Single Page Applications, що вимагають складного менеджменту стану на клієнті
- Проєкти, де немає можливості модифікувати шаблони для виправлення успадкування
Що зробити сьогодні
- Запустіть npx htmx.org@4.0.0 upgrade-check у папках із шаблонами проєкту.
- Додайте :inherited до hx-confirm, hx-target чи hx-headers на батьківських елементах.
- Замініть застарілі події htmx:xhr на обробники, сумісні з fetch.
Джерела