Si React est le « Boeing principal » du front-end, alors Preact a toujours été son avion de sport ultra-léger. Et maintenant Preact 11 Beta - et nous avons vraiment une nouvelle étape : Hydration 2.0, prise en charge de Ref et abandon du legacy. Voyons ce que cela signifie en termes simples.
Hydratation 2.0 : plus de bouillie au démarrage
L'hydratation est le moment où le code HTML du serveur prend vie dans le navigateur, se transformant en une application interactive. Dans React et l'ancien Preact, il y avait parfois des bugs : nœuds en double, « secousses » étranges lors du chargement.
Maintenant :
L'algorithme est devenu plus intelligent et plus rapide.
La correspondance entre le code HTML et l'état du client fonctionne sans surprise.
Les applications SSR se chargent en douceur, comme si vous aviez une interface utilisateur butter entre les mains 🧈.
Total : moins de bogues, moins de béquilles, un premier rendu plus rapide.
Prise en charge de Ref — enfin !
Preact a toujours été fier de sa compatibilité avec l'écosystème React, mais il manquait quelque chose. Maintenant, vous pouvez écrire :
import { useRef } from 'preact/hooks';
function App() {
const inputRef = useRef();
return <input ref={inputRef} placeholder="Write something" />;
}Les références fonctionnent vraiment, pas par des moyens détournés. Cela signifie que le transfert de code depuis React est devenu encore plus facile.
Adieu, legacy
Dans la nouvelle version, l'équipe de Preact a décidé de supprimer une partie de l'ancien code douteux :
Les hacks qui maintenaient la rétrocompatibilité avec les anciennes API ont été supprimés.
Nous avons nettoyé l'intérieur : moins de conventions et de surprises.
Le code est devenu plus compact et plus rapide.
Total : moins de déchets, un avenir plus propre.
React vs Preact 11
Quelle est la différence entre le React classique et le nouveau Preact 11 Beta :
Critère | React | Preact 11 Beta |
|---|---|---|
Taille du paquet | ~40+ KB gzip | ~3 Ko gzip |
Hydration | Classique, avec des glitchs possibles | Hydratation 2.0, plus stable et plus rapide |
Refs | Assistance complète | Maintenant pris en charge (nouveauté 🎉) |
Compatibilité de l'écosystème | 100 % (écosystème React) | Très élevé, maintenant plus proche de 1:1 |
Legacy | Beaucoup de rétrocompatibilité | Nous avons coupé les vieux codes, la base de code est plus propre |
En quoi est-ce important pour les développeurs
Si vous avez SSR ou ISR — Hydration 2.0 apportera une réelle augmentation de la qualité.
Si vous utilisez bibliothèques du monde React - le soutien de Ref soulage la douleur.
Si vous voulez offre groupée minimale et la vitesse — Preact reste le champion.
Dans Codique nous suivons toujours ces mises à jour. Notre devise est d'expliquer les choses complexes avec des mots simples afin que tout le monde puisse se familiariser avec les frameworks modernes sans stress inutile.
L'application propose des cours sur JavaScript et le front-end, et canal Telegram nous discutons de nouveautés comme Preact 11 Beta.
📲 Rejoignez-nous et faites de l'exercice avec nous !