如何對 VueJs Store 中的函數進行基准測試？

Question

我的 VueJs2 存儲配置中有以下腳本，我懷疑下面的 if 語句會導致額外的負載，即使沒有觸發，但我不確定：

   if(response.status === 204) {
  addToastMessage(I18n.t('library.withdrawal.errors.already_noted'), 'is-info');
  createDiv();
  const btn = document.createElement("button");
  addBtnAttributes(btn);
  btn.addEventListener("click", function() 
  { 
    commit('changeBookLoading', true);
    fetchNextTicket(response);
    commit('changeBookLoading', false);
  });
}

一般來說，作為 JS 測試的新手，我想聽聽有關進一步進行基准測試和調試的最佳方法的建議，任何提示都表示贊賞。

全功能：

 function loadBook(commit, dispatch, method, id=null) {
  commit('changeBookLoading', true);
  dispatch(method, id)
  .then((response) => {

     if(response.status === 204) {
  addToastMessage(I18n.t('library.withdrawal.errors.already_noted'), 'is-info');
  createDiv();
  const btn = document.createElement("button");
  addBtnAttributes(btn);
  btn.addEventListener("click", function() 
  { 
    commit('changeBookLoading', true);
    fetchNextTicket(response);
    commit('changeBookLoading', false);
  });
}
    const bookId = response.data[0].localBook.id;

    if (bookId !== locationBookId()) {
      history.pushState({}, `Book ${bookId}`, `/lib/book/${bookId}`);
    }

    commit('changeCurrentBookId', ticketId);
    commit('changeBookEi', null);
    commit('changeCurrentBook', null);
  })
  .catch((err) => {
    // show some global error
  })
  .finally(() => commit('changeLibraryLoading', false));
}

Answer 1

您可以使用以下方法測量任何代碼塊的執行時間：

console.time('some measure');
......
......
console.timeEnd('some measure');

你會得到如下控制台輸出：一些測量： 0.0126953125 ms你只需要在 time 和 timeEnd 調用之間放置你的代碼。