Is Vue.js a Good Choice for a Large-Scale Application?

Let’s assume large scale means:

  • Many components, say, hundreds
  • Complex data flow between components
  • Well tested

Vue is hands-down my favorite JavaScript framework. But let’s be realistic; no tool can be everything to everyone.

There are a lot of reasons Vue is great for applications of any size: single-file components, highly-modular component interface, great scaffolding options with Vue CLI 3 etc.

But I think Vue has a few shortcomings regarding large-scale applications that you should consider:

  1. No template inheritance. If you have hundreds of components, often you’ll want to have “base” components e.g. BaseInput, and then create "sub" components e.g. EmailInput, NameInput that inherit from the base. With Vue components, you can use a mixin for the data model, but there’s no way to do that for the template (a good workaround is to use Pug template with Vue, but it’s not ideal).
  2. Magic reactivity. Vue’s reactivity system is highly intuitive and will “just work” in 99% of situations. But in the 1% of cases where it doesn’t, it’s opaque and hard to debug. Getters and setters are really awkward for debugging and it’s difficult to trace the source of rerenders. Also, nested object data structures must be treated differently and require manual Vue.set.
  3. Vue testing is immature. Vue’s official test framework, Vue Test Utils is great. But it’s still in beta. I’ve found myself spending a lot of time trying to debug tests that don’t work, only to find it’s some idiosyncrasy or bug in the testing framework.

PS. There’s no implication here that other JavaScript frameworks are better than Vue for large applications, I’m just pointing out things you should consider.

Comment if you agree/disagree!

Originally published at