WebApp中的頁面生命週期及路由管理

最近切換到一個新項目，使用的技術棧是Require+Backbone，鑑於對鞋廠webapp框架的瞭解，發現這個新項目有些缺陷，主要是單純依賴Backbone形成的，也就是Backbone的好和壞都在其中盡顯無遺。

說說本身對Backbone優缺點的見解。

Backbone確實是優秀的單頁MVC框架，Events自定義事件機制，爲Model/View/Colllection提供基礎模塊通訊，Aync模塊封裝了CRUD的ajax操做，Router/History爲開發者提供了路由機制，從很大程度上解決了開發者本身寫路由跳轉的邏輯。

固然也存在缺陷，面對大型webapp項目，以page爲單位的view數量增多時，一方面路由過於集中，路由邏輯變得複雜，甚至有大量對"職責分離"原則缺少認識的同窗會在router中寫入大量的業務邏輯，另外一方面缺乏對view的統一管理，如view的建立、切換、銷燬、跳轉回退等。

爲了彌補Backbone在webapp中的缺陷，能夠爲其提供頁面生命週期管理和路由管理機制。

先來講webapp生命週期管理。

別被生命週期這種大概念嚇住了，生命週期就是頁面從建立到銷燬的一個抽象過程，若是能抽象的好，能夠爲頁面內部的業務邏輯提供良好的管理。

熟悉android activity的同窗能夠看到在android framework爲activity提供至關完美的生命週期，從onCreate到onShow到onHide到onDestroy，開發者只須要在生命週期回調函數中填寫相應的業務代碼便可。

(注：能夠把android的activity當作一個page)

那麼咱們學習activity是否能夠爲page(把一個全屏view當成一個page，view即page)提供這種機制，在page被插入到dom節點(viewport)時提供onCreate回調，在page被顯示出來時提供onShow回調，以此類推，page還能提供onHide/onDestroy回調。這樣前端寫業務的同窗是否是能更好的專一業務邏輯，無須考慮頁面是如何建立銷燬，不會致使框架級代碼和業務代碼混合在一塊兒。

除了對page提供生命週期，咱們還能夠學習android framework中activity的管理對整個webapp進行管理。

在android應用啓動時，會啓動全局application，併爲activity準備好運行環境，雖然這在基礎的android demo上並未可見，是由於android提供了默認的application。

咱們在建立webapp的時候，也能提供一個全局的application，爲application也提供生命週期，如onCreate/onDestroy等。如webapp在啓動時初始化application，等到依賴的框架資源加載完成時，觸發onCreate回調，這時默認的第一個page則能夠開始建立並顯示。

在application的環境下，咱們還能提供對view的管理，創建相似activity task/stack的機制。

在android第一個activity啓動時，會創建一個默認的stack，將該activity放入其中，每個activity在stack中被稱爲一個task，這樣在用戶回退時可根據stack中的task來自動選擇回退，而不須要指定跳轉的目標activity。

有了task/stack管理機制，針對webapp也能提供對view的管理。在建立application的時候提供一個stack，當顯示一個view的時候將該view做爲一個task壓入stack中，在頁面返回管理時則變得與android activity同樣簡單。

除此以外，咱們還能挖掘activity的高級特性，如standard,singleTop,singleTask,singleInstance，這樣能夠爲view提供不少豐富的特性。

默認standard即建立一個view，將其壓入stack，返回時彈出stack；singleTop方式可指定view顯示時在stack頂層不能出現兩個一樣的view；

singleTask模式則不容許一個stack中出現兩個一樣的view，好比某些特殊的公共頁面可指定這種方式；singleInstance則是單獨爲該view建立一個stack，這種模式在webapp中暫時少見。

有了以上對view生命週期的管理、application生命週期的管理、application對view stack的管理，咱們就能解決Backbone對view管理的不足。

接着說webapp的路由與返回管理。

Backbone提供的路由機制適用於小型的單頁應用，若是不對其進行管理則會變得混亂。

咱們根據以上application對view的管理，爲view封裝一個生命週期基類Page，其中包括forward/back等方法，並提供一個對應的PageManager，屏蔽業務開發者對router的直接訪問。

根據用戶配置的hash:view映射，在用戶跳轉view的時候直接調用forward指定目標viewname(hash)，Page則可調用底層Backbone的router實現url切換，負責view的建立，而且能夠經過PageManager將view進行入棧管理，保存view的狀態。

而webapp中頁面的返回管理，則能夠在back中根據PageManager中的stack信息實現頁面的默認跳轉、指定頁面跳轉等。

默認跳轉則是按照stack出棧順序返回，指定跳轉則能夠回到棧中的某一view，並能夠指定是將view新建一個置頂到stack top，仍是將該view以上的其餘view所有銷燬。

這只是其中的兩個簡單返回機制，更多的返回能夠經過抽象業務場景來設計。

以上的兩點能夠解決在構建webapp時遇到的通用問題，無論view/router是否使用Backbone，都能創建一個良好的webapp框架。