-
Notifications
You must be signed in to change notification settings - Fork 4
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Consider performance and memoization/pure components #61
Comments
While working on PR #58, I'm going to skip out on optimizations and |
https://material-ui.com/components/lists/#virtualized-list
|
|
I haven't taken a look at Reader yet because I'm hoping to rewrite it soon. Revisit it in the future. |
Doing more research into react-window and react-virtualized. To make the chapter list fill up only the rest of viewport height, I think I'm going to need to wrap all the dom elements on the page with a flex box style. Then the list will have to flex grow to fill. |
PR #74 closes this. However, the virtualized list doesn't fully solve the chapter list issue. Each |
* Update filters to use style hooks and memo * Refactoring filters WIP * More filters updates * Mostly finish optimizations * Extract a DynamicFilter component * Add some comments * Suppress a warning * install react-window * WIP virtualized chapter list * WIP visual updates to virtualized chapter list * Fix naming typo * Implement virtualized chapter list. Not perfect but it works * Don't render chapters if the list is empty
Shit's been slow recently. Also if I'm moving everything into selectors, using redux hooks, and removing the top down data passing, it's a good opportunity to look at performance.
There's no consensus if you should just wrap all your components in
React.memo
or not.facebook/react#14463
https://twitter.com/dan_abramov/status/1083897065263034368?lang=en
https://twitter.com/tesseralis/status/1083899703262011392
Note: Redux hooks docs recommends using
useCallback
when passingdispatch
to a (memoized) child component.https://react-redux.js.org/next/api/hooks#examples
Video tutorial for performance optimization
https://www.youtube.com/watch?v=iTrCNz1gRt0
The text was updated successfully, but these errors were encountered: