为什么反应开发工具 Profiler 不显示组件道具？

Question

I start to learn optimization of React. And see some learning resources, and on them, I can see component props in the Profiler. But in my Profiler, I don't see any props. Why?

And how can I see a current render component props in Profiler?

A make screenshots to show this:

Answer 1

The Legacy DevTools extension added a significant performance overhead and would be become unusable in large apps. The new DevTools improved by minimizing communication between the front end(the extension you see: Component, Profiler) and back end, which render component information only when needed.

The Props changed in the Profiler is still there, however it's not as detailed. It lacks displaying names of custom Hooks . It does show prop names but only the ones that changed and doesn't show their values.

The Changelog unfortunately doesn't explicitly list that it dropped support to display prop values and should've been more clear on that.