Vue 2 vs Vue 3: Qual é melhor para você?

Dentro do desenvolvimento Frontend existem vários frameworks que, ao longo do tempo, se tornaram relevantes. Um deles é o Vue.js, lançado em sua primeira versão em fevereiro de 2014. Logo ganhou destaque entre os desenvolvedores por ser leve, rápido e porque sua curva de aprendizado permite começar pelo básico de forma simples, aumentando gradativamente a complexidade.

Atualmente, a versão mais recente do Vue é o Vue.js 3, lançado em setembro de 2020. Como acontece com qualquer framework, surge a pergunta: qual é o melhor para usar? Logo de cara, a melhor opção é sempre começar pelo mais atualizado, mas há vários aspectos a se levar em conta em cada situação antes de ficar com ele como única resposta.

Qual versão é melhor para você?

Decidir entre Vue 2 ou Vue 3 dependerá dos seguintes cenários:

• Você é um estudante ou inicia no framework. Nesse contexto, o melhor é começar pelo Vue 3. Porém, é necessário mergulhar nas duas versões, conhecer suas diferenças e praticar um pouco com ambas, pois no mercado você ainda poderá encontrar muitos projetos feitos com Vue 2.
  
  Uma vez familiarizado com o framework em geral, não será difícil entender as diferenças entre uma versão e outra, por isso será muito útil ter a capacidade de adaptá-lo de acordo com o projeto que você realiza.
  
• Você começa um projeto do zero. Aqui a resposta é bastante óbvia. Se você está iniciando um novo projeto, a melhor opção é optar pelo Vue 3, o mais atual. O Vue 3 oferece estabilidade e suporte de longo prazo, permitindo que seu projeto seja atualizado e mantido da melhor maneira possível nos próximos anos. A isso adicionamos as diferentes vantagens do Vue 3 em relação ao Vue 2.
  
• Você já tem um projeto em outro framework e está pensando em movê-lo para o Vue. Este caso seria praticamente igual ao anterior. Embora não seja um projeto do zero, levaria o mesmo esforço para movê-lo para o Vue 2 do que para o Vue 3. O mais lógico é ir para o mais atualizado.
  
  Mesmo que você conheça o Vue 2, não demoraria muito para aprender as diferenças e iniciar o projeto no Vue 3, para ter um melhor suporte a longo prazo. O tempo de investimento necessário para aprender o que há de novo no Vue 3 é definitivamente compensado pelos benefícios e manutenção que seu projeto obteria.
  
• Você tem um projeto em Vue 2 e está pensando em movê-lo para Vue 3. A resposta varia muito, dependendo de cada projeto e situação.
  
  Você deve considerar questões como o tamanho do projeto a ser migrado e quanto tempo de investimento implicaria para atualizar o framework. Você deve levar em consideração detalhes como se você desenvolve novas funcionalidades em nosso projeto, se você apenas o mantém, se está em um processo com prazos ou se temos horários mais flexíveis. Todos esses aspectos nos ajudarão a concluir se vale a pena ou não migrar neste momento específico do projeto.
  
  Também é importante verificar as bibliotecas que utilizamos e se possuem suporte para Vue 3. Caso não possuam, deve-se investigar se existem bibliotecas que cumpram a mesma função e sejam compatíveis com Vue 3.
  
  Para o processo de migração, temos uma ferramenta chamada migration build. Esta ferramenta é uma versão do Vue 3 que nos permite executar nosso projeto no modo Vue 2. Com isso podemos ver os erros e avisos dos aspectos já expirados e, a partir daí, fazer os ajustes correspondentes.

Com todos esses contextos cobertos, vamos ver quais benefícios obtemos do Vue 3 em comparação com o Vue 2.

Quais são as principais diferenças e vantagens que obtemos da versão 3 do Vue?

A mudança mais conhecida e que tem um impacto perceptível no dia a dia do desenvolvedor é a mudança da API Options para a API Composition. Este elemento permite-nos agrupar a informação de forma mais compreensível e visualmente eficaz, bem como classificá-la de acordo com as funcionalidades de que necessitamos.

Isso é muito útil, especialmente quando o código começa a ficar mais longo e complexo. Um dos detalhes que consomem mais tempo é percorrer todo o código para fazer as edições necessárias. Com a API de Composição isso é muito reduzido, pois a forma de agrupar as informações fica muito mais fácil.

Por exemplo, para este template:

Este seria o nosso código escrito no formato da API de opções:

E este seria o mesmo código escrito no formato Composition API:

No formato Options API temos os dados de um lado e as funções do outro, enquanto no formato Composition API podemos agrupar dados e funções de acordo com os fatores que têm em comum.

É importante observar que, embora escrever o código no formato Composition API seja uma melhoria e esteja disponível para todos, a capacidade de continuar usando a API Options no Vue 3 está sempre disponível. Portanto, seja porque preferimos esse estilo ou porque ainda não tem recursos suficientes para aplicar a API de composição, não é um problema ter que usar este formato ao migrar ou escrever um novo código em Vue 3. Da mesma forma, caso você queira acessar o formato de API de composição em Vue 2 , já é possível através de sua versão 2.7.

O Vue 3 também traz diversas mudanças desde a forma como criamos o app até novas funcionalidades, como o Teleport, que nos dá a possibilidade de usar elementos fora do componente em que é criado, ou ainda Fragments, uma funcionalidade que nos permite ter componentes sem ter que embrulhá-los em um recipiente.

Eles também introduziram mudanças na reatividade da estrutura e nos lifecycle hooks. Outra grande melhoria é o suporte Typescript que, embora você já o tenha no Vue 2, foi bastante aprimorado no Vue 3.

Por último, mas não menos importante, está a estabilidade e o suporte que os frameworks mais atualizados sempre fornecem. O Vue 2 continuará recebendo manutenções de bugs e ajustes de segurança somente até o final de 2023. Então com todas essas informações, vai depender de cada situação e de cada projeto concluir se uma versão ou outra é mais conveniente para nós.