Skip to content

切换主题时,SVG 节点的尺寸都会重新计算,性能较差(尤其在低版本chrome下) #1162

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
FuDesign2008 opened this issue Mar 18, 2025 · 0 comments

Comments

@FuDesign2008
Copy link

FuDesign2008 commented Mar 18, 2025

当切换主题配色时,会重新计算节点的大小 (详见 Base.js 文件 )

      // 主题或主题配置改变了
      const isResizeSource = this.checkIsNeedResizeSources()
      // 节点数据改变了
      const isNodeDataChange = this.checkIsNodeDataChange(
        data._node.nodeDataSnapshot,
        data.data
      )
      // 重新计算节点大小和布局
      if (
        isResizeSource ||
        isNodeDataChange ||
        isLayerTypeChange ||
        newNode.getData('resetRichText') ||
        newNode.getData('needUpdate') ||
        isNodeInnerPrefixChange
      ) {
        newNode.getSize()
        newNode.needLayout = true
      }
  // 检查当前来源是否需要重新计算节点大小
  checkIsNeedResizeSources() {
    return [CONSTANTS.CHANGE_THEME].includes(this.renderer.renderSource)
  }
  1. newNode.getSize() 调用 svg 的原生方法获取尺寸大小 —— 非常消耗性能,尤其在 chrome 某些较低版本中(并非所有的浏览器都是最新内核,比如移动端、electron)
  2. checkIsNeedResizeSources 或许可以更精细控制,CHANGE_THEME 表示主题配色从A 到 B 有变化,并不意味着 主题配色 A 切换到 主题配色B,节点需要重新计算大小 —— 存在主题配色 A 与 B 仅仅是颜色变化,并不影响当前节点的尺寸。 此处或许可以更精细的判断,以减少对 newNode.getSize() 这一耗时操作的调用

以下是文件 切换主题.json 在较低版本 chrome 和 最新版本 chrome 切换主题时的 log

Image

Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant