performance optimization

Based on the following facts:

  1. Parent component updates trigger all child component updates by default (shouldComponentUpdate returns true by default)
  2. The default update method of list-type components is very complicated

The key to performance optimization is:

  • Judging in the shouldComponentUpdate stage, if the attributes and status are the same as the last time, it is obvious that the UI will not change at this time, and there is no need to perform the subsequent process of generating DOM and DOM Diff, which can improve performance.
  • DOM Diff stage optimization to improve the efficiency of Diff

solution:

  • The child component executes the  shouldComponentUpdate method and decides whether to update it
  • Add the key attribute to the components in the list

http://react-china.org/t/react/11562

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=326219864&siteId=291194637