1. 程式人生 > >關於前後端分離與模板引擎

關於前後端分離與模板引擎

隨著不同終端(Pad/Mobile/PC)的興起,對開發人員的要求越來越高,純瀏覽器端的響應式已經不能滿足使用者體驗的高要求,往往需要針對不同的終端開發定製的版本,為了提升開發效率,前後端分離的需要越來越被重視,後端負責業務/資料介面,前端負責展現、互動邏輯,同一份資料介面,可用於多個終端。

傳統的前後端:

  後端是跟資料庫跟伺服器打交道的,前端是跟瀏覽器打交道的。但似乎他們的職責在以前甚至於現在都並不明確,雖然前端是跟瀏覽器打交道,但是最終瀏覽器拿到的頁面是伺服器通過模板生成的一個臨時靜態頁面而已。所以,實際上後端也摻和進來了,因為他要處理模板。當然,一般傳統上的開發協作模式有兩種:

  • 一種是前端先寫一個靜態頁面,寫好後,讓後端去套模板。靜態頁面可以本地開發,也無需考慮業務邏輯只需要實現View即可。不足是還需要後端套模板,這些前端程式碼後端需要瀏覽一遍,以免出錯。

  • 另一種協作模式是,前端直接去寫模板,這樣做的問題在於,前端編寫過程中很依賴與後端環境,如果當後端沒寫完的情況下,前端幾乎沒法幹活。

在做前後端分離時,第一個關注到的問題就是 渲染,也就是 View 這個層面的工作,模板引擎、前後端分離、單頁模式,它們本應是三個完全分離的概念,但確實有很多現代 Web 專案同時使用了這些技術,於是它們的概念就經常被混淆。雖然它們各自並不閃耀,但當它們一起使用時確實可以成為現代 Web 中一種優秀的實踐。

模板引擎

  模板引擎是相當古老的東西了,現在能看到的很多後端程式語言其實都是基於模板引擎的。但這種語言級的模板引擎其實很難讓開發者滿意。以前寫 ASP 的時候覺得用程式把資料庫查詢出來的資料填入頁面中是一件很痛苦的事情。不是寫出一堆凌亂的標籤就是程式裡做一堆字串拼接。如果再考慮上內容的安全性,要做各種過濾和轉義,簡直會讓人奔潰。

前後端分離

  前後端分離的故事得從 Ajax 說起。在 Ajax 流行起來後,大家都開始了「無重新整理」之旅。當時大部分網站都是以連結形式跳轉的時候,自己使用「無重新整理翻頁」覺得已經很先進了。後來無重新整理翻頁也漸漸開始爛大街,百度搜一下可以搜出一坨東西,於是就開始考慮全頁面的無重新整理操作。漸漸地「Web 介面」這種東西出現,但是此時的「介面」其實主要還是直接輸出 HTML,並沒有考慮結構化之類的東西

單頁模式

  單頁模式是前後端分離的一種應用。而單頁應用最主要的特點就是區域性重新整理,這通過前端控制路由呼叫AJAX,後臺提供介面便可以實現,而且這樣的方式使用者體驗更加友好,網頁載入更加快速,開發和維護成本也降低了不少,效率明顯提升。 前後端分離的實現對技術人員尤其是前端人員的要求會上升一個層次,前端的工作不只是切頁面寫模板或是處理一些簡單的js邏輯,前端需要處理伺服器返回的各種資料格式,還需要掌握一系列的資料處理邏輯、MVC思想和各種主流框架。 優勢與意義 1、徹底解放前端   前端不再需要向後臺提供模板或是後臺在前端html中嵌入後臺程式碼 2、提高工作效率,分工更加明確   前後端分離的工作流程可以使前端只關注前端的事,後臺只關心後臺的活,兩者開發可以同時進行,在後臺還沒有時間提供介面的時候,前端可以先將資料寫死或者呼叫本地的json檔案即可,頁面的增加和路由的修改也不必再去麻煩後臺,開發更加靈活。
3、區域性效能提升   通過前端路由的配置,我們可以實現頁面的按需載入,無需一開始載入首頁便載入網站的所有的資源,伺服器也不再需要解析前端頁面,在頁面互動及使用者體驗上有所提升。 4.降低維護成本   通過目前主流的前端MVC框架,我們可以非常快速的定位及發現問題的所在,客戶端的問題不再需要後臺人員參與及除錯,程式碼重構及可維護性增強。