What is MobX and what are its top alternatives?
Top 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. ...
- 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. ...
Vuex is a state management pattern + library for Vue.js applications. It serves as a centralized store for all the components in an application, with rules ensuring that the state can only be mutated in a predictable fashion. It also integrates with Vue's official devtools extension to provide advanced features such as zero-config time-travel debugging and state snapshot export / import. ...
RxJS is a library for reactive programming using Observables, to make it easier to compose asynchronous or callback-based code. This project is a rewrite of Reactive-Extensions/RxJS with better performance, better modularity, better debuggable call stacks, while staying mostly backwards compatible, with some breaking changes that reduce the API surface. ...
Lots of people use React as the V in MVC. Since React makes no assumptions about the rest of your technology stack, it's easy to try it out on a small feature in an existing project. ...
MobX alternatives & related posts
- Relay Modern1
related Relay Framework posts
Apollo is my favorite open source project.
Two things you need to worry about when making a statement like that: is the tool good, and how is the tool being built?
From a tool perspective... yeah, Apollo is great. I'm convinced that GraphQL is the way forward for me, and Apollo's just a great way to tackle it. Even beyond that, it just offers a good mentality to how you should build your database-backed app. I've used Relay in the past, back before they made a bunch of changes with Relay Modern (which all seem positive!), but switching to Apollo is just night-and-day. They've been doing better in the last 12 months or so at making smart abstractions in the React Apollo library, to the point where I'd just get these monster all-red pull requests where I can delete all my cruddy code and replace it with far fewer lines of their great abstractions.
But from a build perspective... Apollo fares even better, I think. By this, I mean their project inertia, their progress, their ability to ship stable code — but still ship meaningful new functionality, too. They're not afraid to move their ideas in other directions (integrating with React Native, for example). Kills me to see projects that are just heads-down on their little world as the world passes them by, and so far... yeah, Apollo's been on top of it.
Anyway, big fan. It's really changed how I write frontend code, and I feel hella confident while working with it.
- Data centered application3
- Great for validations2
- Open source1
related Knockout posts
related GraphQL Cache posts
- Unidirectional data flow44
- Structure and Data Flow19
- Not MVC14
- Open source12
- Created by facebook6
- A gestalt shift3
related Flux posts
We are in the middle of a change of the stack on the front end. So we used Backbone.js with Marionette. Then we also created our own implementation of a Flux kind of flow. We call it eb-flux. We have worked with Marionette for a long time. Then at some point we start evolving and end up having a kind of Redux.js-style architecture, but with Marionette.
But then maybe one and a half years ago, we started moving into React and that's why we created the Eventbrite design system. It's a really nice project that probably could be open sourced. It's a library of components for our React components.
With the help of that library, we are building our new stack with React and sometimes Redux when it's necessary.
- From the creators of Meteor12
- Great documentation5
- Open source3
- Real time if use subscription2
- File upload is not supported1
- Increase in complexity of implementing (subscription)1
related Apollo posts
When I joined NYT there was already broad dissatisfaction with the LAMP (Linux Apache HTTP Server MySQL PHP) Stack and the front end framework, in particular. So, I wasn't passing judgment on it. I mean, LAMP's fine, you can do good work in LAMP. It's a little dated at this point, but it's not ... I didn't want to rip it out for its own sake, but everyone else was like, "We don't like this, it's really inflexible." And I remember from being outside the company when that was called MIT FIVE when it had launched. And been observing it from the outside, and I was like, you guys took so long to do that and you did it so carefully, and yet you're not happy with your decisions. Why is that? That was more the impetus. If we're going to do this again, how are we going to do it in a way that we're gonna get a better result?
So we're moving quickly away from LAMP, I would say. So, right now, the new front end is React based and using Apollo. And we've been in a long, protracted, gradual rollout of the core experiences.
React is now talking to GraphQL as a primary API. There's a Node.js back end, to the front end, which is mainly for server-side rendering, as well.
Behind there, the main repository for the GraphQL server is a big table repository, that we call Bodega because it's a convenience store. And that reads off of a Kafka pipeline.
At Airbnb we use GraphQL Unions for a "Backend-Driven UI." We have built a system where a very dynamic page is constructed based on a query that will return an array of some set of possible “sections.” These sections are responsive and define the UI completely.
The central file that manages this would be a generated file. Since the list of possible sections is quite large (~50 sections today for Search), it also presumes we have a sane mechanism for lazy-loading components with server rendering, which is a topic for another post. Suffice it to say, we do not need to package all possible sections in a massive bundle to account for everything up front.
Each section component defines its own query fragment, colocated with the section’s component code. This is the general idea of Backend-Driven UI at Airbnb. It’s used in a number of places, including Search, Trip Planner, Host tools, and various landing pages. We use this as our starting point, and then in the demo show how to (1) make and update to an existing section, and (2) add a new section.
While building your product, you want to be able to explore your schema, discovering field names and testing out potential queries on live development data. We achieve that today with GraphQL Playground, the work of our friends at #Prisma. The tools come standard with Apollo Server.
- Zero-config time-travel2
- Centralized State Management2
- Easy to setup1
related vuex posts
Our whole Vue.js frontend stack (incl. SSR) consists of the following tools:
- Vue Styleguidist as our style guide and pool of developed Vue.js components
- Vuetify as Material Component Framework (for fast app development)
- TypeScript as programming language
- Apollo / GraphQL (incl. GraphiQL) for data access layer (https://apollo.vuejs.org/)
- ESLint, TSLint and Prettier for coding style and code analyzes
- Jest as testing framework
- Google Fonts and Font Awesome for typography and icon toolkit
- NativeScript-Vue for mobile development
The main reason we have chosen Vue.js over React and AngularJS is related to the following artifacts:
- Empowered HTML. Vue.js has many similar approaches with Angular. This helps to optimize HTML blocks handling with the use of different components.
- Detailed documentation. Vue.js has very good documentation which can fasten learning curve for developers.
- Adaptability. It provides a rapid switching period from other frameworks. It has similarities with Angular and React in terms of design and architecture.
- Awesome integration. Vue.js can be used for both building single-page applications and more difficult web interfaces of apps. Smaller interactive parts can be easily integrated into the existing infrastructure with no negative effect on the entire system.
- Large scaling. Vue.js can help to develop pretty large reusable templates.
- Tiny size. Vue.js weights around 20KB keeping its speed and flexibility. It allows reaching much better performance in comparison to other frameworks.
Vue.js vuex Vue Router Quasar Framework Electron Node.js npm Yarn Git GitHub Netlify My tech stack that helps me develop quickly and efficiently. Wouldn't want it any other way.
- Easier async data chaining and combining5
- Steep learning curve, but offers predictable operations3
- Easier testing2
- Ability to build your own stream2
- Works great with any state management implementation2
- Lot of build-in operators1
- Simplifies state management1
- Observable subjects1
- Great for push based architecture1
- Steep learning curve3
related RxJS posts
- Virtual dom663
- Data flow183
- Isn't an mvc framework126
- Reactive updates116
- Explicit app state113
- Learn once, write everywhere27
- Uni-directional data flow20
- Easy to Use20
- Works great with Flux Architecture16
- Great perfomance11
- Built by Facebook9
- TypeScript support7
- Excellent Documentation5
- Easy as Lego5
- Server Side Rendering5
- Feels like the 90s5
- Easy to start5
- Strong Community4
- Server side views4
- Fancy third party tools4
- Scales super well4
- Start simple4
- Super easy4
- Simple, easy to reason about and makes you productive3
- Fast evolving3
- Great migration pathway for older systems3
- Rich ecosystem3
- Has functional components3
- Allows creating single page applications3
- Has arrow functions3
- Very gentle learning curve3
- Beautiful and Neat Component Management3
- Just the View of MVC3
- Split your UI into components with one true state2
- Every decision architecture wise makes sense2
- Image upload1
- Requires discipline to keep architecture organized38
- No predefined way to structure your app27
- Need to be familiar with lots of third party packages26
- Not enterprise friendly8
- One-way binding only6
- State consistency with backend neglected3
- Bad Documentation3
- Paradigms change too fast2
- Error boundary is needed2
related React posts
I am starting to become a full-stack developer, by choosing and learning .NET Core for API Development, Angular CLI / React for UI Development, MongoDB for database, as it a NoSQL DB and Flutter / React Native for Mobile App Development. Using Postman, Markdown and Visual Studio Code for development.
I picked up an idea to develop and it was no brainer I had to go with React for the frontend. I was faced with challenges when it came to what component framework to use. I had worked extensively with Material-UI but I needed something different that would offer me wider range of well customized components (I became pretty slow at styling). I brought in Evergreen after several sampling and reads online but again, after several prototype development against Evergreen—since I was using TypeScript and I had to import custom Type, it felt exhaustive. After I validated Evergreen with the designs of the idea I was developing, I also noticed I might have to do a lot of styling. I later stumbled on Material Kit, the one specifically made for React . It was promising with beautifully crafted components, most of which fits into the designs pages I had on ground.
A major problem of Material Kit for me is it isn't written in TypeScript and there isn't any plans to support its TypeScript version. I rolled up my sleeve and started converting their components to TypeScript and if you'll ask me, I am still on it.
In summary, I used the Create React App with TypeScript support and I am spending some time converting Material Kit to TypeScript before I start developing against it. All of these components are going to be hosted on Bit.
If you feel I am crazy or I have gotten something wrong, I'll be willing to listen to your opinion. Also, if you want to have a share of whatever TypeScript version of Material Kit I end up coming up with, let me know.