Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
FilePond performance degrades for every file item
See original GitHub issueHey hey,
this is another enhancement request. Essentially using FilePond on an average device and uploading 15+ items immediately causes a heavy frame drop! We can either: have a property enableAnimations which would disable the animations completely; disable the animations automatically when received N+ items; or virtualize the items.
The first 2 options are self-explanatory, but regarding the virtualization we can approach it from various sides. The one that I would use is IntersectionObserver (https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API). Essentially we would wrap every item with the IntersectionObserver (of course to a single instance of IntersectionObserver to maintain the performance) and render only when its in the screen, otherwise hide it. Its often not a good approach to wrap EVERY item with an IntersectionObserver, but from my personal experience as soon as you are NOT wrapping more than 200 items on a single instance you’re good to go. Also you can recycle the IntersectionObserver by removing (un-observing) it from the item once its rendered/displayed.
On the other hand we can also hack this currently by setting the maxFiles prop to a desired pool size. But to be honest, for me the maxFiles logic is not good when maxFiles > 10. Why? Well FilePond SILENTLY omits files once it reached the maxFiles threshold. This would cause huge confusion with users which drag and drop maxFiles + (20+) files as they magically disappear and the user might not even know that they were NOT uploaded. Of course except for those users which will scroll and manually check the state of 30+ files (which is like 2% of the average internet consumer).
Best, Denis
Issue Analytics
- State:
- Created 5 years ago
- Comments:12
Top Results From Across the Web
Top Related Medium Post
Top Related StackOverflow Question
Troubleshoot Live Code
Top Related Reddit Thread
Top Related Hackernoon Post
Top Related Tweet
Top Related Dev.to Post
Top Related Hashnode Post
@rikschennink I understand. Thanks for the response and the update on grouping and queuing uploads!
@drone1 you can test it isolated on this page: https://j71ps.codesandbox.io/
It’s high if it was on a high-end laptop without CPU slowdown BUT I’m testing on an average 2014 MacBook Pro with CPU slowdown @ 6x so I’d say 1.31ms is very reasonable. Without the slowdown it takes 0.16ms to run. Again I know this is not ideal.