在依靠客戶端渲染時，當使用者開啟頁面時，多數情況下是這樣的（不考慮快取）: 向靜態資源伺服器獲取html/css => 向靜態資源伺服器獲取js => 向api伺服器獲取資料 => 開始渲染內容。而在依靠服務端渲染時，傳送http請求後，服務端計算出使用者需要的資料，然後返回帶有內容的html。因此，一般情況下，對於首次開啟的頁面，服務端渲染的速度是優於客戶端渲染的。
服務端渲染的另乙個用處就是seo，這個是顯而易見的，檢視頁面源**即可理解。
所以，服務端渲染主要就是為了兩部分：首屏效能、seo。
然而，相對於客戶端渲染，服務端渲染更為複雜，對開發人員技術要求度更高。同時，由於需要在服務端進行計算，服務端渲染也會加大伺服器壓力，雖然服務端肯定也會做快取。
為了最大限度結合服務端渲染與客戶端渲染的優勢，引入了同構的概念。react元件能夠同時在客戶端與服務端渲染的方式，稱之為同構。在具體應用中，首次訪問會採用服務端渲染，後續的渲染由客戶端負責。
如上所述，構建react同構應用並不簡單，對技術要求更高。一直以來，也沒有乙個方便的react同構框架，直到nextjs的出現。nextjs可以方便的用來構建react同構應用，大大降低了構建同構應用的門檻。
react揚帆起航之路由配置與元件分割
react router v4 發生了巨大改變，由靜態路由開始轉向動態路由，從此，就像使用普通元件一樣來宣告路由。其實，路由從此就是乙個普通元件。路由的按需載入的實質是 分割,react router官網有個 拆分的示例，是基於bundle loader實現的.現在官網的 已經改為基於react l...
React總結之基礎 一
中文官網 英文官網 元件化開發 高內聚,低耦合 一次學習,隨處編寫 通過react實現前端效果 en root 複製 複製 複製 複製 複製 jsx中樣式類必須使用classname屬性,不可以使用class屬性複製 let element jsx表示式 複製 let foo function 複製...
react課堂筆記一之react介紹與環境搭建
react的介紹 react來自於facebook公司的開源專案 react 可以開發單頁面應用 spa 單頁面應用 react 元件化模組化 開發模式 react通過對dom的模擬 虛擬dom 最大限度地減少與dom的互動 資料繫結 react靈活 react可以與已知的庫或框架很好地配合。rea...