项目优化之撤销功能的优化

最新推荐文章于 2023-03-29 01:27:29 发布

Hayden丶

最新推荐文章于 2023-03-29 01:27:29 发布

阅读量314

点赞数

分类专栏：前端文章标签：前端优化撤销

本文链接：https://blog.csdn.net/qq_34179086/article/details/88368629

版权

在项目中实现撤销功能时，初始采用全量存储和深拷贝策略导致性能问题。通过分析，发现深拷贝是全量存储的副产品。为优化，提出了使用增量存储，记录每次操作并执行逆向操作来实现撤销，有效减少内存消耗和提高性能。此优化方案适用于操作简单的场景。

摘要由CSDN通过智能技术生成

项目优化之撤销功能的优化

本文写于2018/7/12

1、初始

在开发一个管理系统的时候，遇到了这样的一个需求，用户可以通过操作建立一颗组织机构树，在建立树的过程中可以对树进行新增节点、修改属性、删除节点以及撤销操作等功能。

对于其他功能的实现，就不再多做讲述了，这里主要介绍一下撤销功能，这个功能伪代码实现如下。

let tree = {
   } // 组织机构树的数据结构
let history = []
function render (tree) {
   
    // render tree
}
function pushHistory () {
   
    history.push(JSON.parse(JSON.stringify(tree)))
}
/**
 * action的装饰器
 */
function actionDecorator (actionFn) {
   
    return function () {
   
        let result = actionFn.call(this, ...arguments)
        render(tree)
        pushHistory()
    }
}
function addAction (node) {