gpt4 book ai didi

javascript - 在 React 中构建大型列表时 UI 滞后几秒钟

转载 作者:行者123 更新时间:2023-12-01 03:41:13 25 4
gpt4 key购买 nike

导航到包含大量 UI 元素列表的页面时,UI 在显示列表之前会卡住几秒钟。我猜测这是因为浏览器尝试使用 UI 元素列表重新绘制整个 DOM,这需要一些时间,从而使 UI 卡住一段时间。

我构建了这个webpackbin这说明了这种情况。单击 list 链接会将您带到包含大量简单方形 div 的列表页面。用户界面卡住了几秒钟,然后才最终显示列表。

有什么办法可以解决这个问题吗?

最佳答案

是的,一次插入 177147 个项目确实会导致 UI 滞后。您想要做的是延迟加载列表,这样当您向下滚动时,就会插入项目。

这里有两个库可以帮助您:

https://github.com/onefinestay/react-lazy-render

https://www.npmjs.com/package/react-infinite-scroll

关于javascript - 在 React 中构建大型列表时 UI 滞后几秒钟,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43864901/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com