HyperApp : une bibliothèque JavaScript de seulement 1 KB ?

Partager

Article mis à jour le 24 janvier 2023 | Publié le 28 juin 2018

Annoncé en fin d’année 2017, HyperApp est une bibliothèque JavaScript proposant de nombreuses fonctionnalités, le tout pour un poids de seulement 1KB ! Ce qui est relativement peu comparé à Jquery par exemple, qui pèse une trentaine de KB. Malgré ce côté insolite, cette bibliothèque est-elle quand même performante ? La réponse dans cet article !

Une bibliothèque composée de deux API

La bibliothèque HyperApp est composée de deux API :

Hyperapp.h, qui permet de retourner une nouvelle arborescence de nœuds de DOM virtuel
Hyperapp.app qui permet de monter une nouvelle application dans l’élément DOM spécifié.

La bibliothèque est très intuitive : elle possède peu d’instructions afin d’être facile à utiliser et être prise en main plus rapidement. Le tout pour devenir productif le plus rapidement possible.

HyperApp associe la gestion d’état avec un moteur DOM virtuel prenant en charge les mises à jour par clés et les événements de cycle de vie, le tout sans aucunes dépendances. D’où le slogan de la bibliothèque “do more with less”.

Les applications Hyperapp se composent de trois parties interconnectées: l’état, la vue et les actions.

Voici un exemple d’application de code avec HyperApp. Il permet d’afficher un compteur qui incrémente/décrémente selon le paramétrage choisi.

See the Pen PaxbeV by Aaron (@leox47) on CodePen.

Vous pouvez également installer la bibliothèque très facilement avec NPM. Il vous suffit de seulement trois lignes de code :

See the Pen PaxbaV by Aaron (@leox47) on CodePen.

Même si toutes les fonctionnalités d’HyperApp sont prometteuses, elle reste encore très peu utilisée parmi les développeurs JavaScript. Si vous avez effectué des missions avec cette bibliothèque, n’hésitez pas à nous les partager sur les réseaux sociaux.

Vous trouverez davantage de contenus autour de Javascript et plus globalement sur le front en vous rendant sur notre blog.

Vous serez peut-être aussi intéressé par ces articles

C’est une tendance qui revient à la mode en ce moment : la newsletter. On la croyait remplacée par les réseaux sociaux il y a quelques...

Image représentant les actualités

Plusieurs années après avoir créé une extension de Tor sur Firefox, Mozilla a refait une collaboration avec le navigateur à l’Onion. Le but...

Vignette PWA pour blog Numendo

Un sujet différent cette semaine puisque l’on vous parle des PWA : des applications combinant web apps et mobile. Est-ce l’avenir du...

Ce site web stocke des données telles que les cookies pour activer les fonctionnalités nécessaires du site, y compris l'analyse. Vous pouvez modifier ces paramètres à tout moment ou accepter les paramètres par défaut.
Préférences en matière de dépôt de données

Lorsque vous visitez des sites Web, ils peuvent stocker ou récupérer des données dans votre navigateur. Ce stockage est souvent nécessaire pour la fonctionnalité de base du site Web.
L’analyse peut être utilisée comme stockage. La confidentialité est importante pour nous, vous avez donc la possibilité de désactiver ce type de stockage qui n’est pas être nécessaire pour le fonctionnement de base du site Web. Le blocage de l’analyse peut avoir un impact sur votre expérience sur le site Web.

Nous utilisons des cookies pour personnaliser votre expérience sur Numendo.