Perf: memoize AggregateKeyframeEditor

This commit is contained in:
Aria Minaei 2022-07-12 12:10:52 +02:00 committed by Aria
parent b37ccb1e4e
commit 558882ff0a

View file

@ -60,26 +60,24 @@ export type IAggregateKeyframeEditorProps = {
* is open. This would require having some kind of stable identity for each aggregate row.
* Let's defer that work until other interactive keyframe editing PRs are merged in.
*/
const AggregateKeyframeEditor: React.VFC<IAggregateKeyframeEditorProps> = (
props,
) => {
const utils = useAggregateKeyframeEditorUtils(props)
return (
<AggregateKeyframeEditorContainer
style={{
top: `${props.viewModel.nodeHeight / 2}px`,
left: `calc(${val(
props.layoutP.scaledSpace.leftPadding,
)}px + calc(var(--unitSpaceToScaledSpaceMultiplier) * ${
utils.cur.position
}px))`,
}}
>
<AggregateKeyframeDot editorProps={props} utils={utils} />
<AggregateKeyframeConnector editorProps={props} utils={utils} />
</AggregateKeyframeEditorContainer>
)
}
const AggregateKeyframeEditor: React.VFC<IAggregateKeyframeEditorProps> =
React.memo((props) => {
const utils = useAggregateKeyframeEditorUtils(props)
return (
<AggregateKeyframeEditorContainer
style={{
top: `${props.viewModel.nodeHeight / 2}px`,
left: `calc(${val(
props.layoutP.scaledSpace.leftPadding,
)}px + calc(var(--unitSpaceToScaledSpaceMultiplier) * ${
utils.cur.position
}px))`,
}}
>
<AggregateKeyframeDot editorProps={props} utils={utils} />
<AggregateKeyframeConnector editorProps={props} utils={utils} />
</AggregateKeyframeEditorContainer>
)
})
export default AggregateKeyframeEditor