htmx : le retour du HTML dynamique
htmx permet d’ajouter de l’interactivité aux pages web via des attributs HTML, sans écrire de JavaScript. Cliquez sur un bouton, une requête AJAX charge du HTML qui remplace une partie de la page. Simple, puissant, sous-estimé. Chez Eve Media, nous utilisons htmx pour des interfaces interactives sans la complexité des SPAs.
Le concept
Au lieu d’écrire du JavaScript pour faire des requêtes et manipuler le DOM, vous déclarez le comportement dans le HTML. hx-get= »/api/data » hx-target= »#result » : au clic, fetch cette URL, mets la réponse dans #result.
Pourquoi c’est puissant
Le serveur renvoie du HTML, pas du JSON. Pas de serialization/deserialization. Le templating reste côté serveur. Votre backend (Django, Rails, Laravel, Go) fait ce qu’il sait faire. Moins de duplication de logique.
Attributs principaux
hx-get, hx-post, hx-put, hx-delete pour les requêtes HTTP. hx-target pour où mettre la réponse. hx-trigger pour quand déclencher (click, change, load). hx-swap pour comment insérer (innerHTML, outerHTML, beforeend).
AJAX sans JavaScript
Un formulaire avec hx-post= »/submit » hx-target= »#form-container » envoie en AJAX et remplace le formulaire par la réponse. Pas de event.preventDefault(), pas de fetch(), pas de JSON.parse().
Infinite scroll
hx-trigger= »revealed » déclenche quand l’élément devient visible. Chargez la page suivante automatiquement quand l’utilisateur scroll. Quelques attributs remplacent des dizaines de lignes de JS.
Active search
hx-trigger= »keyup changed delay:500ms » attend que l’utilisateur arrête de taper. Recherche as-you-type sans debounce JavaScript. L’UX moderne avec la simplicité HTML.
Avec n’importe quel backend
htmx fonctionne avec tout backend qui renvoie du HTML. Python, Ruby, PHP, Go, .NET. Pas besoin d’API JSON. Gardez votre stack existante.
Extensions
Les extensions htmx ajoutent des fonctionnalités : WebSocket support, SSE, validation. L’écosystème reste léger mais couvre les cas avancés.
Quand utiliser htmx
Sites avec interactivité modérée. Applications CRUD. Quand vous avez déjà un backend avec templates. Quand la complexité SPA n’est pas justifiée. Pour moderniser progressivement des apps existantes.
Limites
Pour des apps très interactives (éditeurs, jeux), un framework JS reste pertinent. L’état côté serveur peut compliquer certains patterns. La communauté est plus petite que React/Vue.
Conclusion
htmx propose une alternative rafraîchissante à la complexité frontend moderne. Pour beaucoup de cas, c’est suffisant et beaucoup plus simple. Le « just enough JavaScript » a du sens.
Chez Eve Media, nous choisissons les outils adaptés à chaque projet. Contactez-nous pour des solutions pragmatiques.
