我的react event pooling伪示例有意义吗?

问题描述

TLDR

我可以检查一下React中关于event pooling逻辑的实现吗?
我想了解event pooling的原理:)

问题

当我深入研究文档时,会看到event pooling
因此,我对event pooling是什么感到很好奇,并对此进行了研究。

现在我意识到了thread pooling。因此它的工作方式与此类似。所以我做了一些伪event pooling逻辑。
我想知道这确实有意义吗?

任何知道event pooling实现在react包中的人。
请给我留言

伪事件池

EventPool伪实现

class EventPool {
  private static instance: EventPool;
  private taskQueue: Event[] = [];
  private constructor() {
    this.taskQueue = [];
  }

  public static shared() {
    if (!EventPool.instance) {
      EventPool.instance = new EventPool();
    }
    return EventPool.instance;
  }

  enqueue = (event: Event) => {
    this.taskQueue = this.taskQueue.concat(event);
  };

  dequeue = (currentTarget: any) => {
    this.taskQueue = this.taskQueue.filter(
      (event: Event) => event.currentTarget === currentTarget
    );
  };

  clear() {
    // This function called before or after render 
    // (Commit -> Render -> EventPool.shared().clear()) or (Commit -> EventPool.shared().clear() -> Render) 
    this.taskQueue = this.taskQueue.filter((event) => event.isDone === true);
  }
}

关于persist

的事件伪实现
class Event {
  persist = () => {
    // This is executed before EventPool.shared.clear
    EventPool.shared().dequeue(this);
  };
}

参考

  1. What is event pooling in react? - StackOverflow
  2. Synthetic Event - React Document
  3. What's the meaning of Event Pooling?
  4. 진보된 쓰레드 풀링 기법 구현 - Korean

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)