Asset Bundling é uma parte central do desenvolvimento da web moderno, ajudando a otimizar e gerenciar CSS, JavaScript e outros recursos. Durante anos, o Laravel Mix simplificou esse processo, mas à medida que as ferramentas JavaScript evoluíram, o Laravel passou para o Vite como o padrão em Laravel 11.

Então, por que o Laravel fez esse switch?

Desempenho e velocidade

Vite se concentra em duas coisas principais: velocidade de desenvolvimento e desempenho de produção. Se você está cansado de esperar por compilações, o feedback instantâneo de Vite parecerá uma lufada de ar fresco. Com substituição do módulo quente (hmr) , o servidor de desenvolvimento da Vite oferece alterações em tempo real, para que você possa ver atualizações instantaneamente, sem uma atualização de página inteira. Este feedback imediato cria uma experiência de desenvolvimento mais rápida e agradável.

O Laravel Mix usa essa abordagem e requer tempo inicial significativo de pacote, resultando em um atraso antes que o servidor esteja pronto.

Essa abordagem baseada em ESM é muito mais rápida no desenvolvimento, pois evita o processo completo de agrupamento. Vite usa essa abordagem, permitindo que os desenvolvedores vejam as alterações instantaneamente sem esperar por um pacote completo.

(as imagens são da documentação oficial de Vite)

Para compilações de produção, o Vite usa o Rollup como seu empurrador, otimizando e minificando seu código para garantir um desempenho rápido. Isso permite que a Vite ofereça o melhor dos dois mundos: desenvolvimento sem busca para velocidade durante a codificação e o agrupamento tradicional para construções de produção otimizadas.

Suporte moderno de JavaScript

vite também se destaca em trêmulo de árvore e code dividindo . Ao aproveitar rollup , o VITE produz feixes de produção otimizados, retirando o código não utilizado e dividindo os ativos conforme necessário. Isso resulta em feixes menores e de carregamento mais rápido que aprimoram o desempenho do seu aplicativo.

Experiência aprimorada do desenvolvedor

O processo de configuração do Vite é refrescantemente direto. Ao contrário do webpack, onde as configurações podem se tornar densas e complexas, é fácil ler e personalizar o arquivo de Vite's vite.config.js é fácil de ler e personalizar, mesmo que você não tenha uma extensa experiência em Bundler.

plus, o Vite é construído para trabalhar perfeitamente com estruturas populares como Vue e React. Como essas estruturas também se beneficiam do HMR de Vite e do ambiente de desenvolvimento otimizado, você pode trabalhar com mais eficiência em projetos de Laravel de front-end pesado.

Prova de futuro e adoção da comunidade

O ecossistema JavaScript está evoluindo rapidamente, e o Vite ganhou uma base sólida. É amplamente adotado e apoiado, com uma comunidade grande e ativa que traz melhorias contínuas e um rico recurso de plugins. O design da Vite se alinha bem com a direção do desenvolvimento do front-end, tornando-o uma escolha inteligente se você quiser à prova de futuro seu projeto.

A decisão de Laravel de adotar o Vite mostra um alinhamento claro com os padrões modernos, posicionando seus projetos de Laravel para se manter compatível com as mais recentes tecnologias de front-end.

Integração de Laravel

o plugin Vite do Laravel inclui funções auxiliares úteis como @vite para modelos de lâmina, manipulando automaticamente a versão de ativos e o busto de cache. Com Just @Vite ('Resources/CSS/App.css'), você pode vincular seu arquivo CSS sem se preocupar com problemas de cache obsoleto.

Veja como você pode configurar vite.config.js para um projeto de vue de Laravel:

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

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

e então na lâmina:

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


    
Hello, Vite!

e com o apoio oficial e a documentação de Laravel agora focados no Vite, você encontrará orientações e recursos consistentes para ajudá -lo a tirar o máximo proveito dessa ferramenta.

No resumo, Vite traz a velocidade, a simplicidade e os recursos prontos para o futuro que os projetos modernos de Laravel precisam. Ao tornar o Vite o padrão no Laravel 11, o Laravel está capacitando os desenvolvedores a construir aplicativos mais rápidos, magros e mais eficientes, especialmente porque os padrões de Javascript e Web Development continuam a evoluir. Mergulhe na documentação oficial de Laravel para obter mais informações e comece a Vite hoje!