1. 程式人生 > >前端路由和後端路由(精華篇)

前端路由和後端路由(精華篇)

1.什麼是路由

  簡單的說,路由是根據不同的 url 地址展示不同的內容或頁面;

2、什麼是前端路由?

  前端路由就是把不同路由對應不同的內容或頁面的任務交給前端來做,之前是通過服務端根據 url 的不同返回不同的頁面實現的;

3、什麼是後端路由?

  (參考連結http://www.cnblogs.com/yuqing6/p/6731980.html)

  通過使用者請求的url導航到具體的html頁面;每跳轉到不同的URL,都是重新訪問服務端,然後服務端返回頁面,頁面也可以是服務端獲取資料,然後和模板組合,返回HTML,也可以是直接返回模板HTML,然後由前端js再去請求資料,使用前端模板和資料進行組合,生成想要的HTML。

4、前端路由的兩種實現原理

  (參考連結https://segmentfault.com/a/1190000007238999)

  ①、History API

  重點說其中的兩個新增的API history.pushState 和 history.replaceState;

  ②、hash

  根據監聽雜湊變化觸發的事件 —— hashchange 事件;

5、前端路由優缺點

  優點:

    1.從效能和使用者體驗的層面來比較的話,後端路由每次訪問一個新頁面的時候都要向伺服器傳送請求,然後伺服器再響應請求,這個過程肯定會有延遲。而前端路由在訪問一個新頁面的時候僅僅是變換了一下路徑而已,沒有了網路延遲,對於使用者體驗來說會有相當大的提升。
    2.在某些場合中,用ajax請求,可以讓頁面無重新整理,頁面變了但Url沒有變化,使用者就不能複製到想要的地址,用前端路由做單頁面網頁就很好的解決了這個問題。
  缺點:

    使用瀏覽器的前進,後退鍵的時候會重新發送請求,沒有合理地利用快取。

6、前端路由在很多開源的js類庫框架中都得到支援,如angularJS,Backbone,Reactjs等等。

  (參考連結http://web.jobbole.com/84644/

  ①、AngularJS

    Angular 是流行的企業級框架,許多開發人員都在使用它來構建和維護複雜的 web 應用程式。Angular 的人氣非常高,包括 Domino’s Pizza, Ryanair, iTunes Connect, PayPal Checkout, 谷歌等企業都在使用它。Angular 是一個由谷歌支援的開源框架。Angular 自稱是 HTML 的一個擴充套件,用來構建複雜的 web 應用程式。

    Angular 是一個 MVC 型別的框架。它提供了模型和檢視之間的雙向資料繫結。該資料繫結允許每當資料改變時,兩邊自動更新。  它使你能夠構建可複用的檢視元件。它提供了一個服務框架,使得後端-前端服務通訊更容易。最後,它只是普通的 JavaScript。

  ②、React

    React 自稱是一個用於構建使用者介面的 JavaScript 庫。React 主要是 MVC 中的 V。它的重點完全在 MVC 的 V 部分,忽視應用程式架構的其餘部分。它提供了一個元件層,使得建立 UI 元素,組合元素變得更容易。它使用虛擬 DOM,因此優化了渲染,且允許從 node.js 渲染 React。此外,它實現了單向響應的資料流,因此比其他框架更容易理解和使用。

  ③、Backbone

    Backbone 提供一個完整的 MVC 框架以及路由。模型允許鍵-值繫結和資料變化的事件處理,Backbone 是我建立簡單 web 應用程式的首選框架。

  .....(參考連結http://web.jobbole.com/84644/