Skip to content

升级2.0.0-rc1后,菜单明显切换变慢 #3188

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

Closed
1 task
anncwb opened this issue Nov 16, 2020 · 10 comments
Closed
1 task

升级2.0.0-rc1后,菜单明显切换变慢 #3188

anncwb opened this issue Nov 16, 2020 · 10 comments
Assignees
Labels
2.x for 2.x Accept You are right, we should do that enhancement outdated

Comments

@anncwb
Copy link
Contributor

anncwb commented Nov 16, 2020

  • I have searched the issues of this repository and believe that this is not a duplicate.

Version

2.0.0-rc.1

Environment

vite vue3

Steps to reproduce

升级到2.0.0-rc.1后,点击菜单,会卡顿一会才切换。还原到beta15则不会。

What is expected?

还原beta15的菜单

What is actually happening?

菜单切换选择效果变慢

@tangjinzhou
Copy link
Member

omg 没有更流畅吗 官网体验感觉更好啊 不科学啊

@anncwb
Copy link
Contributor Author

anncwb commented Nov 16, 2020

@tangjinzhou 是改变这个selectedKeys 的时候渲染更慢。可能要在菜单数量多一点的时候才能出来。大概60+菜单。我在2.0.0-rc1的时候很明显感觉到。所以尝试还原到beta15,并删除yarn.lock防止依赖没改。最后菜单明显在改变selectedKeys的时候渲染快了很多

@tangjinzhou tangjinzhou added enhancement 2.x for 2.x Accept You are right, we should do that labels Nov 16, 2020
@Fgoo9527
Copy link

同样有这样的视觉交过,明显的掉帧的感觉,很卡

@Layczm
Copy link

Layczm commented Nov 17, 2020

@tangjinzhou 这个确实会卡,现在升级上来rc.1,点击菜单的时候渲染慢导致路由切换变慢。菜单多的时候很明显的视觉效果。rc1有需要的功能,能否优先优化下或者将菜单先还原到上一个版本。不然目前整体切换总是卡卡的感觉给人非常不流畅的感觉。

@tangjinzhou tangjinzhou self-assigned this Nov 19, 2020
@ghost
Copy link

ghost commented Nov 20, 2020

感觉是越优化越卡,哈哈 。element-plus的菜单真香。代码优化程度不是一个级别的

@tangjinzhou
Copy link
Member

添加:forceSubMenuRender="false" 试试
@anncwb 给我个在线示例?精准定位下

@SuperHuangXu
Copy link

感觉是越优化越卡,哈哈 。element-plus的菜单真香。代码优化程度不是一个级别的

你觉得代码优化不好可以贡献代码。

@anncwb
Copy link
Contributor Author

anncwb commented Nov 20, 2020

@tangjinzhou https://github.com/anncwb/vue-vben-admin

测试这个问题有几个方式

  1. 拉取代码,安装运行。可以先尝试下现在的菜单切换。我antdv的版本固定在beta15.
  2. 版本改成rc1. 再去切换菜单。查看效果。明显变卡

按你说的 forceSubMenuRender=false 确实在rc1会稍微不卡。但是把多个菜单都打开一遍又会回到原来的卡顿状态

下面是我一些测试

  1. 在rc.1状态 ,先打开几个菜单。通过tab切换 有点卡顿的效果。在右侧设置内隐藏菜单(会销毁菜单)。再去切换tab,明显不会卡

  2. 在rc.1状态。删除大部分菜单 。只保留20个以内左右。菜单也不会卡(所以我认为在官网示例可能测试不出。因为测试用例菜单可能就十几个)

  3. 可能也是我代码问题,我也一直还在优化。但是rc.1确实有点明显。如上面说的。菜单的渲染好像会被路由主体内容改变所触发。因为在界面内操作也明显变卡

@anncwb
Copy link
Contributor Author

anncwb commented Nov 20, 2020

@tangjinzhou 在线示例可能不好还原,所以麻烦可以拉下git项目。内部菜单会多点

@tangjinzhou tangjinzhou mentioned this issue Nov 23, 2020
13 tasks
tangjinzhou added a commit that referenced this issue Nov 23, 2020
@github-actions
Copy link

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Nov 24, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
2.x for 2.x Accept You are right, we should do that enhancement outdated
Projects
None yet
Development

No branches or pull requests

5 participants