PureComponent和FunctionComponent区

pureComponent

pureComponent继承Component， 和Component唯一的区别就是加了个属性

pureComponentPrototype.isPureReactComponent = true;

这个属性就表示是PureReactComponent
那么这个标识的意义是什么呢？

function checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext) {
  var instance = workInProgress.stateNode;
  if (typeof instance.shouldComponentUpdate === 'function') {
    startPhaseTimer(workInProgress, 'shouldComponentUpdate');
    var shouldUpdate = instance.shouldComponentUpdate(newProps, newState, nextContext);
    stopPhaseTimer();

    {
      !(shouldUpdate !== undefined) ? warningWithoutStack$1(false, '%s.shouldComponentUpdate(): Returned undefined instead of a ' + 'boolean value. Make sure to return true or false.', getComponentName(ctor) || 'Component') : void 0;
    }

    return shouldUpdate;
  }

  // 重点看这里
  // PureComponent.prototype.isPureReactComponent === true
  // PureComponent 只会对 props 和 state 进行浅比较，对对象只做引用比对
  if (ctor.prototype && ctor.prototype.isPureReactComponent) {
    return !shallowEqual(oldProps, newProps) || !shallowEqual(oldState, newState);
  }

  return true;
}

通过这段代码发现首先判断是否有使用shouldComponentUpdate这个生命周期的方法，如果没有接着会来判断
isPureReactComponent这个参数是否为true，然后只会对 props 和 state 进行浅比较，对象只做引用比对这就是PureComponent。

FunctionComponent

Function在加入hook之后和React.memo() 之后有改动，后面再完善。