优化:空闲之行,紧急优先

  1. requestIdleCallback:
    window.requestIdleCallback()会在浏览器空闲时期依次调用函数,这就可以让开发者在主事件循环中执行后台或低优先级的任务,而且不会对像动画和用户交互这样延迟触发而且关键的事件产生影响。函数一般会按先进先调用的顺序执行,除非函数在浏览器调用它之前就到了它的超时时间。
    调用方法:
# 返回一个无符号长整数,可以把它传入Window.cancelIdleCallback()方法,来结束回调
var handle = window.requestIdleCallback(callback[, options])

参考MDN

  1. 封装
export class IdleValue {
  constructor(init) {
    this._init = init;
    this._value;
    this._idleHandle = requestIdleCallback(() => {
      this._value = this._init();
    });
  }
  getValue() {
    if (this._value === undefined) {
      cancelIdleCallback(this._idleHandle);
      this._value = this._init();
    }
    return this._value;
  }
  // ...
}

参考

你可能感兴趣的:(优化:空闲之行,紧急优先)