React Profiler - proper names of memo'd components

user_8467909 0
Viewed 618

I'm using the React DevTools chrome extension to profile my component's rerenders.

However, components that have an anonymous function inside of memo show up just as anynymous inside the render graph.

Therefore, I've got to write this:

export const Number = memo(function Number(props) {
   return <div>something</div>
});

...instead of this:

export const Number = memo(props => {
   return <div>something</div>
});

Is there any way to specify component name just once?

reactjs
1 Answers

I'm afraid you will need to mention the component name twice for React 16.x, i.e you need to follow this pattern

const Number = (props => {
   return <div>something</div>
});

export default memo(Number)
user_18014030
Related