dzcode-io / dzcode.io

Website & mobile app for Algerian open-source community
https://dzcode.io
MIT License
114 stars 41 forks source link

Mobile `Filter` component in `Contribute` screen is laggy #375

Closed ZibanPirate closed 1 year ago

ZibanPirate commented 2 years ago

Describe the bug When we have many contributions cards (>10), the filter component starts to lag

To Reproduce Steps to reproduce the behavior:

  1. Open dzcode mobile app
  2. Navigate to Contribute screen
  3. Open the filter component
  4. See that it lags when trying to open/close it
  5. It also lags when you try to select any filter option.

Expected behavior It should behave instant and smooth.

Environment:

Additional context

This is most because, whenever we change the filter options, we trigger a re-render of the whole Contribute screen, including all the contributions cards, you will notice that it's faster if you have fewer contribution cards.

Also, this is even slower on my low-end Android device.

omdxp commented 2 years ago

I noticed that too, since it trigger to re-render the whole screen, we should create a custom component for the filters and memoize so it will re-render only whenever the filters has been changed.