Page MenuHomePhabricator

[web] Memoize `LeftLayoutAside` component
ClosedPublic

Authored by jacek on Jul 18 2022, 4:33 AM.
Tags
None
Referenced Files
Unknown Object (File)
Fri, Oct 25, 9:07 AM
Unknown Object (File)
Thu, Oct 17, 9:51 PM
Unknown Object (File)
Thu, Oct 17, 9:51 PM
Unknown Object (File)
Thu, Oct 17, 9:51 PM
Unknown Object (File)
Thu, Oct 17, 9:50 PM
Unknown Object (File)
Sun, Oct 13, 3:48 PM
Unknown Object (File)
Oct 5 2024, 8:44 PM
Unknown Object (File)
Sep 25 2024, 6:59 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
Lint
Lint Not Applicable
Unit
Tests Not Applicable