為什麼要做前後端分離？
前端後端有兩種協作方式，一種可以稱之為是伺服器端渲染，一種是叫做前後端分離。
這兩種方式的差别是什麼呢？
第一種方式是伺服器端渲染的方式，是指在伺服器端就将網頁直接生成，浏覽器這裡拿到的是一整個網頁，CSS和JS的部分是在浏覽器端執行的，而網頁的内容部分，也就是資料，是由伺服器端生成的。這叫做伺服器端渲染。至于你是用NodeJS，還是用PHP，還是Python，還是Java，還是NodeJS+Java,都不重要。這是我一直都覺得，很多概念在混淆的原因，很多人都覺得說到前後端分離，就是JS和Java的分離，隻要我用了JS，Java提供API，就是前後端分離了。是這樣麼？不是的。隻要你的Html網頁的内容是在伺服器端生成的，這就是伺服器端渲染的方式。你用Openresty+lua沒問題。隻要你的網頁是在浏覽器端，内容是通過接口從後端拿到的純資料，這就是前後端分離。
第二種方式就是，前後端分離的方式，也是剛剛說到的。浏覽器端先拿到Html，然後和後端通過Ajax接口擷取，或者是通過其他接口擷取，無所謂。是以兩種方式的差別關鍵，就在于是，Html是在哪兒生成的，浏覽器和服務端傳遞的是什麼。在前後端分離的方式，浏覽器和服務端傳遞的是資料，而在伺服器端渲染的過程中，傳遞的是Html網頁。
弄清楚這兩點的差别，再來看兩種方式的好壞。
1 .資料量：前後端分離中傳遞資料，是以傳輸量會小。伺服器端渲染，會傳輸更大的資料，而且，會有很多内容是重複的。
2 .體驗：前後端多了一個渲染資料的過程，伺服器端省去了這個過程。這也是一直被提到的首屏渲染的問題。
3 .解耦：前後端分離中，傳輸的是資料，Model，資料怎麼展示，全部交給前端來處理，後端隻負責提供資料。伺服器端渲染中，傳輸的是Html，後端傳給前端的Model，通常是通過Hidden的Input來處理，或者是直接用模闆技術生成（JSP，Velocity，freemak）等。資料和展現并未分離，在過去，這被稱之為套頁面。
4 .控制：網頁之間有各種跳轉互動，在前後端分離中，跳轉的頁面控制，全部是由前端來決定。跟後端完全沒有關系。在伺服器端渲染的方式中，大部分是由後端來決定，少部分是由前端來決定。
5. SEO：前後端分離的方式，通常的載體是SPA，是以拿到的是沒有資料的空殼子，很多搜尋引擎，不支援SPA方式的SEO. 而伺服器端渲染的方式，因為生成的是網頁，是以對SEO支援的很好。 不要小巧這個環節，這是重多前台網站放棄使用前後端分離方式的重要原因。
好了，以上5點，足以讓你對前後端分離和伺服器渲染兩種方式有一些直覺的認知了。
再舉個例子：盒馬生鮮提供兩種方式，一種是前後端分離，一種是伺服器端渲染。前後端分離是哪種方式呢？就是外賣或者是直接買生鮮，自己回家去做。伺服器端渲染是哪種方式呢？就是直接在盒馬鮮生自己加工，直接吃，或者是帶回家吃。這裡的生鮮就是資料。做出來的食物就是Html網頁。接着看在什麼樣的場景下，應該使用前後端分離，很簡單。“不需要SEO的場景下，都應該使用前後端分離”。是以在背景管理中，沒有任何理由不使用前後端分離，代指SPA。而在前台頁面中，要認真考慮，不支援SEO的代價，不止幾百萬。前後需要使用者登入的頁面，往往是不需要有SEO的，這裡也可以拆解出來。