# Profiler API

Profiler 测量渲染一个 React 应用多久渲染一次以及渲染一次的“代价”。 它的目的是识别出应用中渲染较慢的部分,或是可以使用 类似 memoization 优化 的部分,并从相关优化中获益。

WARNING

注意:

Profiling 增加了额外的开支,所以它在生产构建中会被禁用。

为了将 profiling 功能加入生产环境中,React 提供了使 profiling 可用的特殊的生产构建环境。 从 fb.me/react-profiling了解更多关于如何使用这个构建环境的信息。

# 用法

Profiler 能添加在 React 树中的任何地方来测量树中这部分渲染所带来的开销。 它需要两个 prop :一个是 id (string),一个是当组件树中的组件“提交”更新的时候被React调用的回调函数 onRender (function)。

例如,为了分析 Navigation 组件和它的子代:

render(
  <App>

    <Profiler id="Navigation" onRender={callback}>
      <Navigation {...props} />
    </Profiler>
    <Main {...props} />
  </App>
);
+

关注公众号,获取验证码 !

验证码:
Last Updated: 5/13/2023, 8:55:38 PM