Netflix分享了其如何使用Node.js+React.js替代原來的Java + JQuery傳統架構，從而讓網站頁面載入更快，使用者體驗UX更好。

效能很重要。Netflix的會員希望一開啟瀏覽器就能立即開始觀看他們喜愛的內容，更快的啟動才能有更令人滿意的使用者使用UX。所以，Netflix網站的使用者介面工程團隊將啟動效能作為第一優先順序考慮。

這一努力最終使得啟動時間降低了70%，工作主要集中在三個主要方面：
1.伺服器和客戶端呈現
2.通用的JavaScript
3.JavaScript的有效載荷的降低

Netflix原來的網站是典型的伺服器和客戶端頁面標記(markup)語法分離的結構，這是因為後端與前端使用了不同的語言，後端伺服器使用了Java的Tomcat、Struts和Tiles，在瀏覽器客戶端，使用Javascript的JQuery加強伺服器端產生的Html標記。

這種分離導致了啟動時間的延長，每次使用者上Netflix.com，Java層會產生Html頁面的大部分內容，佔據了整個頁面生命週期的主要部分，因此，使用者需要等待Html頁面出現，在這之前無法訪問頁面的任何其他部分。

新的架構只使用很少的頁面Html標記，伺服器提供更少的資料，因此也就會花費更少的時間將資料轉為Html標記的DOM，一旦客戶端Javascript接管，它可以檢索到當前會話中剩餘的資料，然後完成剩餘的頁面渲染。

為了在客戶端和伺服器端支援相同的渲染展現，需要重新思考Netflix的渲染管道，必須拋棄之前在伺服器產生Html語法然後在客戶端增強的傳統架構，採用前後端統一的Javascript能夠靈活方便實現這一目標。

傳統架構的三大痛點導致了Node.js新架構誕生：
1不同語言之間上下文語境進行切換並不理想。
2.Html語法標記的增強導致太多伺服器端產生Html語法標記的程式碼和客戶端程式碼之間更緊密的耦合。
3.寧可使用相同API而產生的所有HTML語法標記。

當然，有許多解決方案並不需要通用的JavaScript，但是我們發現以下教訓是最重要的：當存在同一事物的兩個副本，這也很容易導致厚此薄彼。 使用通用的JavaScript意味著渲染呈現邏輯能夠簡單地傳遞到客戶端。

Node.js和React.js架構是自然適合這種風格的應用。 使用Node.js和React.js，我們可以從伺服器渲染 ，並隨後在在客戶端瀏覽器上渲染呈現其後所有的變化，這些動作都是在初始的Html標記語法和React.js元件被髮送到瀏覽器以後就可以開始。

因為前後端沒有共同的渲染呈現邏輯，只有必要的資料在啟動時需要載入，其他一切只有在後端變得可用時再進行推送，只有這樣，我們才能真正挖掘實現渲染的潛力。

另外一個好處是降低了Javascript的負荷，網路上構建豐富的互動體驗必然會轉化為大量的Javascript負荷，在新的架構中，可以顯著地降低對Html語法增強的依賴性，使用更小的只適合當前訪問者的Javascript模組替換以前一次性下載統一的大型的Javascript檔案。

即用即載入小的JS模組導致更少的Javascript檔案在前後端傳輸，提高了Javascript啟動瀏覽的時間，這條路遠遠沒有結束。

提供啟動效能之路遠遠沒有結束，未來netflix會探索Service Workers, ASM.js, Web Assembly等技術。 轉自:

http://www.jdon.com/47477