+ 1

What is MobX?

MobX is a battle tested library that makes state management simple and scalable by transparently applying functional reactive programming (TFRP). React and MobX together are a powerful combination. React renders the application state by providing mechanisms to translate it into a tree of renderable components. MobX provides the mechanism to store and update the application state that React then uses.
MobX is a tool in the State Management Library category of a tech stack.
MobX is an open source tool with 22.3K GitHub stars and 1.4K GitHub forks. Here’s a link to MobX's open source repository on GitHub

Who uses MobX?

92 companies reportedly use MobX in their tech stacks, including Udemy, Canva, and Swat.io.

310 developers on StackShare have stated that they use MobX.

MobX Integrations

Public Decisions about MobX

Here are some stack decisions, common use cases and reviews by companies and developers who chose MobX in their tech stack.

Dan Robinson
Dan Robinson

The front end for Heap begun to grow unwieldy. The original jQuery pieces became difficult to maintain and scale, and a decision was made to introduce Backbone.js, Marionette, and TypeScript. Ultimately this ended up being a “detour” in the search for a scalable and maintainable front-end solution. The system did allow for developers to reuse components efficiently, but adding features was a difficult process, and it eventually became a bottleneck in advancing the product.

Today, the Heap product consists primarily of a customer-facing dashboard powered by React, MobX, and TypeScript on the front end. We wrote our migration to React and MobX in detail last year here.

#JavascriptUiLibraries #Libraries #JavascriptMvcFrameworks #TemplatingLanguagesExtensions

See more

We started rebuilding our dashboard components using React from AngularJS over 3 years ago and, in order to have predictable client-side state management we introduced Redux.js inside our stack because of the popularity it gained inside the JavaScript community; that said, the number of lines of codes needed to implement even the simplest form was unnecessarily high, from a simple form to a more complex component like our team management page.

By switching our state management to MobX we removed approximately 40% of our boilerplate code and simplified our front-end development flow, which in the ends allowed us to focus more into product features rather than architectural choices.

See more
Johnny Bell
Johnny Bell
Software Engineer at Weedmaps · | 9 upvotes · 160.8K views

We are always building new features and replacing old code at StackShare. Lately we have been building out new features for the frontend, and removing a lot of old jQuery code (sorry jQuery but it's time to go).

We've mainly been using React, ES6 and JavaScript on the frontend to build out the components, and we've been slowly removing some legacy MobX and using GraphQL and Apollo for our state management, if we need to control state further than GraphQL and Apollo allows us to we use just plain React with #context , or the new fancy React #hooks🎣 .

As we've moved towards the above tech, its really made smashing out new features and updating legacy code super fast, and really fun!

See more
John Barton
John Barton
CTO at Amber Electric · | 8 upvotes · 99.3K views

Frontend choice was basically pre-ordained to be React. Seems like a strong choice on merits alone, plus I needed to learn it to stay current. I never liked Redux.js from the first time I tried to work with it, but a mate had recommended MobX and after watching a few videos I felt like I could fit the mental model of hit in my head. Using Material-UI which is a great timesaver and make sure I throw a few bucks their way every month via the open source collective.

Defaulted to Rails with PostgreSQL just because that's where my past strength as a dev had been. First prototype was in Go but was struggling a bit with the quality of libraries I needed so I went back to old faithful.

As soon as TypeScript was supported by default in Create React App I ported everything over. That combined with swagger code gen has given me really good type safety from the API boundary and above. I semi-regret the Go/Rails decision because I miss the type safety despite pain points with libraries.

I will probably look to flip back to Go gradually (probably via lambda) at a point where it makes sense for the business.

See more
Russel Werner
Russel Werner
Lead Engineer at StackShare · | 5 upvotes · 99.1K views

Some of our existing pages use MobX however we decided to stop using MobX for new work for a few good reasons:

  1. It forced us to use an experimental language feature (decorators)
  2. We went all-in on GraphQL and Apollo to manage our data and local state.

For all the places where we don't store state in Apollo Client, we use plain old React and hooks (useState and useContext). Our first choice in state management it to have all state stored in Apollo keeping local state accurate by using mutation updates, client resolvers, and local cache.

See more
Piotr Brudny
Piotr Brudny

I am building a POC in Next.js. I usually use CRA+ MobX + Contentful, but this time I want to give a try to Next and GraphQL. Any suggestions on what tool to use for state management/content management? I am looking for a modern and quick to implement solution.

See more

MobX Alternatives & Comparisons

What are some alternatives to MobX?
Relay Framework
Never again communicate with your data store using an imperative API. Simply declare your data requirements using GraphQL and let Relay figure out how and when to fetch your data.
Knockout is a JavaScript MVVM (a modern variant of MVC) library that makes it easier to create rich, desktop-like user interfaces with JavaScript and HTML. It uses observers to make your UI automatically stay in sync with an underlying data model, along with a powerful and extensible set of declarative bindings to enable productive development.
GraphQL Cache
A custom middleware for graphql-ruby that handles key construction and cache reads/writes transparently.
Flux is the application architecture that Facebook uses for building client-side web applications. It complements React's composable view components by utilizing a unidirectional data flow. It's more of a pattern rather than a formal framework, and you can start using Flux immediately without a lot of new code.
Build a universal GraphQL API on top of your existing REST APIs, so you can ship new application features fast without waiting on backend changes.
See all alternatives

MobX's Followers
357 developers follow MobX to keep up with related blogs and decisions.
Edjo Brandão
David Muñoz
a QQ
Hassan Raza
Vijay Reddy
Nafiul Islam
Quốc Minh Châu
kishore kumar Burra
Oksana Balym