-
Is there a guideline or Konva way or any best practice to implement undo / redo with Konva? I got from an issue that the maintainer recommends to manually implement undo / redo. We have found out that without a generic way, it would be very hard if not impossible to implement multiple steps undo / redo as it would requires application developer carefully track stage shapes' movements and also any design entity logic relationship changes. Is there any chance to take a whole stage snapshot at any user interaction where app decides good for a snap shot then use the snap shots for undo / redo? I understand Konva provides JSON serialization. Could it be used for this purpose? Has the community ever successfully implemented Undo / Redo with Konva? Any suggestions would be much appreciated. Thanks. |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 1 reply
-
Everything is already described here: https://konvajs.org/docs/data_and_serialization/Best_Practices.html#What-is-the-best-way-to-save-load-full-stage-content-and-how-to-implement-undo-redo In short: You can use Konva JSON serialization for that. But I don't recommend doing that. It may work from simple scenes. But when you have event listeners, images, caching, etc, managing updates via Konva serialization will be hard. |
Beta Was this translation helpful? Give feedback.
Everything is already described here:
https://konvajs.org/docs/data_and_serialization/Best_Practices.html#What-is-the-best-way-to-save-load-full-stage-content-and-how-to-implement-undo-redo
And here (react specific, but the idea is the same for other solutions):
https://konvajs.org/docs/react/Undo-Redo.html#page-title
In short:
You should not connect Konva and undo/redo function. Konva is a rendering engine. You can use pure DOM, SVG or any other drawing framework to render shapes on the page. From my standpoint, undo/redo should be independent of rendering.
You can use Konva JSON serialization for that. But I don't recommend doing that. It may work from simple scenes. But when you have e…