react-native
react-native copied to clipboard
facebook
VirtualizedList - Please keep disableVirtualization (do not deprecate)
FlatList/VirtualizedList is great. However, it is still quite bugged when using complex components or nested lists. I have a case with up to 3 nested FlatList elements, and things start to become really messy. For example, visible components will randomly unmount and mount on some state changes (for some reason that's beyond me, e.g., when implementing some collapse/expand logic). I don't really blame the implementation, but really the design of having such a monster list which is also interactive/editable.
For this reason, and after hours of testing, disableVirtualization was the holy grail. Using this flag would immediately remove all flickering, white spaces, random unmounts, and so on. I know this defeats the purpose of virtualization, but the list is still very usable with disableVirtualization=true . The fact that the list still lazy loads is very useful, I would otherwise need to implement lazy loading myself.
React Native version:
System: OS: macOS 10.14.5 CPU: (4) x64 Intel(R) Core(TM) i5-6267U CPU @ 2.90GHz Memory: 678.54 MB / 8.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 10.15.3 - /usr/local/bin/node npm: 6.9.0 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman SDKs: iOS SDK: Platforms: iOS 12.4, macOS 10.14, tvOS 12.4, watchOS 5.3 Android SDK: API Levels: 28 Build Tools: 28.0.3 IDEs: Android Studio: 3.4 AI-183.6156.11.34.5522156 Xcode: 10.3/10G8 - /usr/bin/xcodebuild npmPackages: react: 16.9.0 => 16.9.0 react-native: 0.60.5 => 0.60.5 npmGlobalPackages: create-react-native-app: 2.0.2 react-native-cli: 2.0.1
Steps To Reproduce
FlatList is bogus with complex structures/use cases and disableVirtualization provides a good work around. Please consider keeping this variable as part of the API, or provide some way to disable component unmounting. Not even an obscenely large windowSize helps.
Agree!
When disableVirtualizationis true, it significantly reduces the number of views rendered in initial mount, from 1500 to 600 views according to Perf Monitor. The same result can be achieved with windowSize prop, but it introduces issues when fast scrolling.
In addition, the number of re-renders of items in FlatList also drops in more than half.
It also helps to provide a workaround for FlatList's weird behavior with inverted prop on web.
https://github.com/necolas/react-native-web/issues/1254
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
![stale[bot] avatar](https://avatars.githubusercontent.com/in/1724?v=4 "Published by a pub.dev verified publisher"){kind=small}
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
Any news? Still a concern
El dom., 15 de marzo de 2020 11:47, stale[bot] [email protected] escribió:
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/facebook/react-native/issues/26237#issuecomment-599219848, or unsubscribe https://github.com/notifications/unsubscribe-auth/ALU263GXNIAAVVRVOVHJQADRHTS6JANCNFSM4IRQBH7A .
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
Still an issue
El sáb., 13 de junio de 2020 12:33, stale[bot] [email protected] escribió:
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/facebook/react-native/issues/26237#issuecomment-643639135, or unsubscribe https://github.com/notifications/unsubscribe-auth/ALU263H2VGSMNSPRMLIMWC3RWOL4PANCNFSM4IRQBH7A .
Property still valid on RN 0.63.x. Any thoughts about keeping this and removing the deprecated label? This can be very convenient sometimes.
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
Still an issue.
El vie., 25 de diciembre de 2020 20:16, stale[bot] [email protected] escribió:
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/facebook/react-native/issues/26237#issuecomment-751298825, or unsubscribe https://github.com/notifications/unsubscribe-auth/ALU263C2UJ25MTPFDC7KVPLSWUMOPANCNFSM4IRQBH7A .
+1 sticky headers flickers a lot and with disableVirtualization true doesn't happen no more
Please keep this, it helps with a lot of libraries based on flatlist
