perf: 优化未开启多行文本时的布局性能 close #2693

[lijinke666]

👀 PR includes

🎨 Enhance

• Code style optimization
• Refactoring
• Change the UI
• Improve the performance
• Type optimization

📝 Description

1. 未开启换行, 或开启换行且文本只有一行时, 不测量文本高度, 提升布局性能 (对齐 1.x)
2. 多行文本的场景后续优化, 还没想到好的方案

🖼️ Screenshot

Before	After

🔗 Related issue link

closes #2693 #2710

🔍 Self-Check before the merge

• Add or update relevant docs.
• Add or update relevant demos.
• Add or update test case.
• Add or update relevant TypeScript definitions.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
antvis-s2	❌ Failed (Inspect)			May 15, 2024 8:50am

[github-actions]

Size Change: +63 B (+0.02%)

Total Size: 320 kB

Filename	Size	Change
./packages/s2-core/dist/index.min.js	223 kB	+63 B (+0.03%)

ℹ️ View Unchanged

Filename	Size
./packages/s2-core/dist/style.min.css	402 B
./packages/s2-react/dist/index.min.js	69.4 kB
./packages/s2-react/dist/style.min.css	3.92 kB
./packages/s2-vue/dist/index.min.js	21 kB
./packages/s2-vue/dist/style.min.css	1.99 kB

_{compressed-size-action}

[wyh888]

@lijinke666 hello大佬，想问下，是否可以通过计算字体大小样式、行高等来计算多行文本的行头高度呢，这样可以绕开 GC 频繁绘制文本后再获取高度

[lijinke666]

@lijinke666 hello大佬，想问下，是否可以通过计算字体大小样式、行高等来计算多行文本的行头高度呢，这样可以绕开 GC 频繁绘制文本后再获取高度

应该也是可行的, 不知道准确性如何, 之前主要考虑到走 G 5.0 分词的逻辑, 这样和其他技术栈的表现是一致的, 然后 S2 这一层只需要实现高度自适应

https://github.com/antvis/G/blob/4c60621fb34bb62907c0cefb7629810043eaa726/packages/g-lite/src/services/TextService.ts#L345-L462

这个 PR 先解决默认情况的性能, 如果你有其他好的方案欢迎多多讨论和 PR.

PS: 我不是大佬, 欢迎多交流和贡献.

[wyh888]

@lijinke666 hello大佬，想问下，是否可以通过计算字体大小样式、行高等来计算多行文本的行头高度呢，这样可以绕开 GC 频繁绘制文本后再获取高度

应该也是可行的, 不知道准确性如何, 之前主要考虑到走 G 5.0 分词的逻辑, 这样和其他技术栈的表现是一致的, 然后 S2 这一层只需要实现高度自适应

https://github.sheincorp.cn/antvis/G/blob/4c60621fb34bb62907c0cefb7629810043eaa726/packages/g-lite/src/services/TextService.ts#L345-L462

这个 PR 先解决默认情况的性能, 如果你有其他好的方案欢迎多多讨论和 PR.

PS: 我不是大佬, 欢迎多交流和贡献.

🐂🍺

[lijinke666]

🎉 This PR is included in version @antv/s2-v2.0.0-next.21 🎉

The release is available on:

• npm package (@next dist-tag)
• GitHub release

Your semantic-release bot 📦🚀