X6 icon indicating copy to clipboard operation
X6 copied to clipboard

x6怎么回事,拖拽的时候明显掉帧啊?

Open komagic opened this issue 2 years ago • 11 comments

Describe the bug

x6 物体拖拽的时候有明显卡顿情况

Your Example Website or App

code

Steps to Reproduce the Bug or Issue

任意一个demo

Expected behavior

拖拽物体,理论上不应该掉帧这么严重

Screenshots or Videos

No response

Platform

  • OS: [e.g. macOS, Windows, Linux]
  • Browser: [e.g. Chrome, Safari, Firefox]
  • Version: [e.g. 91.1]

Additional context

No response

komagic avatar Jul 20 '22 13:07 komagic

👋 @komagic

Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it.

To help make it easier for us to investigate your issue, please follow the contributing guidelines.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

x6-bot[bot] avatar Jul 20 '22 13:07 x6-bot[bot]

如果有明显卡顿,需要看一下具体的代码,可以放个codesandbox的demo么?或者上传一个视频

babachao avatar Jul 21 '22 02:07 babachao

https://x6.antv.vision/zh/examples/node/group#expand-shrink

就是随便打开一个,一个拉拉的水库,没有一个简单的拖拉,可以拖着一卡一卡的,都不是随便拖拖拉拉的

说的是fabric.js?

babachao avatar Jul 21 '22 05:07 babachao

我下代码,敢肯定,这个东西顿时,页面会出现明显的停顿,都 没有缓存计算 没有工人 大量使用动态显示大量使用没有 转移这种操作的方法数据存储完全 优化 没有检测到离屏渲染

建议你可以先了解一下X6的定位,可以看下这个 X6是基于SVG,性能肯定是不如Canvas的,但是自定义节点成本低,像制作流程图之类的,而且流程图场景一般不需要渲染大量的节点

babachao avatar Jul 21 '22 05:07 babachao

如果你有大量数据可视化场景,可以了解一下G6

babachao avatar Jul 21 '22 05:07 babachao

为啥不用 canvas +blob 渲染svg

komagic avatar Jul 21 '22 05:07 komagic

😌我做了营销活动的流程图,也是有大量表单交互,可以自己写HTML定义节点,我觉得很方便

babachao avatar Jul 21 '22 05:07 babachao

用canvas的话想自定义实现产品要的图形节点就会比较复杂了

babachao avatar Jul 21 '22 05:07 babachao

@komagic @babachao 拖动过程中一直动态修改 dom 元素位置,掉帧现在肯定存在,但是一卡一卡的我猜想是因为移动是以网格为单位,而不是像素为单位,你可以将网格大小分别设大或者小一点查看效果。

NewByVector avatar Jul 21 '22 05:07 NewByVector

@komagic @babachao 拖动过程中一直动态修改 dom 元素位置,掉帧现在肯定存在,但是一卡一卡的我猜想是因为移动是以网格为单位,而不是像素为单位,你可以将网格大小分别设大或者小一点查看效果。

嗦嘎,明白了😌

babachao avatar Jul 21 '22 06:07 babachao

我的眼 能够分辨电脑的144帧和60帧,所以对这些有些敏感。 哈哈,可以,这个讨论起到了效果。不错,不错。

脱离文档流,减少reflow 有可能不

komagic avatar Jul 21 '22 07:07 komagic

请问上面的回答有解决你的问题吗,为了高效沟通,我们暂时关闭这个 issue,如果有必要,请重新开一个新的 issue。

NewByVector avatar Aug 21 '22 13:08 NewByVector

This thread has been automatically locked because it has not had recent activity.

Please open a new issue for related bugs and link to relevant comments in this thread.

x6-bot[bot] avatar Aug 22 '23 00:08 x6-bot[bot]