vue2筆記 — vue-router路由懶加載的實(shí)現(xiàn)
更新時(shí)間：2017年03月03日 15:55:47 作者：HtmlCss3
本篇文章主要介紹了vue2筆記 — vue-router路由懶加載示例，實(shí)例分析了vue-router路由懶加載的實(shí)現(xiàn),具有一定參考借鑒價(jià)值,需要的朋友可以參考下
在Web應(yīng)用程序中，系統(tǒng)的瓶頸常在于系統(tǒng)的響應(yīng)速度。如果系統(tǒng)響應(yīng)速度過慢，用戶就會(huì)出現(xiàn)埋怨情緒，系統(tǒng)的價(jià)值也因此會(huì)大打折扣。因此，提高系統(tǒng)響應(yīng)速度，是非常重要的。
懶加載(Load On Demand)是一種獨(dú)特而又強(qiáng)大的數(shù)據(jù)獲取方法,它能夠在用戶滾動(dòng)頁面的時(shí)候自動(dòng)獲取更多的數(shù)據(jù),而新得到的數(shù)據(jù)不會(huì)影響原有數(shù)據(jù)的顯示,同時(shí)最大程度上減少服務(wù)器端的資源耗用。
用vue.js寫單頁面應(yīng)用時(shí)，會(huì)出現(xiàn)打包后的JavaScript包非常大，影響頁面加載，我們可以利用路由的懶加載去優(yōu)化這個(gè)問題，當(dāng)我們用到某個(gè)路由后，才去加載對(duì)應(yīng)的組件，這樣就會(huì)更加高效，實(shí)現(xiàn)代碼如下：
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
component: resolve => require(['components/Hello.vue'], resolve)
},
{
path: '/about',
component: resolve => require(['components/About.vue'], resolve)
}
]
})
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
Vue.js是一種流行的JavaScript框架,用于構(gòu)建交互式的Web應(yīng)用程序,在Vue.js中,我們可以通過動(dòng)態(tài)地增加和刪除組件來實(shí)現(xiàn)動(dòng)態(tài)頁面的構(gòu)建和更新,本文介紹Vue?刪除和增加自定義組件實(shí)戰(zhàn)教程,感興趣的朋友一起看看吧2024-08-08
解決Vue Loading PostCSS Plugin failed:Cann
這篇文章主要介紹了解決Vue Loading PostCSS Plugin failed:Cannot find module autoprefixer問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
vue2+elementui進(jìn)行hover提示的使用
本文主要介紹了vue2+elementui進(jìn)行hover提示的使用，主要分為外部和內(nèi)部，具有一定的參考價(jià)值，感興趣的可以了解一下2021-11-11
最近工作中遇到了一些問題,通過查找相關(guān)資料終于找到了相關(guān)的解決方法,這篇文章主要給大家介紹了關(guān)于Vue不能下載xls以及文件亂碼問題解決的相關(guān)資料,需要的朋友可以參考下2022-04-04
詳解關(guān)于vue-area-linkage走過的坑
這篇文章主要介紹了詳解關(guān)于vue-area-linkage走過的坑，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-06-06
vue子組件中使用window.onresize()只執(zhí)行一次問題
這篇文章主要介紹了vue子組件中使用window.onresize()只執(zhí)行一次問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-08-08
這篇文章主要介紹了解決VantUI popup 彈窗不彈出或無蒙層的問題。具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-11-11
這篇文章主要介紹了vue如何獲取配置代理文件中的api地址值，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
vue中typescript裝飾器的使用方法超實(shí)用教程
這篇文章主要介紹了vue中使用typescript裝飾器的使用方法超實(shí)用教程,非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2019-06-06
這篇文章主要介紹了vue中環(huán)境變量的使用與配置方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-08-08