流输入Redux操作-性能问题

时间:2019-01-28 17:06:44

标签: redux flowtype

我关注了流程文档,并使用联合(https://flow.org/en/docs/react/redux/#toc-typing-redux-actions)键入了redux操作创建者

所以我有一个文件,其中包含将所有动作汇总到一个联合中的示例,例如:

type Action =
  | { type: "FOO", foo: number }
  | { type: "BAR", bar: boolean }
  | { type: "BAZ", baz: string };

Action类型被导入到我的化简器中,并用作文档中的示例:

function reducer(state: State, action: Action): State {
  switch (action.type) {
    case "FOO": return { ...state, value: action.foo };
    case "BAR": return { ...state, value: action.bar };
    default:
      (action: empty);
      return state;
  }
}

问题:

正如我提到的,我将所有操作收集在一个文件中-目前在一个联合中收集了600个操作。我注意到最近的Flow服务器需要花很长时间才能启动(超过100秒),如果更改与reducer有关,重新检查Flow也是一个痛苦。根据流日志,包含减速器的文件被标记为“慢合并”-15到45s。

经过实验,我注意到将Action类型更改为any可以将时间从100s减少到9s。

问题:

  • 这可能与庞大的Action联合有关吗?
  • 我应该将其拆分为几个较小的类型,这些类型仅包含要导入特定的reducer的操作,否则这是解决我的问题的错误方法?

1 个答案:

答案 0 :(得分:0)

在整个应用程序中更可能使用这一操作类型。每当您对其进行更改时,Flow都需要重新检查大量文件。减轻这种情况的一种方法是确保所有联合操作都位于其自己的文件中,而这些文件不会导入其他文件。如果具有“周期”,则流量会变慢。一种类型会导入另一个时间,然后再第一次导入。例如,如果您在减速器中定义减速器动作,则会发生这种情况。这导致一个循环。而是将您的操作类型移动到自己的文件中。

此外,您可以使用flow cycle输出一个点文件,然后可以使用Gephi https://gephi.org/之类的文件将此文件可视化以检测周期。