Simplifier Vite
Les anciens outils comme Webpack ou CRA fonctionnent en regroupant d'abord l'intégralité de votre projet. Ils lisent chaque fichier et les combinent en un seul gros fichier JavaScript. Cela fonctionne pour les petits projets, mais échoue pour les grands projets comprenant des milliers de modules. Les bundles volumineux prennent des secondes ou des minutes à être générés. Chaque fois que vous enregistrez un fichier, l'outil reconstruit de larges parties du bundle.
Vite fonctionne différemment. Les navigateurs modernes prennent en charge les modules ES nativement. Vite ne regroupe pas votre code pendant le développement. Il sert chaque fichier en tant que module séparé uniquement lorsque le navigateur le demande.
Imaginez un restaurant de type buffet. Le chef cuisine chaque plat avant même l'ouverture des portes. Si vous voulez un petit changement, le chef doit refaire la majeure partie du buffet. Vous attendez longtemps pour manger. C'est ainsi que fonctionne Webpack.
Maintenant, imaginez un restaurant à la carte. Les portes s'ouvrent immédiatement. Vous commandez un plat. Le chef prépare uniquement ce plat. Si vous voulez un dessert plus tard, le chef prépare seulement le dessert. Vous n'attendez pas que tout le menu soit cuisiné. C'est ainsi que fonctionne Vite.
Vite utilise deux stratégies différentes pour deux besoins distincts :
Développement (vite dev)
- Stratégie : Sert des modules ESM natifs sans bundling.
- Vitesse : Instantanée. Cela ne dépend pas de la taille du projet.
- Pourquoi : Les requêtes réseau locales sont rapides.
Production (vite build)
- Stratégie : Regroupe tout en utilisant Rolldown.
- Vitesse : Dépend de la taille du projet.
- Pourquoi : Des centaines de fichiers séparés créent trop de requêtes HTTP pour les utilisateurs réels. Le bundling rend le site final plus rapide pour eux.
Vite vous offre de la rapidité pendant que vous codez et de la performance lors du lancement.
Source : https://dev.to/yuripeixinho/descomplicando-o-vite-1p62