"Autosave with undo/redo" vs "Save/Revert buttons" when using backbone.js

Question

I'm building a data entry intensive RIA using backbone.js. My first plan was to have "Save" and "Cancel" buttons on my UI and to only save my models in big chunks whenever the user hits save. Hitting cancel would simply reload the model from the server. This way, users don't need to worry about making irreversible mistakes.

I'm however now realizing that implementing undo/redo would probably not be so difficult given how easy it is to "watch" for changes on models and have a view correctly update itself when reverting model values. If I had undo/redo, I'd then choose to have my models save to the server instantly.

Is one of the two approaches favoured by backbone? What's a good way to implement the undo/redo using backbone's style of MVC?

Answer 1

You've been waiting a while for this answer, maybe you've answered it already. I do not have code, but a couple of concepts struck me off the top of my head.

From a high level, I would have a base model that was undoable -- or maybe you could use some form of mixin to give a model the ability to be undoable. The implementation of the undo would use the command pattern to form a multi-level undo 'stack'.

If I were implementing this, I think I might equip an undoable model with a backbone.js collection of command models. These command models would encapsulate the changes to the undoable model and would be created in conjunction with a change event from the model. To undo a change to the undoable model, you would pop the top command off and have it apply its undo to the undoable model. A server refresh would wipe away the collection of commands.

The one complication to all of this is how to manage through the changes that occur due to an undo -- these themselves should not generate an undo command to the top of the stack.

Hope this helps.