Svelte mars 2026 : Context programmatique, commentaires HTML et Error Boundaries côté serveur

Svelte mars 2026 : Context programmatique, commentaires HTML et Error Boundaries côté serveur

lschvn

La version Svelte de mars 2026 apporte un ensemble d'amélioration qui comblent des lacunes de longue date — notamment autour de l'instanciation programmatique de composants et de la gestion d'erreurs côté serveur — tout en continuant à affiner les API de navigation de SvelteKit.

createContext en mode programmatique

Dans Svelte 5, createContext et getContext permettent de partager un état dans un arbre de composants sans avoir à le passer en props. La limitation était que le context ne fonctionnait qu'avec les composants rendus via le système normal de slots/transitions de Svelte. Appeler new Component({ target }) pour instancier un composant programmatiquement ne permettait pas d'accéder à la map de context.

Svelte 5.50.0 corrige cela. Vous pouvez désormais passer une Map context comme troisième argument du constructeur de composant :

import { mount, setContext } from 'svelte';
import { MyContextKey } from './keys.js';

const ctx = new Map([[MyContextKey, { value: 42 }]]);
const component = new MyComponent({ target: document.body, props: {}, context: ctx });

Cela rend pratique l'utilisation de composants Svelte comme de simples classes JavaScript dans des bibliothèques et des utilitaires de test, sans restructurer la façon dont le context est fourni.

Commentaires HTML dans les balises, et TrustedHTML

Deux changements au niveau du compilateur atterrissent dans la même release. Les commentaires HTML sont désormais autorisés à l'intérieur des attributs de balises HTML :

<button 
  -- Un commentaire dans la liste d'attributs est désormais valide --
  class="primary"
  onclick={handler}>
  Cliquez-moi
</button>

Parallèlement, les expressions {@html} acceptent désormais TrustedHTML — issu de la Web Secure Types API. Cela vous permet d'indiquer au système de types qu'une chaîne a déjà été sanitized et ne doit pas déclencher le crochet any habituel lors de l'assignation à {@html}.

Les Error Boundaries atteignent le serveur

Les error boundaries (svelte:boundary) ne fonctionnaient auparavant que côté client. Svelte 5.53.0 les étend au rendu côté serveur, vous pouvez désormais intercepter et transformer les erreurs survenant pendant le SSR sans faire tomber toute la page. Cela compte pour les apps SvelteKit qui récupèrent des données au moment de la requête — un composant qui échoue ne fait plus planter l'ensemble de la réponse.

SvelteKit : les callbacks de navigation obtiennent des données de scroll

Les callbacks de navigation (beforeNavigate, onNavigate, afterNavigate) incluent désormais des informations de position de scroll sur les cibles from et to. Cela permet des animations de transition conscientes du scroll — vous pouvez vérifier si l'utilisateur navigue en arrière ou en avant et animer en conséquence, sans gestion supplémentaire.

La mise à jour stabilise également le support de Vite 8 (kit@2.53.0) et ajoute un addon officiel better-auth au CLI Svelte (sv@0.12.0).

State of JS 2025 : Svelte garde la première place

Une rapide satisfaction : les résultats du State of JS 2025 sont publiés, et Svelte conserve sa position de framework réactif le mieux classé en termes de sentiment positif pour la deuxième année consécutive. La catégorie inclut Solid, Vue, React, Angular et d'autres — le score de satisfaction développeur de Svelte continue de se démarquer.

Temps forts communautaires

Le habituel florilège de projets notables construits avec Svelte ce mois-ci :

  • Cherit — base de connaissances open-source Markdown construite avec Tauri
  • Le site du hackathon mondial Mistral AI — construit avec Svelte, comme noté sur Reddit
  • Fretwise — plateforme de pratique de guitare alimentée par l'IA, générant des tablatures et des stems isolés
  • SoundTime — streaming de musique auto-hébergé avec partage P2P, construit avec Rust + Svelte
  • warpkit — framework SPA Svelte 5 autonome avec routage state-based et récupération de données
  • svelte-grab — outil dev qui capture le contexte des composants pour les agents de coding IA, Alt+Click sur n'importe quel élément pour inspecter l'état et tracer les erreurs

L'écosystème Svelte continue de croître dans des directions qui dépassent largement l'application web traditionnelle — des outils musicaux aux simulateurs de hardware en passant par les intégrations IA.

Questions fréquentes

Articles connexes

Plus de couverture avec des sujets et tags en commun.

Astro 6.1.8 corrige un bug critique de nom de fichier sur Netlify et une faille de sécurité sur /_image
Framework

Astro 6.1.8 corrige un bug critique de nom de fichier sur Netlify et une faille de sécurité sur /_image

Astro 6.1.8 corrige une régression où les noms de fichiers de build contenant des caractères spéciaux cassaient les déploiements Netlify et Vercel, et colmate une faille de confusion content-type dans l'endpoint image intégré qui pouvait servir du non-SVG comme SVG.
Nitro v3 Beta : Tracing intégré, détection inteligente des dépendances et support Vercel Queues
Framework

Nitro v3 Beta : Tracing intégré, détection inteligente des dépendances et support Vercel Queues

La mise à jour beta Nitro v3 d'avril 2026 apporte des canaux de tracing intégrés, une détection des dépendances en mode full-trace avec reconnaissance des packages natifs, le support des queues Vercel, et le déploiement sur Tencent EdgeOne Pages.
Next.js v16.3.0-Canary : Prefetch, Dedup et Nouveau Overlay de Dév
JavaScript

Next.js v16.3.0-Canary : Prefetch, Dedup et Nouveau Overlay de Dév

Next.js 16.3.0-canary introduit des contrôles de prefetch plus fins, un meilleur dédoublonnage pour la directive 'use cache', et un overlay de dev redesigné pour les erreurs de routes bloquantes.

Commentaires

Connexion Connectez-vous pour participer à la conversation.

Pas encore de commentaires. Soyez le premier à partager vos pensées.