Skip to main content

REDMADMEDIA 網誌

回前頁
為何有Nuxtjs出現? - 當下科技

為何有Nuxtjs出現?

· · 專欄: 當下科技

要了解Nuxtjs之前,需先從Vuejs說起。Vuejs是一個專注於視圖層的 Javascript框架,這框架比起React 來得友善,你不用從新適應一套程式語言,可在你傳統的LAMP stack 中使用,只須在頁面的CDN 嵌入Vuejs 套件,就可像jQuery 般應用,若使用者喜歡,頁面亦可以Vuejs 獨立開發,脫離傳統的LAMP模式。所以,Vue跟React和Angular 相比,學習曲緩沒有這麼陡峭,較易上手,亦因此有「漸進式框桇(progressive framework)」之稱謂。

若以Vuejs獨立開發,多以建立單頁應用程式(SPA,Single Page Application)為主。在SPA架構中,使用者首次訪問網站時會下載一個HTML文件和所有的JavaScript 資源,之後的頁面切換和更新都是透過JavaScript動態完成,這樣的設計可以減少頁面重新載入的次數,進而提升使用者體驗。當然,首次下載則需較多時間,這是它的缺點。

另一個SPA缺點是,搜尋引擎爬蟲只會讀取HTML,不會執 行JavaScript,因此,可能會導致動態產生的內容無法被正確索引(indexing),影響網站在搜尋引擎上的表現。 而Nuxtjs的出現,就是要解決這SEO的問題,它建基於Vuejs的框架,預設使用通用渲染模式(Universal Rendering), 亦即結合伺服器端渲染(SSR,Server-SideRendering)和客戶端渲染(CSR, Client-SideRendering)的優點,透過在伺服器端生成完整的HTML內容(像LAMP Stack般)並回傳給瀏覽器,讓搜尋引擎爬蟲可以取得較完整的HTML內容,以改善SPA架構下SEO成效不佳的問題。

而且,因為是「通用渲染模式」,程式員可就頁面內容所需,權𧗽渲染效率和SEO 二者,決定該採用伺服器端渲染還是客戶端渲染,非常具彈性。

一言以蔽之,這框架解決 了SPA 開發中以下的問題:

1) 改善初始頁面載入時間

2) 加強搜尋引擎優化 (SEO)

3) 簡化 SSR 應用程式的開發流程

4) 提供伺服器端和客戶端渲染之間的平順過渡

0 likes

推薦文章

勸學 - DSE中文科精讀

勸學 - DSE中文科精讀

原文 君子曰︰學不可以已。青,取之於藍,而青於藍;冰,水為之,而寒於水。木直中繩,輮以為輪,其曲中規;雖有槁暴、不復挺者,輮使之然也。故木受繩則直,金就礪則利,君子博學而日參省乎己,則知明而行…

基本民生飲食生意都守不住 —— 商舖剩餘價值堪寒!

基本民生飲食生意都守不住 —— 商舖剩餘價值堪寒!

有沒有留意,近兩季傳出拖欠租金與強積金的店子,大多跟民生的「食」有關,不是連鎖式酒樓或粥舖,就是餅店;無他,只因香港近兩年街上的店舖已非常單一化,跟食無關的產品,已在網上做,剩下的就只有服務行業,食…

瓜菜食療-洋蔥(附篤爆關於「洋蔥」的網路謠傳)-Mark哥醫師

瓜菜食療-洋蔥(附篤爆關於「洋蔥」的網路謠傳)-Mark哥醫師

洋蔥 性味:辛、溫 歸經:入心、脾。 功效:殺蟲除濕,溫中消食,化肉消谷,提神健體,降血壓,消血脂。 主治:腹中冷痛,宿食不消,高血壓,高血脂,糖尿病。 說明:洋蔥,又…

留言 (0)

還沒有留言,成為第一個留言的人吧!

發表留言

您必須登入才能留言。