Javascript 在客户机上执行繁重的功能和副作用

Javascript 在客户机上执行繁重的功能和副作用,javascript,reactjs,redux,middleware,Javascript,Reactjs,Redux,Middleware,我在程序中有一些繁重的功能,例如,可能需要一些时间才能完成(1s)。这些都是纯函数,但我不想用计算延迟应用程序的主要流程。在哪里称呼它更合适?我认为在mapDispatchToProps中,在选择器中(函数的输出存储在存储中),但这一切都将同步进行,,据我所知。在AC中,虽然功能是干净的,但在我看来似乎做得不对 现在我在中间件中进行计算(在客户端进行计算,但这不是副作用或什么?) 中间件中的下一步(操作)首先简单地在计算开始时设置一个标志,然后在返回承诺的MW函数内部调用,当函数完成时,它将

我在程序中有一些繁重的功能,例如,可能需要一些时间才能完成(1s)。这些都是纯函数,但我不想用计算延迟应用程序的主要流程。在哪里称呼它更合适?我认为在mapDispatchToProps中,在选择器中(函数的输出存储在存储中),但这一切都将同步进行,据我所知。在AC中,虽然功能是干净的,但在我看来似乎做得不对

  • 现在我在中间件中进行计算(在客户端进行计算,但这不是副作用什么?)
中间件中的下一步(操作)首先简单地在计算开始时设置一个标志,然后在返回承诺的MW函数内部调用,当函数完成时,它将将数据发送到存储并设置标志(计算完成)。我觉得这种方法并不完全正确。有什么想法吗

  • 如果平均函数计算时间为>1s
该函数是干净的,必须仅在客户端上计算 现在我称之为中间件中的纯函数

export default (store) => (next) => (action) => {
  const { computeSomeData, type, ...rest } = action

  if (!computeSomeData) return next(action)

  store.dispatch({
    type: type + START,
    ...rest
  })

  someAsyncFunc(computeSomeData)
    .then(
      response => store.dispatch({...})
      error => store.dispatch({...})
  )
}
  • 对吗
    • 您可以使用和来实现这一点

      您将调度一个由redux saga代码捕获的操作,然后使用webworker在新线程上计算您的内容,以便应用程序的线程正常运行。当webworker完成时,您在redux传奇中的代码将发送一个新的操作,并且react redux上的reducer将执行该操作。

      您可以使用和来实现该操作


      您将调度一个由redux saga代码捕获的操作,然后使用webworker在新线程上计算您的内容,以便应用程序的线程正常运行。当webworker完成时,您在redux传奇中的代码将发送一个带有结果的新操作,react redux上的reducer将执行。

      是的,您的方法是正确的。毫无疑问,这些副作用是存在的。在以无阻塞方式完成操作后,调用操作并使用新计算的数据异步更新状态。这就是最佳实践。关于您的MapStateTrops评论。您应该使您的状态尽可能小,并且不要保留重复的数据。因此,如果您的计算数据来自存储区中的实际数据,并且保存计算数据将创建第二个真值来源,则应将计算移动到选择器中,该选择器在MapStateTops中调用。为防止不必要的计算和滞后,应记住输出。例如,使用“重新选择”或“记忆一个”。
      希望这有帮助。快乐编码

      是的,您的方法是正确的。毫无疑问,这些副作用是存在的。在以无阻塞方式完成操作后,调用操作并使用新计算的数据异步更新状态。这就是最佳实践。关于您的MapStateTrops评论。您应该使您的状态尽可能小,并且不要保留重复的数据。因此,如果您的计算数据来自存储区中的实际数据,并且保存计算数据将创建第二个真值来源,则应将计算移动到选择器中,该选择器在MapStateTops中调用。为防止不必要的计算和滞后,应记住输出。例如,使用“重新选择”或“记忆一个”。
      希望这有帮助。快乐编码

      我的代码工作正常。你能解释一下我为什么要用这个图书馆吗?我的问题是这是否是正确的方法。我可以将这些函数粘贴到组件中并继续工作。但是如果我需要用更大的计算时间运行其他函数呢。在中间件(在客户机上工作)中使用大型异步函数的正确决策是多少?使用这些库是因为您描述的滞后。web workers将允许您在不影响主UI线程的情况下运行长时间计算,这样应用程序上就不会出现延迟,即使在进行计算时也会有响应。redux saga是应用程序redux方法产生副作用的众多方法之一,因此它将调用您的计算方法并等待@我的代码运行良好。你能解释一下我为什么要用这个图书馆吗?我的问题是这是否是正确的方法。我可以将这些函数粘贴到组件中并继续工作。但是如果我需要用更大的计算时间运行其他函数呢。在中间件(在客户机上工作)中使用大型异步函数的正确决策是多少?使用这些库是因为您描述的滞后。web workers将允许您在不影响主UI线程的情况下运行长时间计算,这样应用程序上就不会出现延迟,即使在进行计算时也会有响应。redux saga是应用程序redux方法产生副作用的众多方法之一,因此它将调用您的计算方法并等待@谢谢你的回答!但是如果我将在选择器中计算一些数据(我已经在使用reselect),我认为如果长时间执行该函数,可能会有延迟。你觉得这个怎么样?例如,如果在selector place函数中计算大约1秒,这将如何影响应用程序的主流?谢谢你的回答!但是如果我将在选择器中计算一些数据(我已经在使用reselect),我认为如果长时间执行该函数,可能会有延迟。你觉得这个怎么样?例如,如果在选择器位置函数中,将计算约1秒,