Skip to content

Commit

Permalink
Memoize VirtualizedListCellContextProvider
Browse files Browse the repository at this point in the history
Summary:
When a FlatList is nested inside another FlatList, it may be re-rendered whenever the outer FlatList renders. Apply the same optimization we already had in `VirtualizedListContextProvider` to avoid changing the context object if no values have changed.

Changelog: [General][Changed] - Optimized VirtualizedList context when used with nested lists

Reviewed By: genkikondo

Differential Revision: D35905952

fbshipit-source-id: 695253c85db2043d22e208ad94ecc7daa1455055
  • Loading branch information
javache authored and facebook-github-bot committed Apr 26, 2022
1 parent f40976c commit ceb0a54
Showing 1 changed file with 7 additions and 3 deletions.
10 changes: 7 additions & 3 deletions Libraries/Lists/VirtualizedListContext.js
Original file line number Diff line number Diff line change
Expand Up @@ -142,10 +142,14 @@ export function VirtualizedListCellContextProvider({
cellKey: string,
children: React.Node,
}): React.Node {
const context = useContext(VirtualizedListContext);
// Avoid setting a newly created context object if the values are identical.
const currContext = useContext(VirtualizedListContext);
const context = useMemo(
() => (currContext == null ? null : {...currContext, cellKey}),
[currContext, cellKey],
);
return (
<VirtualizedListContext.Provider
value={context == null ? null : {...context, cellKey}}>
<VirtualizedListContext.Provider value={context}>
{children}
</VirtualizedListContext.Provider>
);
Expand Down

0 comments on commit ceb0a54

Please sign in to comment.