Flux vs MVC: Best Explanation

Last modified: December 19, 2016

Flux architecture is the backbone of React.js. It's an alternative to MVC and other popular software design patterns. Facebook claims that it's superior in both scalability and readability. If you've used React or Angular 2, there's a good chance you've already designed an app using the Flux architecture.

As to whether or not the Flux pattern is superior to MVC remains debatable. Rather than explore which one is best, this article explains the key differences in Flux and MVC.

Unidirectional data flow

Angular is well known for its two-way data binding. When a user updates an input field on a view, the view directly updates the data model it represents. Likewise, when the model receives updates (via the controller) it propagates those changes to the presentation layer. This makes for bi-directional data flow, as the view and model are constantly kept in-sync.

Unlike MVC, the Flux pattern enforces a unidirectional data flow. A dispatcher receives user actions from the view and updates stores. These stores are similar to models in MVC, however they can contain multiple data objects. After receiving user actions from the dispatcher, each store updates the view(s) that are affected by the user action. It should be noted that application state is only handled in the stores. This maintains a strict separation between different parts of the app. This means that the view can't mutate the app's existing state directly. Rather, the view creates an actionable item that generates a new state. This new state replaces the current one only where necessary.

So What?

What makes unidirectional data flow so much better? While two-way data binding keeps an app's state closely bound to it's presentation layer, things can get out of hand fast when your app grows in complexity. One controller may have several models with several corresponding views. Advocates of Flux argue that this leaves apps prone to 'cascading events' and 'nested upates'. With bi-directional data flow, views can update models that unexpectedly trigger other models to update other view, etc. Things can get out of hand fast.

This makes a strong case for unidirectional data flow, as user actions only propagate changes from one direction. This is especially useful for larger apps with many models and views. Developers don't need to worry about how a new feature will affect other components. Instead they can focus on building independent features that respond to existing user actions / events.


The flux architecture has proven a legitimate alternative to MVC. While proponents of MVC argue that Flux is more or less 'reinventing the wheel', the Flux pattern clearly reduces the complexity of relationships between the data and presentation layer. Flux remains an integral part of the React.js library and can be used with Angular 2 as well.


August 11, 2017
flux architecture is all about unidirectional data flow. angular 2 adopts flux architecture and makes it a contender against React (which seems to be taking over the front-end dev community). when you compare Flux to MVC and Angular 1's digest cycle, the benefits of flux architecture are made clear. it's so much more straight forward (literally).

you don't have to worry about bidirectional data flow. that gets confusing fast with angular 1 since modals and views can update each other. this can lead to unpredictable updates and unwanted recursive checks on the DOM.

in summation, flux architecture is def better but it doesn't mean you have to use REACT.js
Robert Peterson
May 11, 2017
MVC is great because it's been around for a long time and developers understand it. this makes it easy for any developer to jump into the angular world. flux is a more progressive concept dealing with state and dispatchers etc. this can be harder to understand but is ultimately easier to understand, especially as your code base grows. MVC is great and makes the two way data binding possible but also gets messy fast when you scale.
Brad Burshaw
April 7, 2017
my thoughts are that MVC has been most popular design pattern for awhile now and isn't going away. unidirectional data flow sounds great and all, but having a closer relationship with the data your view is displaying makes things easier to account for. i don't know i just find angular 1 pretty easy to understand and that adheres strictly to an MVC like model.
Josh Forman
February 28, 2017
I started using React and Redux (another unidirectional architecture) just a few months ago. I find unidirectional data flow easier to think about and keep track of, even in simpler applications.
Todd Raker
December 22, 2016
agreed, thanks for the read stackchief!
Sam Erickson
December 19, 2016
great read...

You might also like: