Javascript 如何在flux应用程序中实现操作队列

据Jing Chen（Facebook）称，他们在upcomming中继框架中实现了类似的功能：

我只是好奇，是否有人在通量架构中实现了类似的东西，那么心智模型是什么样子的？据我所知，您将在“真相之源”存储之外创建一个附加存储，以保持乐观更新的状态。然后，根据服务器的反馈，您将以任何方式将其从乐观存储中取出，然后将其合并到“真实”存储中，或者跳过合并并重新渲染视图。视图同时显示“真理之源”存储中的内容和乐观存储中的内容，这一顺序是否正确

---

如果有人已经实现了类似的功能，那么如果你能分享你的经验和思维模式，那就太好了。

我也一直在这里寻找答案。运气不好，所以我自己想办法解决

所以，如果你听Jing在这一部分所说的话，我不认为你在用变异状态维护一个单独的存储。她说要坚持乐观的行动。她还提到，消除这些突变是一种痛苦，而且确实如此跟踪变异状态是敌人。

她所描述的是缓存和验证用户正在执行的操作，而不是这些操作如何改变状态

---

因此，让我们创建一个todo项并将其异步保存到服务器。目标是按操作发生的顺序保存操作。每次视图请求TODO时，都会动态应用这些突变。视图不知道脏模型和保存模型之间的区别，因为它不需要知道。但是，只有当服务器做出成功或失败的响应时，真相的来源才会改变

// ........................
// === Add Todo Action  ===
// ^^^^^^^^^^^^^^^^^^^^^^^^
var addTodoAction = function(todo) {
    var actionId = guid();

    Dispatcher.dispatch({
        actionType: 'ADD_TODO',
        actionId: actionId,
        payload: todo
    });

    // Async Operation (save to server)
    // Callbacks for success and error
    API.addTodo(todo, function(res) {
        Dispatcher.dispatch({
            actionType: 'ADD_TODO_SUCCESS',
            actionId: actionId, // Identify the same optimistic action
            payload: res.todo
        });
    }, function(err) {
        Dispatcher.dispatch({
            actionType: 'ADD_TODO_FAILURE',
            actionId: actionId, // Identify the same optimistic action
            error: err
        });
    });
};





// ................................
// === Private Todos Collection ===
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
var _todos = new Immutable.OrderedMap();

// Add todo to collection
var addTodo = function(todo) {
    _todos = _todos.set(todo.id, todo);
};


// ........................................
// === Collection of Optimistic Updates ===
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
var _actions = new Immutable.OrderedMap(); // Ordered Immutable Map to preserve sequential order of mutations

// Add action to queue
var addAction = function(e) {
    _actions = _actions.set(e.actionId, e);
};

// Remove action
var removeAction = function(e) {
    _actions = _actions.delete(e.actionId);
};


// ........................................................
// === Create Mutation of Source of Truth for the View ===
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
var getOptimisticTodos = function() {

    // Loop through optimistic mutations in order, and apply them to a copy of the state.
    return _.reduce(_actions.toArray(), function(todos, action) {
        switch (action.actionType) {
            case 'ADD_TODO':
                todos = todos.set(action.payload.id, action.payload);
                break;
            default:
        }
        return todos;
    }, _todos.asImmutable());

};



// ..........................................
// === Create a Public API for Todo Store ===
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
var TodoStore = _.extend({}, Events, {
    getTodos: function() {
        return getOptimisticTodos();
    }
});

// ......................................
// === Register actions we care about ===
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

/* Example Dispatch 
* 
*   {
*       actionId: 12345,
*       actionType: 'ADD_TODO_SUCCESS',
*       payload: {
*           id: 12345,
*           text: 'Example Todo'
*       }
*           
*   }
* 
*/

TodoStore.dispatchToken = Dispatcher.register(function(e){
    switch (e.actionType) {
        case 'ADD_TODO':
            addAction(e); // add optimistic action to queue
            TodoStore.trigger('change'); // let views know about change
            break;
        case 'ADD_TODO_SUCCESS':
            removeAction(e); // remove optimistic action because it succeeded
            addTodo(e.payload); // add todo to source of truth
            TodoStore.trigger('change'); // let views know about change
            break;
        case 'ADD_TODO_FAILURE':
            removeAction(e); // remove optimistic action because it failed
            console.log(e.error); // handle error in store or elswhere
            TodoStore.trigger('change'); // let views know about change
            break;
        default:
    }
});

---

除了使用+1之外，我没有什么建设性的话要说！