Skip to content

Más allá de la velocidad

ViteConf 2023

¡Mira la repetición!

¡Vite 4.3 ya está disponible!

April 20, 2023

Imagen de portada de lanzamiento de Vite 4.3

Enlaces rápidos:

Mejoras de rendimiento

En esta versión menor, nos enfocamos en mejorar el rendimiento del servidor de desarrollo. La lógica de resolución se simplificó, mejorando las rutas activas e implementando un almacenamiento en caché más inteligente para encontrar el package.json, archivos de configuración de Typescript, y URLs resueltas en general.

Puedes leer un recorrido detallado del trabajo de rendimiento realizado en esta publicación de blog por uno de los Colaboradores de Vite: How we made Vite 4.3 faaaaster 🚀.

Este sprint resultó en mejoras de velocidad en todos los ámbitos en comparación con Vite 4.2.

Estas son las mejoras de rendimiento medidas por sapphi-red/performance-compare, que prueba una aplicación con 1000 componentes de React desde el tiempo de inicio del servidor de desarrollo en frío y en caliente, así como tiempos de HMR para un componente padre e hijo:

Vite (babel)Vite 4.2Vite 4.3Mejora
Inicio en frío17249.0ms5132.4ms-70.2%
Inicio en caliente6027.8ms4536.1ms-24.7%
HMR Padre46.8ms26.7ms-42.9%
HMR Hijo27.0ms12.9ms-52.2%
Vite (swc)Vite 4.2Vite 4.3Mejora
Inicio en frío13552.5ms3201.0ms-76.4%
Inicio en caliente4625.5ms2834.4ms-38.7%
HMR Padre30.5ms24.0ms-21.3%
Leaf HMR16.9ms10.0ms-40.8%

Comparación de tiempo Vite 4.3 vs 4.2

Comparación del HMR de Vite 4.3 vs 4.2

Puedes leer más información sobre las pruebas de rendimiento aquí. Especificaciones y versiones para esta ejecución de rendimiento:

  • CPU: Ryzen 9 5900X, Memory: DDR4-3600 32GB, SSD: WD Blue SN550 NVME SSD
  • Windows 10 Pro 21H2 19044.2846
  • Node.js 18.16.0
  • Versiones de Vite y el plugin de React:
    • Vite 4.2 (babel): Vite 4.2.1 + plugin-react 3.1.0
    • Vite 4.3 (babel): Vite 4.3.0 + plugin-react 4.0.0-beta.1
    • Vite 4.2 (swc): Vite 4.2.1 + plugin-react-swc 3.2.0
    • Vite 4.3 (swc): Vite 4.3.0 + plugin-react-swc 3.3.0

Los primeros usuarios en usar Vite 4.3 también informaron de una mejora del tiempo de inicio de desarrollo de un rango 1.5x-2x en aplicaciones reales mientras probaban la versión beta. Nos encantaría conocer los resultados de tus aplicaciones.

Perfilado

Seguiremos trabajando en el rendimiento de Vite. Estamos trabajando en una herramienta comparativa oficial para Vite que nos permite obtener métricas de rendimiento para cada solicitud de cambio de código.

Y vite-plugin-inspect ahora tiene más funciones relacionadas con el rendimiento para ayudar a identificar qué complementos o middlewares son el cuello de botella para tus aplicaciones.

Usando vite --profile (y luego presionando p) una vez que se carga la página, se guardará un perfil de CPU del inicio del servidor de desarrollo. Puedes abrirlos en una aplicación como speedscope para identificar problemas de rendimiento. Y puedes compartir tus hallazgos con el equipo de Vite en una Discusión o en el Discord de Vite.

Próximos pasos

Decidimos hacer una sola versión importante de Vite este año alineándonos con el final de soporte de Node.js 16 en septiembre, eliminando el soporte para Node.js 14 y 16 en él. Si deseas participar, abrimos una Discusión de Vite 5 para recopilar comentarios desde ahora.

Publicado bajo licencia MIT. (31993f54)