Here we are again, another blogpost about React vs. Vue. I’m not going deep into technical details, but I want to explain what my experience has been so far with these Frameworks and why you might want to pick one over the other. I have a preference right now, but I’ll try to be as subjective as possible.
Looking for someone who can work with React, Vue and Ember? Contact me!
Vue
You can call Vue ‘the new kid on the block’ if you want, but Vue was created only 9 months after React’s first release!
Both frameworks have some really comparable ways of thinking. Custom templating (.vue vs .jsx files), focussing on the view layer, ES6 inspired, single-file components, etc. But the main difference between the two is that Vue uses a lot more custom ways of templating and setting up components than React does.
What I don’t like about Vue is that you have to predefine every prop you receive from the parent. This might prevent incorrect data types trickling down in your component, but it gets annoying after a while typing the same prop types over and over, especially if you are passing props from component to component. Also in Vue (and React) there isn’t really a nice way to get around the whole one-way dataflow when you need to have some global functions or properties.
What I do like about Vue is that it doesn’t have something like CSS-in-JS, I’ve seen some React projects using JS for styling and it still makes my skin crawl. Vue also has better ways of creating conditionals in templates compared to React, but that also has it’s downside. Vue can get messy very quickly, especially in the template department.
React
I’ve avoided React for a long time and I regret it.
React is a lot closer to native JS than Vue is and that’s why I think it’s a better framework. Files look more native, the way states and props are used feels more logical and overall everything feels more organised.
If I look at a React project I can almost immediately understand what is happening and where I have to look to find out how something works. It’s not as clear and beautiful as Ember, but it’s a good direction.
React has it’s downsides tho. Since it’s more popular a lot of ‘bad’ developers use it and try to give advice on platforms like Stack Overflow, causing a lot of bad practices. React is also very specific about how to render components and templates, this sometimes makes it hard to write conditionals in the templates. This is also a good thing! Every conditional you write in your template probably shouldn’t be there anyway.
Ember
It’s not fair to compare Ember to Vue and React. Ember is a full MVC and not a framework for just the view layer. I still want to share some points.
I initially started building a project in Ember because I worked at a company that build their backend using Ruby on Rails. Since Yehuda Katz worked on Rails and Ember, it kinda made sense. I’ve always been a huge proponent of Convention over Configuration (CoC) and Rails has always strongly shared this philosophy: don’t let developers get stuck in a configuration hell, make decisions for them, even if they might not like some of them. This same ideology applies to Ember.
Ember is a strongly opinionated JavaScript framework that forces you down a certain direction. Some developers might not like this approach, but I’ve always liked the fact that every Ember project you open is (almost) the same. It has a hard learning-curve, but if you get past that it gets a lot easier. Almost every Ember developer is able to pick up another developers work without too much of a hassle, updating Ember is really easy, the CLI is fantastic and the community contains a lot of really good and passionate developers.
Which one to pick?
Which one you use is up to you, the whole story above doesn’t even matter that much when deciding. What are you going to create?
Big corporate project that has a lot of developers, needs easy upgradability and a stable codebase: Ember
SPA that won’t need an app: React/Vue pick whatever you like 🤷🏻♂️
SPA that might eventually need an app? React
Portfolio/simple website? Just write some HTML, CSS and JS and use something like Gulp. Don’t use a Framework for simple projects and please don’t use Webpack for static sites!