Alternatives to vuex logo

Alternatives to vuex

Flux, RxJS, MobX, Nuxt.js, and EventBus are the most popular alternatives and competitors to vuex.
1.1K
803
+ 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 27K GitHub stars and 9.2K 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

458
462
130
Application Architecture for Building User Interfaces
458
462
+ 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 · 156.4K 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

    1.3K
    523
    12
    The Reactive Extensions for JavaScript
    1.3K
    523
    + 1
    12
    PROS OF RXJS
    • 4
      Easier async data chaining and combining
    • 3
      Steep learning curve, but offers predictable operations
    • 2
      Works great with any state management implementation
    • 2
      Easier testing
    • 1
      Ability to build your own stream
    CONS OF RXJS
    • 1
      Steep learning curve

    related RxJS posts

    MobX logo

    MobX

    563
    440
    125
    Simple, scalable state management
    563
    440
    + 1
    125
    PROS OF MOBX
    • 26
      It's just stupidly simple, yet so magical
    • 18
      Easier and cleaner than Redux
    • 15
      Fast
    • 13
      React integration
    • 13
      Automagic updates
    • 11
      Zero boilerplate
    • 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.3K
    1.2K
    273
    The Vue.js Framework
    1.3K
    1.2K
    + 1
    273
    PROS OF NUXT.JS
    • 41
      SSR
    • 36
      Automatic routes
    • 24
      Middleware
    • 21
      Hot code reloading
    • 18
      Easy setup, easy to use, great community, FRENCH TOUCH
    • 17
      Static Websites
    • 17
      SPA
    • 15
      Plugins
    • 13
      Custom layouts
    • 13
      Code splitting for every page
    • 11
      Automatic transpilation and bundling (with webpack and
    • 10
      Modules ecosystem
    • 8
      Easy setup
    • 7
      Vibrant and helpful community
    • 7
      Pages directory
    • 7
      Amazing Developer Experience
    • 6
      Not React
    • 2
      Its Great for Team Development
    CONS OF NUXT.JS
    • 3
      Still vue 2
    • 1
      Not React

    related Nuxt.js posts

    Simon Reymann
    Senior Fullstack Developer at QUANTUSflow Software GmbH · | 20 upvotes · 783.9K 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 · 77.3K 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

    31
    26
    0
    An open-source library for Android and Java
    31
    26
    + 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

        1.9K
        1.5K
        18
        GraphQL server for Express, Connect, Hapi, Koa and more
        1.9K
        1.5K
        + 1
        18
        PROS OF APOLLO
        • 12
          From the creators of Meteor
        • 3
          Great documentation
        • 2
          Real time if use subscription
        • 1
          Open source
        CONS OF APOLLO
          Be the first to leave a con

          related Apollo posts

          Nick Rockwell
          SVP, Engineering at Fastly · | 44 upvotes · 1.7M 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

          273
          195
          0
          The official router for Vue.js
          273
          195
          + 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 · | 20 upvotes · 783.9K 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
              Tim Nolet

              Vue.js Intercom JavaScript Node.js vuex Vue Router

              My SaaS recently switched to Intercom for all customer support and communication. To get the most out of Intercom, you need to integrate it with your app. This means instrumenting some code and tweaking some bits of your app's navigation. Checkly is a 100% Vue.js app, so in this post we'll look at the following:

              • Identifying a user with some handy attributes
              • Getting page views right with Vue Router
              • Sending events with Vuex
              • Some nice things you can now do in Intercom

              After finishing this integration, you can actively segment your customers into trial, lapsed, active etc. etc.

              See more
              axios logo

              axios

              1.2K
              302
              0
              Promise based HTTP client for the browser and node.js
              1.2K
              302
              + 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