Découvrez les dernières nouveautés de Svelte 4 : performances accrues et développement simplifié
Avec la sortie de sa dernière version, Svelte 4, le célèbre framework JavaScript pour le développement d’applications web a fait un grand pas en avant. Cette mise à jour apporte une foule d’améliorations passionnantes, en mettant l’accent sur l’optimisation des performances et l’amélioration de l’expérience des développeurs.
Plus petit et plus indépendant
L’une des améliorations les plus remarquables est la réduction substantielle de la taille globale. Alors qu’il pesait 10,6 Mo, Svelte ne pèse plus que 2,8 Mo, soit une réduction impressionnante de 75 %.
En outre, l’équipe à l’origine du cadre JavaScript Svelte a réduit le nombre de dépendances de 61 à 16. Cette réduction présente de nombreux avantages, notamment une expérience REPL plus rapide, une meilleure interactivité sur les sites Web et une exécution remarquablement plus rapide de npm install, quel que soit le gestionnaire de paquets que vous préférez.
Au-delà de l’optimisation de la taille des paquets, Svelte a également affiné le code qu’il génère pour l’hydratation. Par exemple, le code pour le site web SvelteKit est maintenant de 110,2 kB contre 126,3 kB, soit une diminution de 13 %.
Amélioration de l’expérience des développeurs
Svelte définit désormais les transitions comme locales par défaut, en veillant à ce qu’elles ne soient pas globales par défaut. Cela minimise le risque d’interférence avec d’autres transitions et évite les collisions pendant le chargement de la page, offrant ainsi une expérience utilisateur plus fluide.
Composants Web
La création de composants Web dans Svelte est désormais simple grâce à la nouvelle fonction <svelte:options> :
Bien que cette approche se soit avérée facile à utiliser dans des cas simples, elle a posé des limites pour des scénarios plus avancés tels que le contrôle de la mise à jour des valeurs de l’accessoire dans le DOM ou la désactivation du shadow DOM.
Svelte 4 a révolutionné l’expérience de création des composants Web avec l’introduction d’un attribut customElement dédié dans la balise svelte:options. Cet attribut vous permet de configurer les composants Web avec diverses options :
Types plus stricts
createEventDispatcher vérifie désormais que les paramètres fournis sont corrects en termes de type et de nombre, et rejette les erreurs associées en conséquence :
Action et ActionRetour sont désormais définis par défaut comme des paramètres de type jamais si Action n’a pas de type générique fourni :
onMount exige désormais que son retour soit une fonction synchrone, car une fonction asynchrone pourrait entraîner des bogues si le rappel s’exécute lors de la destruction. Ce n’est le cas que pour les fonctions synchrones :
Une migration facilitée
La transition de Svelte 3 à Svelte 4 est facile si vous utilisez l’outil de migration mis à jour par l’équipe. Vous pouvez effectuer la mise à jour à l’aide de la commande suivante :
Il est essentiel de noter les exigences minimales de la version mise à jour :
- NodeJS 16 ou supérieur
- SvelteKit 1.20.4 ou supérieur
- TypeScript 5 ou supérieur
Ce que l’on peut attendre de Svelte 5
Jusqu’à présent, il y a très peu d’informations disponibles sur les fonctionnalités à venir dans Svelte 5. Cependant, comme Svelte est étroitement lié à ESLint, la taille de son paquetage est également influencée.
La réécriture en cours d’ESLint devrait réduire la taille du paquet de plus de 50 % d’ici la sortie de Svelte 5.
L’avenir de Svelte
Svelte 4 ouvre la voie à un processus de développement plus fluide et plus efficace. Il ouvre la voie à des possibilités encore plus intéressantes dans la prochaine version de Svelte 5.
Le framework continuant à évoluer et à s’adapter à vos besoins de développement, l’avenir s’annonce radieux pour les passionnés de Svelte et ceux qui cherchent à utiliser ses capacités pour créer des applications web innovantes.
En adoptant la puissance du cadre JavaScript Svelte 4, vous êtes bien placé pour créer des applications de pointe qui offrent une expérience utilisateur exceptionnelle.
Quelles sont les nouveautés de Svelte 4 ?
Svelte 4 rend l’expérience de création de Svelte plus intuitive et cohérente : |local est désormais la valeur par défaut pour les transitions afin d’éviter que les animations ne bloquent les transitions de page, les préprocesseurs sont désormais plus faciles à écrire, et de multiples corrections facilitent la configuration et l’utilisation de CSP.
Qu’est-ce que Svelte 4 ?
Svelte est un framework JavaScript populaire qui a acquis une clientèle fidèle au cours des dernières années. Avec la sortie de Svelte 4, une version majeure a finalement été publiée après quatre ans. Bien que Svelte 4 soit principalement annoncée comme une version de maintenance, elle ouvre également la voie à Svelte 5, la prochaine génération du framework.
Quels sont les avantages de Svelte ?
Svelte a sa façon originale de laisser les développeurs construire ce dont ils ont besoin. Svelte n’utilise pas de DOM virtuel, mais compile le code dans de minuscules et purs JS Vanilla. En conséquence, le code fonctionne beaucoup plus rapidement dès le début, ce qui rend un produit d’application potentiel beaucoup plus léger et convivial.
Pourquoi Svelte n’est-il pas populaire ?
En tant que développeur, vous souhaiteriez acquérir la connaissance d’un outil si son apprentissage est rentable. Svelte est relativement jeune dans le monde JavaScript, il y a donc une faible demande de développeurs Svelte parce que beaucoup d’entreprises n’utilisent pas (encore) Svelte dans leur infrastructure.
