ReactJS performance tuning tips

Posted on | Edited on |
  1. Use React.PureComponent, it implement shouldComponentUpdate() by shallow compare prop and state, it is powerful with Immutable.js.
  2. Use Chrome extension and checked highlight updates in dev tool to find any unnecessary updates.
  3. Use React-virtualized for render huge list in small chunk at a time.

  4. Use Production build, for example with webpack you need following config:

    1
    2
    3
    4
    new webpack.DefinePlugin({
        'process.env.NODE_ENV': JSON.stringify('production')
    }),
    new webpack.optimize.UglifyJsPlugin()