Alternatives to vuex logo

Alternatives to vuex

Flux, RxJS, MobX, Nuxt.js, and EventBus are the most popular alternatives and competitors to vuex.
1.4K
921
+ 1
7

What is vuex and what are its top alternatives?

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.
vuex is a tool in the State Management Library category of a tech stack.
vuex is an open source tool with 28.3K GitHub stars and 9.6K GitHub forks. Here’s a link to vuex's open source repository on GitHub

Top Alternatives to vuex

  • Flux
    Flux

    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. ...

  • RxJS
    RxJS

    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. ...

  • MobX
    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. ...

  • Nuxt.js
    Nuxt.js

    Nuxt.js presets all the configuration needed to make your development of a Vue.js application enjoyable. You can use Nuxt.js for SSR, SPA, Static Generated, PWA and more. ...

  • EventBus
    EventBus

    It enables central communication to decoupled classes with just a few lines of code – simplifying the code, removing dependencies, and speeding up app development. ...

  • Apollo
    Apollo

    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. ...

  • Vue Router
    Vue Router

    It is the official router for Vue.js. It deeply integrates with Vue.js core to make building Single Page Applications with Vue.js a breeze. ...

  • axios
    axios

    It is a Javascript library used to make http requests from node.js or XMLHttpRequests from the browser and it supports the Promise API that is native to JS ES6. ...

vuex alternatives & related posts

Flux logo

Flux

513
508
130
Application Architecture for Building User Interfaces
513
508
+ 1
130
PROS OF FLUX
  • 44
    Unidirectional data flow
  • 32
    Architecture
  • 19
    Structure and Data Flow
  • 14
    Not MVC
  • 12
    Open source
  • 6
    Created by facebook
  • 3
    A gestalt shift
CONS OF FLUX
    Be the first to leave a con

    related Flux posts

    Marcos Iglesias
    Sr. Software Engineer at Eventbrite · | 13 upvotes · 222.1K views

    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.

    See more
    RxJS logo

    RxJS

    2K
    623
    21
    The Reactive Extensions for JavaScript
    2K
    623
    + 1
    21
    PROS OF RXJS
    • 6
      Easier async data chaining and combining
    • 3
      Steep learning curve, but offers predictable operations
    • 2
      Observable subjects
    • 2
      Ability to build your own stream
    • 2
      Works great with any state management implementation
    • 2
      Easier testing
    • 1
      Lot of build-in operators
    • 1
      Simplifies state management
    • 1
      Great for push based architecture
    • 1
      Documentation
    CONS OF RXJS
    • 3
      Steep learning curve

    related RxJS posts

    MobX logo

    MobX

    726
    511
    114
    Simple, scalable state management
    726
    511
    + 1
    114
    PROS OF MOBX
    • 26
      It's just stupidly simple, yet so magical
    • 18
      Easier and cleaner than Redux
    • 15
      Fast
    • 13
      Automagic updates
    • 13
      React integration
    • 10
      Computed properties
    • 8
      ES6 observers and obversables
    • 7
      Global stores
    • 3
      Flexible architecture the requeriment
    • 1
      Has own router package (mobx-router)
    CONS OF MOBX
    • 1
      Maturity

    related MobX posts

    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
    Nuxt.js logo

    Nuxt.js

    1.9K
    1.6K
    351
    The Vue.js Framework
    1.9K
    1.6K
    + 1
    351
    PROS OF NUXT.JS
    • 59
      SSR
    • 46
      Automatic routes
    • 30
      Middleware
    • 27
      Hot code reloading
    • 21
      Easy setup, easy to use, great community, FRENCH TOUCH
    • 20
      SPA
    • 20
      Static Websites
    • 19
      Plugins
    • 19
      Code splitting for every page
    • 17
      Custom layouts
    • 14
      Automatic transpilation and bundling (with webpack and
    • 12
      Modules ecosystem
    • 12
      Easy setup
    • 10
      Amazing Developer Experience
    • 10
      Vibrant and helpful community
    • 10
      Pages directory
    • 5
      Its Great for Team Development
    CONS OF NUXT.JS
      Be the first to leave a con

      related Nuxt.js posts

      Simon Reymann
      Senior Fullstack Developer at QUANTUSflow Software GmbH · | 23 upvotes · 4.7M views

      Our whole Vue.js frontend stack (incl. SSR) consists of the following tools:

      • Nuxt.js consisting of Vue CLI, Vue Router, vuex, Webpack and Sass (Bundler for HTML5, CSS 3), Babel (Transpiler for JavaScript),
      • 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.
      See more
      Giordanna De Gregoriis
      Jr Fullstack Developer at Stefanini Inspiring · | 8 upvotes · 440.5K views

      TL;DR: Shall I keep developing with Nuxt.js 2 and wait for a migration guide to Nuxt 3? Or start developing with Vue.js 3 using Vite, and then migrate to Nuxt 3 when it comes out?

      Long version: We have an old web application running on AngularJS and Bootstrap for frontend. It is mostly a user interface to easily read and post data to our engine.

      We want to redo this web application. Started from scratch using the newest version of Angular 2+ and Material Design for frontend. We haven't even finished rewriting half of the application and it is becoming dreadful to work on.

      • The cold start takes too much time
      • Every little change reload the whole page. Seconds to minutes of development lost looking at a loading blank page just changing css
      • Code maintainability is getting worse... again... as the application grows, since we must create everytime 5 files for a new page (html, component.ts, module.ts, scss, routing.ts)

      I'm currently trying to code a Proof of Concept using Nuxt.js and Tailwind CSS. But the thing is, Vue.js 3 is out and has interesting features such as the composition API, teleport and fragments. Also we wish to use the Vite frontend tooling, to improve our time developing regardless of our application size. It feels like a better alternative to Webpack, which is what Nuxt 2 uses.

      I'm already trying Nuxt.js with the nuxt-vite experimental module, but many nuxt modules are still incompatible from the time I'm posting this. It is also becoming cumbersome not being able to use teleport or fragments, but that can be circumvented with good components.

      What I'm asking is, what should be the wisest decision: keep developing with Nuxt 2 and wait for a migration guide to Nuxt 3? Or start developing with Vue.js 3 using Vite, and then migrate to Nuxt 3 when it comes out?

      See more
      EventBus logo

      EventBus

      63
      33
      0
      An open-source library for Android and Java
      63
      33
      + 1
      0
      PROS OF EVENTBUS
        Be the first to leave a pro
        CONS OF EVENTBUS
          Be the first to leave a con

          related EventBus posts

          Apollo logo

          Apollo

          2.4K
          1.8K
          25
          GraphQL server for Express, Connect, Hapi, Koa and more
          2.4K
          1.8K
          + 1
          25
          PROS OF APOLLO
          • 12
            From the creators of Meteor
          • 8
            Great documentation
          • 3
            Open source
          • 2
            Real time if use subscription
          CONS OF APOLLO
          • 1
            File upload is not supported
          • 1
            Increase in complexity of implementing (subscription)

          related Apollo posts

          Nick Rockwell
          SVP, Engineering at Fastly · | 46 upvotes · 3.2M views

          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.

          See more
          Adam Neary

          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.

          #BackendDrivenUI

          See more
          Vue Router logo

          Vue Router

          319
          230
          0
          The official router for Vue.js
          319
          230
          + 1
          0
          PROS OF VUE ROUTER
            Be the first to leave a pro
            CONS OF VUE ROUTER
              Be the first to leave a con

              related Vue Router posts

              Simon Reymann
              Senior Fullstack Developer at QUANTUSflow Software GmbH · | 23 upvotes · 4.7M views

              Our whole Vue.js frontend stack (incl. SSR) consists of the following tools:

              • Nuxt.js consisting of Vue CLI, Vue Router, vuex, Webpack and Sass (Bundler for HTML5, CSS 3), Babel (Transpiler for JavaScript),
              • 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.
              See more

              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.

              See more
              axios logo

              axios

              3K
              403
              0
              Promise based HTTP client for the browser and node.js
              3K
              403
              + 1
              0
              PROS OF AXIOS
                Be the first to leave a pro
                CONS OF AXIOS
                  Be the first to leave a con

                  related axios posts