Page MenuHomePhabricator

[web] Memoize `LeftLayoutAside` component
ClosedPublic

Authored by jacek on Jul 18 2022, 4:33 AM.
Tags
None
Referenced Files
F3384212: D4551.diff
Thu, Nov 28, 8:00 PM
Unknown Object (File)
Tue, Nov 19, 4:46 PM
Unknown Object (File)
Tue, Nov 19, 4:46 PM
Unknown Object (File)
Tue, Nov 19, 4:46 PM
Unknown Object (File)
Tue, Nov 19, 4:45 PM
Unknown Object (File)
Oct 25 2024, 9:07 AM
Unknown Object (File)
Oct 17 2024, 9:51 PM
Unknown Object (File)
Oct 17 2024, 9:51 PM

Details

Summary

Wrap LeftLayoutAside in React.memo hook to avoid unnecessary re-rendering - e.g. when opening modals.

While working on Sidebars Modal and analysing performance, I noticed that LeftLayoutAside is not memoized and re-renders every time when parent component changes (e.g. while opening modals).
As it doesn't receive any props and uses only hooks to read navigation state, it doesn't need to be re-rendered each time when parent re-renders and it can improve performance a bit.

Test Plan

Run web app and made actions on modals to confirm it doesn't re-render in React Profiler after the change. Confirmed that the component works as before.

Diff Detail

Repository
rCOMM Comm
Branch
jacek/left-layout-improve
Lint
No Lint Coverage
Unit
No Test Coverage