Bundling de activos es una parte central del desarrollo web moderno, ayudando a optimizar y administrar CSS, JavaScript y otros recursos. Durante años, Laravel Mix simplificó este proceso, pero a medida que evolucionaron las herramientas de JavaScript, Laravel ha pasado a Vite como el predeterminado en Laravel 11.

Entonces, ¿por qué Laravel ha hecho este interruptor?

Rendimiento y velocidad

Vite se centra en dos cosas principales: velocidad de desarrollo y rendimiento de producción. Si está cansado de esperar las construcciones, los comentarios instantáneos de Vite se sentirán como un soplo de aire fresco. Con Hot Module Reemplazo (HMR) , el servidor de desarrollo de Vite ofrece cambios en tiempo real, por lo que puede ver actualizaciones al instante, sin una actualización de página completa. Esta retroalimentación inmediata crea una experiencia de desarrollo más rápida y agradable.

Laravel Mix usa este enfoque y requiere un tiempo de agrupación inicial significativo, lo que resulta en un retraso antes de que el servidor esté listo.

Este enfoque basado en ESM es mucho más rápido en el desarrollo, ya que evita el proceso de agrupación completa. Vite utiliza este enfoque, lo que permite a los desarrolladores ver cambios instantáneamente sin esperar un paquete completo.

(las imágenes son de la documentación oficial de Vite)

Para las compilaciones de producción, Vite utiliza el rollup como Bundler, optimizando y minificando su código para garantizar un rendimiento rápido. Esto le permite a Vite ofrecer lo mejor de ambos mundos: desarrollo sin límite para la velocidad durante la codificación y la agrupación tradicional para compilaciones de producción optimizadas.

Soporte moderno de JavaScript

vite también sobresale en tree shaking y código dividido . Al aprovechar rollup , Vite produce paquetes de producción optimizados, elimina el código no utilizado y divide los activos según sea necesario. Esto da como resultado paquetes de carga más rápidos que mejoran el rendimiento de su aplicación.

Experiencia de desarrollador mejorada

El proceso de configuración de Vite es refrescantemente sencillo. A diferencia de Webpack, donde las configuraciones pueden volverse densas y complejas, el archivo Vite vite.config.js es fácil de leer y personalizar, incluso si no tiene una experiencia extensa de Bundler.

Plus, Vite está construido para funcionar sin problemas con marcos populares como Vue y React. Dado que estos marcos también se benefician del HMR y el entorno de desarrollo optimizado de Vite, puede trabajar de manera más eficiente en los proyectos de Laravel-end-end.

Profundición futura y adopción de la comunidad

El ecosistema JavaScript está evolucionando rápidamente, y Vite ha ganado un punto de apoyo sólido. Es ampliamente adoptado y apoyado, con una comunidad grande y activa que trae mejoras continuas y un rico recurso de complementos. El diseño de Vite se alinea bien con hacia dónde se dirige el desarrollo front-end, por lo que es una opción inteligente si desea proteger su proyecto en el futuro.

La decisión de Laravel de adoptar VITE muestra una alineación clara con los estándares modernos, posicionando sus proyectos de Laravel para mantenerse compatibles con las últimas tecnologías front-end.

Integración de Laravel

El complemento VITE de Laravel incluye funciones útiles de ayuda como @Vite para plantillas de cuchilla, manejando automáticamente el versiones de activos y la ruptura de caché. Con Just @Vite ('Resources/CSS/App.CSS'), puede vincular su archivo CSS sin preocuparse por problemas de caché obsoleto.

Aquí está cómo puede configurar vite.config.js para un proyecto Laravel Vue:

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
  plugins: [vue()],
});

y luego en la cuchilla:

    @vite('resources/css/app.css')


    
Hello, Vite!

y con el soporte y documentación oficial de Laravel ahora enfocado en VITE, encontrará una orientación y recursos consistentes para ayudarlo a aprovechar al máximo esta herramienta.

En resumen, Vite trae la velocidad, la simplicidad y las características listas para el futuro que necesitan los proyectos modernos de Laravel. Al hacer que Vite sea el valor predeterminado en Laravel 11, Laravel está capacitando a los desarrolladores para construir aplicaciones más rápidas, delgadas y más eficientes, especialmente a medida que JavaScript y los estándares de desarrollo web continúan evolucionando. ¡Sumérjase en la documentación oficial de Laravel para obtener más información y comience con Vite hoy!