模式对话框内的可滚动形式(50多行)比在其自己的页面上呈现的相同形式慢得多

问题描述 投票:2回答:1

我遇到了性能问题,并想知道是否有解决方法。

我有一个React.js应用程序,允许用户编辑数据库表中的行:

enter image description here

有时这个表有很多(50+)行,所以我开始使用react-virtualized List。

无论是否有反应虚拟化,当我将表单放在自己的页面上时,渲染性能(最初或滚动时)都可以:

enter image description here(滚动表格在自己的页面上)

但是如果我把相同的形式放在像https://react.semantic-ui.com/modules/modal#modal-example-modal这样的模态对话框中,它会变得非常慢

enter image description here

enter image description here(在模态内滚动形式)

我已经检查了模态背后的组件是否意外渲染,并确认它们不是。我的备份解决方案是将表单放在一个单独的页面上,但我想用它来更好地理解反应和反应 - 虚拟化性能,所以会很感激任何指针。

reactjs semantic-ui react-virtualized
1个回答
© www.soinside.com 2019 - 2024. All rights reserved.