Skip to main content
logos react vue e angular

React vs Vue vs Angular: qual escolher?

Hoje, ao iniciar um projeto de front-end temos que escolher qual ferramenta iremos usar, e essa é uma decisão sem volta.

Dificilmente um projeto após iniciado muda de framework. A mão de obra e esforço necessário para essa mudança são maiores do que refazer o projeto do zero.

Hoje, os top três frameworks de front-end são React (não é um framework em si, mas eu já explico), Angular e Vue.

Mas a pergunta que muitos fazem é: react, vue ou angular?

Nós trabalhamos usando essas ferramentas como sendo o núcleo da lógica de negócio e, o back-end, como sendo um manipulador de banco de dados na maioria dos projetos.

Toda a informação do projeto é processada, filtrada e entregue ao usuário por meio do front-end da melhor maneira possível para aquele dispositivo em particular.

Não importa se está em um desktop, tablet ou smartphone, será entregue a melhor experiência para ele.

Para isso acontecer um fator que levamos muito em conta é a performance.

>> Leitura recomendada:

Linha do tempo: a origem e o futuro do front-end.

… pronto, agora na tela vocês irão ver escrito ‘Hello World

10° aula do curso de front-end, 50Mb de arquivos, 6 desistências na turma

Angular.js (primeira versão)

A primeira versão do Angular foi algo que mudou o desenvolvimento, os princípios de componentes e props surgiram com ele.

Também foi o surgimento do conhecido two way data bind, que mantinha o model e a view sincronizadas, o problema do Angular era seu peso.

Muitas vezes não chegamos a usar nem um terço de todos as suas funcionalidades.

O Angular era tão completo que dentro dele vinha um jQuery lite. Isso tornava a aplicação muito pesada, e a sua manipulação do DOM era lenta e muito custosa para dispositivos móveis.

O Angular.js abriu caminhos para Front-end

A primeira versão do Angular já está em desuso. Ela foi muito importante para abrir o mercado que temos hoje.

Foi essa primeira versão que fez o front-end se popularizar entre os desenvolvedores e fundou vários conceitos que são utilizados até hoje.

Se aparecer para você um trabalho grande e legado para dar manutenção para um projeto em Angular.js (primeira versão), você vai encontrar provavelmente um emaranhado de ng-alguma-coisa, $scope e cascatas de ifs.

E, claro, também o caótico loop do $digest. Prepare-se psicologicamente antes, se despeça da família e tente não surtar, porque você vai.

Angular 2+ (Atual)

logo da angular

Sua mega corporação sinistra precisa de um framework gigante e robusto? Faça como a Umbrella Corporation, LexCorp, Aperture Laboratories e várias outras. Use Angular

Anúncio do Angular em neon, Tokyo, 2055

Quais as vantagens do Angular 2+?

O Angular.js é mantido pelo Google, o que traz uma suposta segurança para empresas de grande porte, então ele é muito adotado para projetos corporativos e empresas financeiras.

Ele também adotou o TypeScript que é uma versão tipada do ECMA Script, isso atraiu muita atenção dos desenvolvedores C#/.Net, que também é uma linguagem/framework muito utilizado no meio front-endier (rs).

O Angular atual (2+) foi reescrito do zero e desde o começo usou o TypeScript. Ele não tem absolutamente nada a ver com a primeira versão.

Isso fez com que muitos desenvolvedores da primeira versão de Angular migrassem para o React, e também fez novos desenvolvedores e back-ends se tornarem front-end.

Aqui o duelo React vs Angular tornou-se uma realidade.

Diferente do React, o Angular é um framework completo com todas as ferramentas para se criar uma aplicação.

maaaaaas…

Quais as ‘peculiaridades’ do Angular 2+?

O fato de ser um framework completo também faz com que seja muito pesado, mas geralmente ele é usado para projetos grandes e que necessitam de um ambiente completo.

Não creio que o Angular seja adequado para coisas mais simples.

Além de sua curva de aprendizado ser maior, se você deseja trabalhar ou já trabalha com esse tipo de projeto (grandes e muitas regras de negócios) aprender Angular pode te ajudar a conseguir vários trabalhos com essas empresas.

React.js

React.js: as vantagens

A primeira versão do Angular tinha vários problemas como já citado. Já o React.js, por sua vez, trazia um poderoso algoritmo de manipulação do DOM, o que já era um grande diferencial.

Além de seu tamanho, que é extremamente leve (react + react-dom v16.0  49.8 kb gzipped) ele trouxe a total integração com as versões modernas do ECMA Script, dando suporte às classes e modularização.

Isso traz um desenvolvimento web equivalente às linguagens clássicas de programação como Java, Python e C++. Usar React também deixa a aplicação mais robusta e fácil de implementar novas funcionalidades.

Ferramentas de teste como o Jest, garantem que a aplicação funcione antes mesmo de ser feito um deploy para produção.

“React.js não é um framework”

“Que?”

Sim, isso mesmo que estou falando.

O React não é um framework e todas as coisas que você quiser fazer, que não tenha a ver com a renderização do front-end, você terá que instalar uma biblioteca de terceiros.

Isso é uma vantagem, pois você só instala o que é necessário para a aplicação, deixando ela mais leve.

E os contras do React.js? Existem?

A renderização do template é toda feita em JavaScript então não temos loops, ifs, classes, inline no template.

Essa falta de suporte nativo às ferramentas de templates criaram algumas bizarrices como, por exemplo, o react-if, ou o classnames.

A maior questão do React.js é que, em outras bibliotecas, essas coisas já vem nativas, como no vue com v-if e :class ou Angular com *ngIf e [ngClass], e várias outras.

Se não tiver cuidado, com o React, você pode ter várias dependências pequenas espalhadas por toda a aplicação, que no bundle final, deixa a aplicação muito pesada e lenta.

Isso acontece pois cada uma dessas libs são feitas por programadores diferentes, e nem sempre é feito com o melhor desempenho e da maneira correta.

E a sua principal ferramenta de gerenciamento global de estado, o Redux, que é usada na maioria dos projetos, torna a aplicação bem complexa.

Para fazer uma coisa simples você tem que seguir uma série de padrões e normas que se não forem feitas estritamente dentro do padrão você pode se perder facilmente.

O React em si é uma ferramenta simples e fácil de se programar, mas à medida que você vai adicionando funcionalidades e libs, sua complexidade aumenta muito.

E aí, quando isso acontece, é necessário bastante conhecimento técnico, tanto do próprio React como do JavaScript, para manter e desenvolver uma aplicação complexa em React.

E o Vue.js?

logo vue js

“JavaScript só serve basicamente para validar formulários.”

“Programador de verdade não usa plugins, faz tudo do zero.”

“O site tem que funcionar no IE6.”

Jorge, dono da JorgeTech®, desenvolvedora do jERP em SAP, ABAP, COBOL e Asp.net, 2019

O Vue.js foi criado com base no template do Angular, porém usando algumas das coisas do React, como a componentização e controle do DOM.

Vamos falar a verdade? O Vue.js une o melhor dos dois mundos.

O Vue.js é amplamente divulgado pela comunidade como uma boa alternativa ao React e ao Angular.

O Vue tem sua ferramenta de configuração de projetos, o Vue Cli, que ajuda e muito a começar um projeto. Com a ferramenta é possível só ir escolhendo o que você quer ou não no projeto.

O Vue Cli também tem uma interface gráfica, facilitando ainda mais o trabalho.

O template engine do Vue é muito fácil e intuitivo, se você já tiver o mínimo conhecimento com Angular ou React, você não terá dificuldade nenhuma em fazer um projeto em Vue.

A versão 2 do Vue trouxe os Vue files que são arquivos que contém o template, Javascript/TypeScript e css/sass/postcss em um só lugar, todo o component em um único arquivo.

Ele é absurdamente leve (cerca de 20.9K Gzipped), isso já com todas as ferramentas básicas para iniciar o projeto.
O “Redux do Vue”, o Vuex, que é usado para o gerenciamento do estado global da aplicação, é muito simples e fácil de usar, mesmo mantendo toda a arquitetura proposta pelo Flux.

Ok, mas e as desvantagens do Vue.js?

O ponto fraco do Vue é que ele ainda é novo, e a versão 2, que se consolidou entre os grandes frameworks, é mais recente ainda, isso traz insegurança aos clientes.

O Vue também não tem nomes como Facebook e Google em seu rodapé, o que o torna “menos seguro” aos clientes.

Mas entre os desenvolvedores Front-end, o Vue se destaca na frente dos outros:

Fonte: Best of JavaScript

Será só uma questão de tempo até que o Vue esteja no mesmo patamar de popularidade, também com os clientes.

Então se você já trabalha com front-end e ainda não fez nada com Vue, aproveite para conhecê-lo e estar preparado para quando essa demanda chegar até você.

React vs Vue vs Angular: qual a conclusão? O que é melhor?

Independente da ferramenta o melhor programador front-end é aquele que domina o JavaScript, que se vira com o que tem e não tem medo de aprender coisas novas e mudar.

A melhor ferramenta é sempre aquela que está por vir. No decorrer do texto você pode perceber que todas tem pontos fortes e pontos fracos.

A gente vai pegando o que é melhor em uma, coloca na próxima, melhora e adiciona coisa nova.

Sempre esteja um passo à frente da demanda atual dos clientes e do mercado, por que quando ela chegar, você já vai estar com uma imensa vantagem e conhecimento nunca é desperdiçado.

Mas, Vue.js <3

Hoje a minha preferência pessoal sem dúvidas é o Vue, sempre é minha primeira escolha para qualquer projeto que eu vou implementar. Ele é leve, simples e eficaz.

Então, hoje, se você me questionar “React, vue ou angular?“, eu te direi Vue.js. Mas, novamente, esse é o meu cenário. É a minha necessidade.

Se você está começando agora aprenda React. Para front-end, a grande maioria das vagas de trabalho são para entendidos de React, então sua chance de conseguir entrar no mercado é maior com ele.

Se você tem o perfil mais corporativo você pode se dar bem com Angular, que é o que a maioria desse mercado usa.

Mas se você não quer ter dor de cabeça use Vue. É isto.

“Usamos o jERP há 25 anos. Esse ano a JorgeTech® vai instalar aqui um mainframe IBM z900, grande avanço para nós.”

Papeis Pereira, primeiro cliente da JorgeTech, ainda usam o Windows XP e IE6, porque se for atualizar, o jERP não funciona mais, 2019


React vs Vue vs Angular: qual escolher?
4.9 (98.67%) 15 votes