1 pièce(s) jointe(s)
Annonce de la version 1.0 de SvelteKit, un outil permettant de créer des applications Web
La version 3 de Svelte, un framework JavaScript de composants graphiques, supporte officiellement le langage de programmation TypeScript,
depuis juillet 2020
Rappelons tout d'abord que Svelte est un framework web dont l'objectif selon son concepteur Rich Harris, est de compilé du code JavaScript afin de produire un code de qualité, le plus léger possible, sans abstraction ou virtualisation du DOM, pour un chargement hyper court et des performances très rapides. Le plus gros avantage de Svelte depuis sa version 3 est comme son nom l’indique, le très faible poids de l’application une fois compilée. Ce qui promet une vitesse de chargement impossible à atteindre avec des frameworks comme Angular, Vue.js ou React, qui embarquent un « runtime » en plus du code logique de l’application.
Cependant; Svelte souffrait jusqu'ici d'un gros souci lié à son incompatibilité avec le langage de programmation TypeScript. Ce sur quoi, certains membres de la communauté autour du projet Svelte s'étaient penchés afin de concilier les deux outils dans des projets expérimentaux. Et c'est ainsi que le 17 juillet 2020, Svelte a officiellement annoncé la prise en charge totale du langage de programmation TypeScript par son framework web.
Concrètement, cette prise en charge se manifeste par le fait que le framework Svelte permet entre autres d'effectuer certaines opérations comme:
- la possibilité d'utiliser TypeScript dans les balises <script>,
- la vérification du code TypeScript,
- l'autocomplétion lors de la saisie du code,
- l'importation des composants Svelte dans un module TypeScript,
- Et bien entendu, la compilation du code TypeScript via l'API TSServer.
A noter également que les éditeurs disposant d'un client LSP (Language Server Protocol) pourront intégrer l'extension Svelte, comme c'est déjà le cas avec l'éditeur Visual Studio. A ce jour des travaux d'intégration de Svelte sont en cour sur l'éditeur Atom et très prochainement l'on aura sur Vim une intégration complète via le projet coc-svelte en cours de réalisation.
Selon Orta Therox membre de l'équipe du projet Svelte, ces extensions permettront d'améliorer l'expérience de codage du développeur tout en offrant des outils d'inférence et de refactoring. Il sera par exemple possible d'ajouter le décorateur « // @check-js » en haut d'une balise <script> en utilisant JavaScript pour obtenir de meilleurs messages d'erreur sans changement de contexte. Ou d'utiliser la balise <script lang="ts"> pour passer d'un <script> à un TypeScript. En effet, le support du langage de programmation TypeScript par le framework Svelte se fait dans un premier temps via le compilateur tsc qui s'exécute en ligne de commande pour transcompiler « *.ts » en « *.js », puis ensuite via le TSServer qui est une API chargée de répondre aux requêtes effectuées depuis les éditeurs de texte. Le TSServer va permettre aux développeurs de solliciter le compilateur tsc (en arrière plan) et en temps réel via l'éditeur pendant le codage.
Pour finir, il est également possible d'ajouter TypeScript à un projet Svelte existant via l'ajout des dépendances:
Code:
npm install --save-dev @tsconfig/svelte typescript svelte-preprocess svelte-check
Ces dépendances auront pour objectifs de favoriser la compilation des fichiers .ts édités après la mise en place du fichier de configuration tsconfig.json à la racine du projet:
Code:
1
2
3
4
5
| {
"extends": "@tsconfig/svelte/tsconfig.json",
"include": ["src/**/*", "src/node_modules"],
"exclude": ["node_modules/*", "__sapper__/*", "public/*"],
} |
Source : Svelte
Et vous ?
:fleche: Que pensez-vous de cette nouvelle évolution du framework Svelte ?
:fleche: L'avez-vous déjà testé ? Si oui, quel est votre sentiment ?
Voir aussi
:fleche: La version 3 de Svelte, le framework de composants graphiques, est disponible. Et repense la réactivité des frameworks autrement
:fleche: The State Of JavaScript 2018 : l'enquête révèle que JavaScript est en constante évolution voici une vue macro des technologies JS utilisées
:fleche: React : la version 16.8 de la bibliothèque JavaScript est disponible et embarque une version stable des Hooks
:fleche: Quels sont les frameworks que vous aimeriez apprendre en 2019 ? Et quelles sont vos motivations ?
Typescript l'avenir ou pas
Angular a mauvaise presse.
Pourtant Typescript ne cesse de progresser en notoriété.
Et typescript c'est indéniablement lié à Angular.
Svelte s'y met aussi.
Alors Typescript présage d'un avenir radieux pour Angular ou pas ?
1 pièce(s) jointe(s)
Annonce de la version 1.0 de SvelteKit, un outil permettant de créer des applications Web
Annonce de la version 1.0 de SvelteKit, un outil permettant de créer des applications Web à partir du framework JavaScript Svelte,
il propose par défaut une navigation côté client
Après deux ans de développement, SvelteKit a enfin atteint la version 1.0. « Nous sommes très heureux de partager cette version avec vous. C'est l'aboutissement de milliers d'heures de travail, tant de la part de l'équipe centrale de Svelte que de la communauté au sens large, et nous pensons que c'est le moyen le plus agréable de créer des sites Web de qualité, que vous soyez un développeur independant travaillant sur un petit projet ou faisant partie d'une grande équipe », a écrit l’équipe de développement dans un post publié sur son site officiel.
SvelteKit est un Framework permettant de créer des applications Web à partir de Svelte, un Framework de composants d'interface utilisateur que les développeurs apprécient pour ses performances et sa facilité d'utilisation. Il repose sur Svelte, un Framework d'interface utilisateur qui utilise un compilateur pour permettre d'écrire des composants d'une concision époustouflante qui effectuent un travail minimal dans le navigateur, en utilisant des langages conu - HTML, CSS et JavaScript.
Rappelons que Svelte est un framework web dont l'objectif selon son concepteur Rich Harris, est de compilé du code JavaScript afin de produire un code de qualité, le plus léger possible, sans abstraction ou virtualisation du DOM, pour un chargement hyper court et des performances très rapides. Le plus gros avantage de Svelte depuis sa version 3 est comme son nom l’indique, le très faible poids de l’application une fois compilée. Ce qui promet une vitesse de chargement impossible à atteindre avec des frameworks comme Angular, Vue.js ou React, qui embarquent un « runtime » en plus du code logique de l’application.
Un Framework d'application est conçu pour répondre à ces questions. SvelteKit répond à ces questions grâce à une conception fondée sur les besoins réels d'une armée de bêta-testeurs (dont beaucoup utilisent SvelteKit en production depuis un certain temps - nous saluons votre courage et vous remercions pour vos précieux commentaires) et sur les meilleures idées d'autres Framework d'application, notamment Next.js et Remix.
Les développeurs web ont aujourd'hui l'embarras du choix. Outre les Framework susmentionnés, il existe des options comme Astro, des Framework de serveur éprouvés comme Rails et Laravel, et un million de générateurs de sites statiques. « Contrairement aux Framework traditionnels d'applications multi-pages ou MPA, SvelteKit propose par défaut une navigation côté client après le chargement initial de la page rendue par le serveur. Cela permet des transitions de page plus rapides, un état qui persiste entre les pages (comme la position de défilement d'une barre latérale) et une utilisation moindre des données. Cela évite également de réexécuter des scripts tiers, comme les analyses, à chaque chargement de page.
« Il permet d'utiliser un seul langage, au lieu d'avoir deux applications étroitement liées (l'une pour générer le HTML, l'autre pour gérer l'interaction côté client). Comme SvelteKit s'exécute partout où JavaScript s'exécute, il est possible de déployer une application comme un serveur Node traditionnel ou en utilisant des fonctions sans serveur, y compris à la périphérie », écrit l’équipe Svelte.
À la différence des générateurs de sites statiques, il est possible de créer des applications contenant des données personnalisées ou dynamiques, sans que le fait d'aller les chercher dans le navigateur après le chargement de la page n'altère les performances et ne modifie la mise en page.
De nombreux Framework partent du principe qu'il n'y a qu'une seule façon de construire une application, mais la réalité est plus nuancée. Il n'est pas vrai, par exemple, que le prérendu des pages statiques n'est qu'un contrôle de cache - il permet également d'effectuer une validation au moment de la construction ou de rendre des données du système de fichiers auxquelles les fonctions périphériques ne peuvent pas accéder, et il sert de protection contre les bases de données défaillantes.
Il n'est pas vrai que tout doit être rendu côté serveur - c'est la bonne solution par défaut si vous voulez des applications robustes, performantes et bien référencées, mais il existe d'innombrables exceptions.
Inconvénients de l'utilisation d'un Framework
Les Framework sont des représentations simples d'un langage de programmation, car ils sont faciles à apprendre et permettent de faire le travail en un rien de temps. Cependant, l'utilisation excessive de ces outils de développement réduit souvent à néant les chances d'apprendre le langage de manière plus complète.
Comme SvelteKit utilise Vite, l'outil pour développeurs web, il prend en charge dès le départ le rechargement à chaud des modules, TypeScript et bien d'autres choses dont les développeurs ont besoin.
En février de l'année dernière, Evan You, fondateur de Vue Technology a publié Vite 2. Depuis, son adoption n'a cessé de croître, atteignant plus d'un million de téléchargements npm par semaine. Un écosystème très étendu s'est rapidement formé après la sortie de Vite. Evan YOU a annoncé la version 3 de Vite en juillet.
Comme toute autre chose dans la vie, les Framework ont aussi leur lot d'inconvénients. Un Framework logiciel est une abstraction ou une collection extensible de programmes qui fournissent une large fonctionnalité qui peut être modifiée de manière sélective par des codes supplémentaires écrits par l'utilisateur pour développer des logiciels spécifiques à une application.
Comme mentionné précédemment, les Framework gèrent l'implémentation de certaines fonctionnalités pour les développeurs en arrière-plan. Ces derniers peuvent donc apprendre et utiliser ces Framework pour développer et déployer des applications Web sans avoir une connaissance approfondie du langage de programmation lui-même. Cela élimine les chances de ces programmeurs d'appréhender le langage de programmation dans une meilleure utilisation.
De ce fait, les connaissances de chacun sont limitées à quelques bibliothèques. Pour les développeurs de logiciels avancés, les Framework sont votre meilleur ami, vous permettant d'économiser beaucoup de temps et d'efforts. Mais, ce n'est pas le cas pour les débutants et les novices, car ces Framework contrecarrent quelque peu les chances de mieux comprendre les rouages d'un langage de programmation.
Il empêche d'apprendre le langage réel
Le fait que la plupart des programmeurs considèrent les Framework comme le moyen le plus rapide de comprendre un langage de programmation est souvent un idéalisme farfelu. Car la plupart du temps, ils ont tendance à abandonner la tâche d'apprendre le fonctionnement d'un langage une fois que le travail est fait et terminé.
Fournit un paradigme de programmation inflexible
Les Frameworks sont personnalisés pour utiliser des outils spécifiques ou adopter des procédures prédéfinies pour le développement d'applications web. Il est donc pratiquement impossible d'apporter des modifications à une grande partie des composants de base de ces Frameworks. Même si les Frameworks permettent le développement d'applications web personnalisées, il y a toujours une limite au niveau de personnalisation qui peut être fait. En effet, les développeurs n'ont pas la possibilité de modifier certaines fonctionnalités jusqu'au niveau le plus fin.
Entrave au temps de chargement des sites Web
En raison de la quantité de codes prédéfinis fournis avec une bibliothèque ou un Framework donné - dont la plupart ne sont pas pertinents lors de la création d'applications web simples. Ces Frameworks intègrent souvent des fichiers volumineux qui ont un impact négatif sur la vitesse et les performances du site Web. Le temps de chargement de l'application résultante est donc beaucoup plus lent.
Bien que les développeurs aient la possibilité de choisir entre un Framework web complet et un Framework micro. Cependant, les Frameworks diffèrent les uns des autres en termes de fonctionnalité, de convivialité et de performance. De plus, chaque Framework a ses avantages et ses inconvénients ; ainsi, les développeurs et programmeurs web doivent garder à l'esprit l'étendue du type de site web qu'ils sont sur le point de construire tout en choisissant parmi les différents Frameworks disponibles.
Avec SvelteKit, il est possible d’installer des plugins issus des vastes écosystèmes Vite et Rollup pour ajouter la prise en charge d'autres outils. Lors de la création d'un projet SvelteKit, il sera demandé si l’utilisateur souhaite ajouter TypeScript, ESLint, Prettier, Playwright (pour les tests de navigateur de bout en bout) et Vitest (pour les tests unitaires). Des guides d'intégration existent déjà pour de nombreux projets populaires - Tailwind et Supabase, par exemple.
Le CLI de SvelteKit nécessite l'installation locale de Node.js, mais le Framework lui-même ne dépend d'aucune plateforme. Cela signifie qu’il peut être déployer partout où JavaScript s'exécute. Ceci est rendu possible par les adaptateurs. L'adaptateur par défaut, adapter-auto, fournit une prise en charge sans configuration pour Vercel, Netlify, Cloudflare Pages et Azure Static Web Apps, et d'autres plateformes seront ajoutées à l'avenir. Les adaptateurs fournis par la communauté prennent en charge Deno, Bun, Firebase, App Engine, AWS Lambda et bien d'autres encore.
L’application peut également être deployé en tant que serveur Node.js en utilisant adapter-node. Si l'ensemble de votre application se prête au prérendu, ou s'il s'agit d'une application à page unique (SPA), il est possible d’utiliser adapter-static - qui transforme SvelteKit en générateur de site statique - avec n'importe quel serveur Web, y compris GitHub Pages.
Source : Svelte
Et vous ?
:fleche: Le développement web a-t-il nécessairement besoin de nouveau Framework ?
:fleche: Que pensez-vous de SvelteKit ? Un de trop ou pas ?
Voir aussi :
:fleche: Vite, l'outil pour développeurs web, est à sa version 3. Il vise à fournir une expérience de développement plus rapide et plus légère pour les projets web modernes
:fleche: La version 3 de Svelte, un framework JavaScript de composants graphiques, supporte officiellement le langage de programmation TypeScript,
Depuis juillet 2020
