Skip to content
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

Optimize Thought and Toolbar components #499

Merged
merged 2 commits into from
Apr 3, 2020

Conversation

anmolarora1
Copy link
Contributor

@anmolarora1 anmolarora1 commented Apr 2, 2020

Addresses #484

It was observed that on every cursor move (up and down) the toolbar was gratuitously re-rendered, which caused performance overheads. After moving the cursor-dependent logic to mapStateToProps, the rendering time was reduced by ~20% (for revisited thoughts)
All the thoughts were re-rendered because of similar computations placed inside Thought.js. Since the connect function implicitly wraps components inside a 'memo', the values that were previously calculated in the component could be pre-computed and passed down as props, resulting in another significant reduction in rendering time(~30%)

On average, the rerender time has been reduced to ~50% (reports attached)
profiling_data.zip

If the logic is moved to selectors it'd result in better readability, separation of concerns, and possibly, further optimization(if we use reselect/custom memoizing functions).

@raineorshine raineorshine changed the title 484 Optimize Thought and Toolbar components Apr 2, 2020
@raineorshine
Copy link
Contributor

Fantastic work. Thanks so much!

@raineorshine raineorshine merged commit 8b4e903 into cybersemics:dev Apr 3, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants