The images take some time before being displayed after a scroll event

tommoor / emojione-picker

A react emoji picker for use with emojione

http://tommoor.github.io/emojione-picker

MIT License

261 stars 61 forks source link

The images take some time before being displayed after a scroll event #64

Open tleunen opened 7 years ago

tleunen commented 7 years ago

The user experience using the component is currently not great. If I scroll a bit too fast (but an acceptable speed for a user), we'll see that the images are not loaded.

kapture 2017-04-11 at 21 04 17

tommoor commented 7 years ago

Hmm, I'm not sure what's happening here - although I can see white space if scrolling very fast it isn't this bad in my experience.

There's definitely a trade off to be made between performance and UX, but I think we could probably double the overscanRowCount from 10 to 20 or so to make this better…

https://github.com/bvaughn/react-virtualized/blob/master/docs/List.md#prop-types

valentinvichnal commented 7 years ago

@tommoor awesome project! I believe this is happening because the use of cdn.jsdelivr.net and each emoji image requested separately.

As this project already React, could we use instead of the main emojione repo something like: https://github.com/pladaria/react-emojione Which just renders the pre downloaded images.