前端的第一次新生：Ajax

- 起步於微軟的outlook的XMLHTTP元件。

- 後來其他瀏覽器廠商一起實現了XMLHttpRequest這個功能。

- W3C在2006年起草了XMLHttpRequest規範。

- 實現了局部重新整理和非同步請求。推動了web技術發展。

- ajax之前，js引擎只能穩定的執行幾十行程式碼。2008年google推出了V8引擎，可以執行萬行程式碼。

前端的第二次新生：node.js

- 2009年問世，只支援mac和linux

- node.js非同步操作的核心是事件驅動event loop

- 2011年，開始支援windows。

- node.js之前，js只能在瀏覽器這個宿主的範圍內活動。

- node.js讓js可以離開瀏覽器在伺服器端開發。

- node.js豐富了js的生態。比如打包工具，webpack。

- node.js是一個集成了v8引擎，事件驅動，底層I/Oapi，並且可以使用js開發伺服器端應用的環境。

- 阿里巴巴，美團，領英，IBM都有使用node.js寫的服務端。

- 暫時威脅不到傳統服務端語言。

- 它的事件驅動，I/O機制，容易學習，容易部署，前端語言共通性，讓它成為微服務，實時應用，前端工程化的最佳技術之一。

同構js

- 同構是數學術語，是數學物件的屬性之間的對映。數學研究同構，是為了把數學知識用到更多地方。

- js研究同構，是為了把js用到更多開發領域。主要說的就是，可以在瀏覽器也可以在伺服器端。

傳統網站的渲染過程

- 瀏覽器傳送請求，伺服器生成html檔案傳送給瀏覽器，瀏覽器渲染成頁面。

- 優點：節省客戶端資源，有利於SEO

- 缺點：消耗伺服器計算資源，因為每個請求都要路由匹配，資料庫查詢，生成html文件，傳送文件。

SPA

- 將路由工作交給客戶端，伺服器只提供json資料

- 客戶端只有一個html檔案，通過切換路由和資料，改變頁面

- 優點：減輕伺服器壓力。比起html文件，json資料小的多，加速網路請求。頁面由路由控制更加靈活快速。可以離線使用。

- 缺點：首屏滿，出現白屏，因為要等js載入完後，才能渲染後續的html文件。客戶端和伺服器端語言不通，會出現資料格式不一致，路由邏輯衝突，維護難度大。不利於SEO（國外的V8引擎已經根據spa做了優化）。

- 同構js的spa，對seo和維護性和效能方面更加友好。