小白理解 單頁面應用與多頁面應用的區別

2021-10-06 09:32:12 字數 509 閱讀 2370

優點:頁面切換速度塊。

原因:比如vue 頁面之間的跳轉是通過進行跳轉,這是通過前端路由進行跳轉,實現原理為:js感知到跳轉就會清除掉當前頁面,將新的頁面渲染出來,這裡頁面切換的速度要比多頁面請求乙個http要快的多。

缺點:但是單頁面的首屏比較慢、seo比較差。

原因:因為需要同時請求html和js,兩個請求都回來首屏才會展示出來。搜尋引擎優化速度比較差,它只認html中的內容,但是單頁面都是靠js渲染出來的,所以在搜尋引擎中排名比較差。

優點:首屏時間快。

原因: 訪問乙個頁面,伺服器給我們乙個html,所以頁面就會展示出來,這個過程只經歷了乙個http的請求,所以頁面展示的速度會非常快。搜尋引擎優化排名非常好,搜尋引擎給網頁進行排名的時候需要根據內容給網頁權重來進行排名,搜尋引擎可以識別html,每個網頁都放在html中,所以seo,排名非常好。

缺點:切換速度慢。

原因:因為每次切換乙個網頁都需要傳送乙個http的請求,網路比較慢的時候,在多個頁面之間進行切換的時候就會出現卡頓的情況。

單頁面應用 與 多頁面應用

單頁面應用結構檢視如下 多頁面應用結構檢視如下 具體對比分析 單頁面應用 多頁面應用 組成乙個外殼頁面和多個頁面片段組成 多個完整頁面構成 資源 css,js 共用,只需在外殼部分載入 不共用,每個頁面都需要載入 重新整理方式 頁面區域性重新整理或更改 整頁重新整理 url格式 使用者體驗 頁面片段...

多頁面應用和單頁面應用

每次頁面跳轉,後端都會返回乙個新的html檔案。優點 首屏時間快,seo效果好 缺點 頁面切換慢 後端路由切換頁面 每次跳轉頁面都要發乙個http請求。只在首次載入時請求乙個html檔案,頁面切換的路由由前端完成,使用js動態地刪除和渲染頁面。優點 頁面切換快 由前端路由切換頁面 缺點 首屏時間稍慢...

多頁面應用 VS 單頁面應用

每一次頁面跳轉,後端都會返回乙個新的html檔案,優點 首屏時間快 只經歷了乙個http請求 seo效果好 缺點 頁面切換慢 進行頁面之間跳轉時,並不去載入html檔案,而是通過js動態地把當前的內容刪除掉,再去把新的頁面結構上的dom元素渲染出來。當頁面做跳轉時,不需要做html檔案的請求,節約了...