前端的全棧模式其實就是我們現在說的“大前端”概念。

老一輩的程式設計師應該都有印象，以前我們說的前端更多就是靜態頁面的佈局和頁面互動的實現，用到的技術主要就是：DIV+CSS、JavaScript、Ajax。

那時候的“前後端分離”也不是完全的分離！前端做好頁面後是要交給後端開發人員進行整合的，更多的是種“模板”思想，前端做的只是“模板”，而模板裡的資料填充還是要靠後端來處理。

而當下的“前後端分離”較之前要徹底一些！現在的前端不是傳統的前端了，也涉及以前後端的一些技術，比如我們也可以把PHP劃分到前端領域，用PHP來實現資料的渲染。

對於大型網站架構，現在一般是這樣的：

PHP/NodeJS 渲染頁面 > Vue呼叫資料 > Java API > 資料庫

這種架構模式的優點主要有以下：

實現了前後端的完全分離，前端各類終端（Web、H5、APP、TV等）的頁面風格展示方式不同，但不影響後端API的統一化；

術有專攻，便於控制；

並行開發，提升了開發效率。

要理解這兩個問題，node(加個js的話排版會有問題，所以以下簡稱node)是關鍵。那什麼是node,node可以是一個讓 JavaScript 執行在服務端的開發平臺，它讓 JavaScript 成為與PHP、Python、Perl、Ruby 等服務端語言平起平坐的指令碼語言。在2009年釋出時引起了極大的轟動。

對前端來說，node可以做兩件事，一是可以用來做前端的後端，二是僅僅作為中介軟體。前端是題目中所說的前端的全棧模式，後者僅僅是一箇中間件，後端仍由傳統的Java等後端語言實現。下面說一說這兩種模式。

先來看一個前端全棧模式的layout:

為了不讓圖片過大，我刪除了一些約定俗成或者與node無關的東西，從這個layout裡面我們可以看到後端的一些明顯特徵，如定義錯誤碼、許可權過濾、業務介面、mysql客戶端、日誌處理等。總結來說，前端的全棧模式是把前端與後端放在一個工程裡面，使用node提供server服務，處理業務邏輯和操作資料庫，這是前端全棧模式與單獨的前端開發最大區別之所在。

仍然還是放一張圖：

上圖中的這種模式是很多公司和團隊用的模式，圖中用兩種顏色區分了前後端，上面是前端，下面是後端。

為什麼這麼做？因為很多時候後端提供的資料結構並不符合前端的要求，或者是一些簡單的邏輯沒必要抑或懶得在後端做（是的，有這種情況），那前端就要對資料做分組、運算、轉換等操作，但這些處理操作如果由瀏覽器來完成的話對效能肯定是有影響的，特別是需要處理的資料很多的時候。而node做中間層引入前端專案正好可以解決這個問題，讓使用者的請求首先經過node端，然後node再向後端的Java等伺服器請求資料，待資料返回後渲染HTML模板呈現給使用者。

總結來說，使用node作為中間層之後，Java後端處理業務邏輯並提供API介面（如常用的Restfull API），不僅前後端得到了很好的分離，還解決了非同步渲染中的種種問題。