-1

最近我注意到调度某个动作的时间比它应该的要长，所以我去添加一些计时器。

这是操作代码：

// ...
mutations: {
    setPrimary(state, data) {
        state.resources.primary = data
    }
},
// ...
actions: {
    async load({ commit }) {
        const start = performance.now()
        // ...
        const apiResult = await apiClient.get("/")
        const startCommit = performance.now()
        commit("setPrimary", apiResult)
        console.log(`commit finished in ${performance.now() - startCommit} ms`)
        console.log(`action finished in ${performance.now() - start} ms`)
    }
}

以及调度动作的代码：

const start = performance.now()
await store.dispatch("load")
console.log(`dispatch finished in ${performance.now() - start} ms`)

现在预期的输出将是时间非常接近，但情况恰恰相反：

action finished in 820
dispatch finished in 1365 ms

这对我来说很令人困惑，因为调用dispatch不应该增加如此巨大的开销。到目前为止，我不知道它可能来自哪里。

编辑：

事实证明，这是由commit通话引起的。没有这个，延迟就会消失。像这样对提交进行计时表明执行只需要 1 毫秒，这意味着这在某种程度上具有我不知道的副作用。

4

1 回答 1

-1

开销来自这样一个事实，即您的操作是一个“异步”函数，这意味着当“解释器”执行它时，它将通过它到“浏览器 API”来处理它的执行，而不是直接在“堆栈”中执行它，并等待其结果，然后将其返回到“队列”，“事件循环”将等待堆栈为空并将其与结果一起返回堆栈以继续执行

于 2021-07-21T18:05:29.583 回答