鍍金池/ 問(wèn)答/HTML/ 在Vue中,這兩種更新數(shù)據(jù)的方式是否會(huì)導(dǎo)致性能差異?

在Vue中,這兩種更新數(shù)據(jù)的方式是否會(huì)導(dǎo)致性能差異?

問(wèn)題 1
假設(shè)我需要渲染一個(gè)顯示用戶名的組件,我通過(guò)一個(gè)一個(gè)用戶名數(shù)組來(lái)循環(huán)渲染他,假設(shè)他的量級(jí)大約是渲染50次。每當(dāng)我按下刷新按鈕的時(shí)候呢,就從后臺(tái)拿到列表進(jìn)行循環(huán)渲染。

以下的數(shù)據(jù)請(qǐng)求響應(yīng)時(shí)間假設(shè)為3秒左右

  1. 方式一 按下刷新按鈕 > 進(jìn)行初始化:讓本地的用戶名列表為空數(shù)組 > 發(fā)起并拿到結(jié)果 重新設(shè)置本地的用戶名數(shù)組
  2. 方式二 按下刷新按鈕 > 讓所有用戶名組件v-show = false > 發(fā)起并拿到結(jié)果 重新設(shè)置本地?cái)?shù)據(jù) > 讓用戶名組件v-show = true

ps:我需要他暫時(shí)性隱藏的原因是需要讓一個(gè)Loading動(dòng)畫(huà)暫時(shí)替代他。

問(wèn)題2

對(duì)于這種問(wèn)題,如果我想要來(lái)測(cè)試到底那個(gè)快,在不閱讀源碼的情況下,應(yīng)該如何快速的進(jìn)行測(cè)試?特別是在有網(wǎng)絡(luò)這個(gè)不穩(wěn)定因素的情況下

回答
編輯回答
舊言

自己用摧毀鉤子測(cè)試了一下確實(shí)是方式2快,特別是在前后兩次列表的長(zhǎng)度相同的情況下,所有組件都能得到復(fù)用。如果兩次數(shù)量不同,那么他們的差就會(huì)被摧毀,其余的都能復(fù)用

2018年4月2日 23:28