在mpvue小程序開發中，遇到一個問題，當點擊tab進行頁面跳轉時，存在明顯的延遲對象。
如下圖所示：
個人猜測產生問題可能的原因：
-
類似於移動端開發300毫秒點擊延遲。
那么如果是這種原因的話，那么，下面這種情況又該怎么解釋呢？
從上面的圖中可以看出，這里延遲並不嚴重。所以對於300ms點擊延遲的原因，先存有疑點。 -
網絡請求引起的延遲。
對於這種情況，上面的情況似乎都解釋的清楚。
導航tab標簽的代碼如下：
<div class="tab">
<a href="/pages/index/main" class="tab-item" hover-class="router-link-active">
<span class="tab-link">推薦</span>
</a>
<a href="/pages/singer/main" class="tab-item" hover-class="router-link-active">
<span class="tab-link">歌手</span>
</a>
<a href="/pages/charts/main" class="tab-item" hover-class="router-link-active">
<span class="tab-link">排行</span>
</a>
<a href="/pages/search/main" class="tab-item" hover-class="router-link-active">
<span class="tab-link">搜索</span>
</a>
</div>
上面的<a>標簽會被編譯為小程序中的<navigator>。如下圖所示：
返回按鈕的代碼如下
<div class="back" @tap="back">
<i class="icon-back"></i>
</div>
back () {
wx.navigateBack({
url: '/pages/singer/main'
})
}
當我們點擊tab進行切換時，會發出網絡請求，存在延遲。當wx.navigateBack()調用時，並不會發出網絡請求，而是直接使用之前的緩存。貌似可以解釋上面的問題,其實也還存在疑點。
***********************************************現在，我們假設問題就是由網絡延遲引起的。那我們細想一下，如果不存在300ms點擊延遲的話，那么點擊之后，頁面應該立馬跳轉，然后在新頁面等待請求結果返回然后渲染。也就是說，當點擊tab應當立即進行頁面跳轉，然后看到一片空白，等到請求結果返回，頁面才渲染，而不是前面圖上的在前一個頁面滯留，等到新頁面請求結果回來才跳轉。
小弟愚笨，希望路過的大佬能夠幫幫忙...