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