[Bug]: G6的动画性能问题 大概一百多条边的蚂蚁线就掉帧严重
- Dominant language
- TypeScript
- Stars
- 12.3k
- Forks
- 1.6k
- PR merge metrics
- No merged PRs in 30d
Description
### Describe the bug / 问题描述
写法就按示例中的https://g6.antv.antgroup.com/examples/animation/persistence/#ant-line
在自定义边里添加动画:onCreate() {
const shape = this.shapeMap.key;
shape.animate([{ lineDashOffset: -20 }, { lineDashOffset: 0 }], {
duration: 500,
iterations: Infinity,
});
}
大概140条边就很卡 页面反应很慢
### Reproduction link / 复现链接
_No response_
### Steps to Reproduce the Bug or Issue / 重现步骤
### Version / 版本
🆕 5.x
### OS / 操作系统
- [ ] macOS
- [x] Windows
- [ ] Linux
- [ ] Others / 其他
### Browser / 浏览器
- [x] Chrome
- [x] Edge
- [ ] Firefox
- [ ] Safari (Limited support / 有限支持)
- [ ] IE (Nonsupport / 不支持)
- [ ] Others / 其他
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with the G6 persistence ant-line example linked in the issue and reproduce the custom edge animation from its onCreate() method in Chrome or Edge on Windows. Measure responsiveness and frame performance with roughly 140 animated edges; the issue is resolved when this case no longer causes severe frame drops or a documented limitation is established.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- data-visualization
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100