Flux Capacitor: Finding the fastest flux framework (v8)

Revision 8 of this benchmark created on

Preparation HTML

<script src="https://cdn.jsdelivr.net/immutable.js/3.7.2/immutable.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/2.5.2/rx.js"></script>
<script  src="//cdn.rawgit.com/mcwhittemore/9f0f189b2d4c46c5338a/raw/b6a1f8d1c90ff7942d6bbdaf40dcab2ee0cb6a59/alt.js"></script>
<script src="https://cdn.rawgit.com/mcwhittemore/9f0f189b2d4c46c5338a/raw/7f3396965efb285821071cdfd4a6ebc719899aa7/flummox.js"></script>

Setup

function getRandomInt(min, max) {
        return Math.floor(Math.random() * (max - min)) + min;
    }
    
    var id = 0;
    function newItem(){
      id++;
      return Immutable.Map({
          id: id,
          x: getRandomInt(0,1000),
          y: getRandomInt(0,1000),
          isSelected: getRandomInt(0,1) ? true : false
      });
    }
    
    var possibleActions = ["push", "pop"];
    var stackSize = 0;
    var actions = [];
    for(var i=0; i<10000; i++){
      var action = "push";
      if(stackSize>0){
        var actionId = getRandomInt(0,1);
        action = possibleActions[actionId];
      }
      if(action=="push"){ stackSize++; }
      else { stackSize--; }
      actions.push(action);
    }
    
    function runner(api){
      for(var i=0; i<actions.length; i++){
        var action = actions[i];
        api[action]();
      }
    }
    
        window.flummox.store.on('change',function(){    
    var items = window.flummox.store.state.items
        });
        
        window.altjs.store.listen(function(state){    
    var items = state.items
    });
    
    var Store = new Rx.Subject();
    
    var Dispatcher = new Rx.Subject();
    
    var _state = Immutable.OrderedMap();
    
    Store
        .map(function(payload) {
    _state = payload;
            return _state;
        })
        .subscribe(function(state) {
    var items = state;
        });
    
    var actions = {
        addItem: new Rx.Subject()
    .map(function(item){
      return _state.set(item.get("id"), item);
    })
    .subscribe(Store),
        removeItem: new Rx.Subject()
    .map(function(item){
      return _state.delete(item.get("id"));
    })
    };

Test runner

Ready to run.

Testing in
TestOps/sec
Flummox
var api = {
  "push": function(){
    var item = newItem();
    window.flummox.actions.addItem(item);
  },
  "pop": function(){
    var item =  window.flummox.store.state.items.valueSeq().get(0);
    window.flummox.actions.removeItem(item.get("id"));
  }
}

runner(api);
ready
Alt.js
var api = {
  "push": function(){
    var item = newItem();
    window.altjs.actions.addItem(item);
  },
  "pop": function(){
    var item =  window.altjs.store.getState().items.valueSeq().get(0);
    window.altjs.actions.removeItem(item.get("id"));
  }
}

runner(api);
ready
RxJS
var api = {
  "push": function(){
    var item = newItem();
    actions.addItem(item);
  },
  "pop": function(){
    var item =  _state.valueSeq().get(0);
    actions.removeItem(item.get("id"));
  }
}

runner(api);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.