Skip to content

Conversation

@mnajdova
Copy link
Member

@mnajdova mnajdova commented Oct 29, 2025

This PR removes unnecessary usages of useMemo over props that are passes in the useRenderElement hook.

Example usage:

 const props = React.useMemo(() => ({ role: 'gridcell' }), []);

 const element = useRenderElement('div', componentProps, {
    ref: [forwardedRef, dropTargetRef, listItemRef],
    props: [props, elementProps],
  });

The useRenderElement hook will more or less conver the call to

<div {...mergeProps(componentProps, props, elementProps)} ref={mergedRefs} />

so there is no need for memoization. On the opposite side, memoizing would just add more overhead. The transformation should also improve readability as a bonus.

@mnajdova mnajdova added type: enhancement It’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature. scope: scheduler Changes related to the scheduler. labels Oct 29, 2025
@mui-bot
Copy link

mui-bot commented Oct 29, 2025

Deploy preview: https://deploy-preview-20133--material-ui-x.netlify.app/

Bundle size report

Bundle Parsed size Gzip size
@mui/x-data-grid 0B(0.00%) 0B(0.00%)
@mui/x-data-grid-pro 0B(0.00%) 0B(0.00%)
@mui/x-data-grid-premium 0B(0.00%) 0B(0.00%)
@mui/x-charts 0B(0.00%) 0B(0.00%)
@mui/x-charts-pro 0B(0.00%) 0B(0.00%)
@mui/x-charts-premium 0B(0.00%) 0B(0.00%)
@mui/x-date-pickers 0B(0.00%) 0B(0.00%)
@mui/x-date-pickers-pro 0B(0.00%) 0B(0.00%)
@mui/x-tree-view 0B(0.00%) 0B(0.00%)
@mui/x-tree-view-pro 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against f9b5cbb

@mnajdova mnajdova marked this pull request as ready for review October 29, 2025 12:59
const dropTargetRef = useDayCellDropTarget({ value, addPropertiesToDroppedEvent });

const props = React.useMemo(() => ({ role: 'gridcell' }), []);
const props = { role: 'gridcell' };
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I saw components on Base UI (e.g PreviewCardBackdrop) where we just inline the props object inside useRenderElement() instead of creating a props variable before.

No strong preference here 👍

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I was wondering the same, I wasn't sure if it helps with readability. If the props object grows I would prefer to have it in a separate object to not pollute the useRenderElement call. But in these cases it's probably the same. Up to what you prefer, as you will be reading this code more often :) cc @mui/explore

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I will leave this for future refactor, for now, let's just remove the unneeded useMemos.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

scope: scheduler Changes related to the scheduler. type: enhancement It’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants