Svelte : le framework léger pour des applications mobiles rapides sur le Web

Le JavaScript a longtemps été indispensable pour créer des contenus Web attrayants. Pour y parvenir, les développeurs Web devaient tout d’abord connaître le langage de programmation, une tâche que tous n’avaient pas le temps ou l’envie de maîtriser. Certains frameworks offrent toutefois aux développeurs un cadre dans lequel même les fonctionnalités complexes de JavaScript peuvent être exécutées de façon automatisée. L’effort de programmation s’en trouve considérablement atténué. Au contraire, la plupart des frameworks surchargent le navigateur. Svelte constitue ici une approche fondamentalement nouvelle.

Svelte (ou SvelteJS) est aussi un framework pour le développement d’applications JavaScript. En tant que tel, il fournit un cadre de base pour les futures applications, ainsi que des fonctionnalités essentielles et récurrentes sous la forme de bibliothèques intégrées automatiquement. Au sein d’un cadre donné, le framework fixe les possibilités de base et définit considérablement le processus de développement. Après une courte familiarisation, les frameworks intervenant dans la programmation des applications Web sont pratiques à utiliser.

Svelte est un outil idéal pour réaliser des applications Web rapides et ressemble, dans son idée de base, à d’autres frameworks Javascript tels que Angular, Vue, Ractive ou React. À l’instar de ces derniers, Svelte est basé sur le JavaScript et permet la conception d’interfaces utilisateur interactives. Le code généré est toutefois nettement plus léger qu’avec les frameworks traditionnels.

L’innovation essentielle de Svelte réside dans la possibilité de convertir un code de framework complexe en un JavaScript simple et optimisé. Avec la plupart des anciens frameworks, l’interprétation et la présentation de l’application en JavaScript était laissée au navigateur. Cela se traduisait par un affichage ralenti. À l’inverse, Svelte compile l’application en un JavaScript léger et optimisé dès le développement. Lors du développement de Svelte, l’un des objectifs a été de donner aux développeurs Web la possibilité d’écrire un code aussi léger et intelligent que possible, sans provoquer de surcharge trop importante à cause du framework.

Le problème des frameworks traditionnels est toujours le même : plutôt que de simplifier un code JavaScript afin qu’il puisse être affiché de façon plus performante dans le navigateur, ils étendent le code et laissent interpréter par JavaScript toutes les fonctionnalités du framework qui, bien souvent, ne sont pas utilisées. Par conséquent, avec un framework traditionnel, même les applications relativement petites prennent de l’ampleur, pour devenir de vastes scripts dont l’exécution nécessite un temps de calcul et une quantité de données considérables. En résumé, les frameworks contribuent à structurer les idées, mais pas le code. Le problème est souvent que les développeurs de frameworks se focalisent sur l’exécution dans le navigateur et négligent l’utilisation d’un JavaScript standard plus simple. En ce point, Svelte se démarque considérablement. À l’exception de quelques commandes de base, qu’il est possible d’apprendre très rapidement, Svelte utilise un HTML, un CSS et un JavaScript simples.

Lors du processus de création, les composants de l’application sont compilés en modules JavaScript indépendants. Dans une fenêtre d’aperçu, le programmeur peut à tout moment vérifier la stabilité et l’exécution d’un programme compilé. L’avantage de ce processus est que le script final est extrêmement léger et rapide. Contrairement aux frameworks traditionnels, Svelte ne provoque pas d’alourdissement du script sur lequel il est difficile d’agir. Résultat : une performance jusqu’à 10 fois plus rapide, notamment par comparaison avec le framework REACT qui était très apprécié jusqu’à présent.

Svelte pour JS (JavaScript) se compose de plusieurs éléments. Son charme particulier réside dans le fait que le développeur Web n’a pas à se soucier des composantes CSS, laborieuses et sources d’erreur. Il lui suffit de définir des balises HTML ou XML simples et de les laisser interpréter par SvelteJS. À partir de ces balises, SvelteJS crée les composantes de l’application. Le code HTML est écrit dans une fenêtre de saisie REPL (boucle d’impression-eval-lecture) dans le navigateur. L’interprétation JavaScript est effectuée de façon immédiate et automatique. La stabilité du code peut ainsi être testée directement.

Avec son approche simple et très réduite, Svelte permet d’importantes extensions des applications Web. Alors que REACT doit pratiquement fixer l’ensemble du script dès le départ, avec Svelte, de futures extensions sont tout à fait possibles sans mettre en péril la stabilité et la performance de l’application. Svelte est ainsi un outil idéal pour développer de nouvelles applications et augmenter la performance des structures existantes. Les développeurs de SvelteJS s’adressent principalement aux débutants en programmation d’applications. Ils proposent des starter kits permettant d’atteindre des résultats très rapidement. Naturellement, SvelteJS présuppose quelques connaissances préalables, en particulier en CSS et JavaScript. L’approche légère du framework Svelte permet toutefois aux débutants de s’y retrouver facilement dans l’environnement de programmation.

Afin d’utiliser SvelteJS localement sur votre système, vous devez installer Node JS. SvelteJS pourra ensuite être installé depuis le repository GitHub.

L’environnement de développement SvelteJS fonctionne sur un serveur Web local à l’adresse « http://localhost:5000 ». La page de démo en ligne de Svelte permet de bien débuter dans SvelteJS sans avoir à installer le progiciel. Vous y trouverez des exemples de scripts pour toutes les composantes essentielles, que vous pourrez modifier et tester de façon interactive avec l’outil REPL original. Vous pourrez ainsi rapidement savoir si et comment SvelteJS peut vous permettre de développer votre propre idée d’application.

Grâce à son volume de données extrêmement réduit, SvelteJS permet des applications plus performantes et rapides que les frameworks traditionnels. Svelte en est toutefois à ses balbutiements et sa communauté est encore restreinte. SvelteJS promet un meilleur accès, une prise en main plus simple et des résultats plus rapides. Jusqu’à présent, ces promesses semblent être tenues. Si SvelteJS devait effectivement s’avérer beaucoup plus performant que VUE, Ractive ou REACT, il les supplantera peut-être bientôt pour devenir le nouveau standard universel pour le développement d’applications Web mobiles.