多頁面應(yīng)用:每次頁面跳轉(zhuǎn),后臺(tái)都會(huì)返回一個(gè)新的HTML文檔,就是多頁面應(yīng)用。
在以往傳統(tǒng)開發(fā)的應(yīng)用(網(wǎng)站)大多都是多頁面應(yīng)用,路由由后端來寫。
優(yōu)勢與劣勢:
首屏?xí)r間快: 訪問頁面,服務(wù)器只需要返回一個(gè)HTML文件,這個(gè)過程就經(jīng)歷了一個(gè)HTTP請(qǐng)求,請(qǐng)求響應(yīng)回來,頁面就能被展示出來。
SEO(搜索引擎排名)效果好: 搜索引擎能識(shí)別HTML的內(nèi)容,根據(jù)內(nèi)容進(jìn)行排名。
頁面切換慢:每一次切換頁面都需要發(fā)起一個(gè)HTTP請(qǐng)求,整個(gè)網(wǎng)頁要全部刷新, 假設(shè)網(wǎng)絡(luò)較慢就會(huì)出現(xiàn)卡頓情況。
單頁應(yīng)用:用vue寫的項(xiàng)目是單頁應(yīng)用,刷新頁面會(huì)請(qǐng)求一個(gè)HTML文件,切換頁面的時(shí)候,并不會(huì)發(fā)起新的請(qǐng)求一個(gè)HTML文件,只是頁面 局部 內(nèi)容發(fā)生了變化
vue.js原理:JS感知URL變化,當(dāng)URL發(fā)生變化后,使用JS動(dòng)態(tài)把當(dāng)前的局部頁面內(nèi)容清除掉,再把下一個(gè)頁面的內(nèi)容掛載到頁面上。此時(shí)的路由就不是后端來做了,而是前端來做,判斷頁面到底顯示哪一個(gè)組件,再把以前的組件清除掉使用新的組件。就不會(huì)每一次跳轉(zhuǎn)都請(qǐng)求HTML文件。
優(yōu)勢與劣勢:
首屏?xí)r間慢: 請(qǐng)求HTML還有JS的請(qǐng)求, 以及VUE的渲染過程
頁面切換快: 頁面跳轉(zhuǎn)不需要去做HTML文件的請(qǐng)求,節(jié)約HTTP請(qǐng)求發(fā)送的時(shí)延。
SEO差: 搜索引擎只認(rèn)識(shí)HTML內(nèi)容不認(rèn)識(shí)JS內(nèi)容。單頁應(yīng)用的渲染都是靠JavaScript渲染出來的。搜索引擎不好識(shí)別排名。