首頁»JavaScript»MVC 在前端已死?

                    MVC 在前端已死?

                    來源:segmentfault 發布時間:2016-10-19 閱讀次數:

                      隨著越來越多的前端開發開勇單項數據流架構,有些人就開始考慮傳統的 MVC 是否還有未來?為了便于理解,我們首先分析一下前端架構的發展史。

                      在過去的 4 年里,我看過許多 web 項目并花了大量的時間在前端架構或是為它整合一些框架。在 2010 年前,JavaScript(實現 jQuery 的語言)在傳統 web 應用中被廣泛用于 DOM 操作以及添加一些簡單的東西。人們并不關心架構方面的東西,一些 簡單的模塊化方式 似乎已經足夠用于設計我們的代碼了。

                      前端架構 vs 后端架構的討論隨著單頁應用這個概念的出現而爆發了,隨之出現的框架有比如:backbone 和 knockout。由于當時感念也都比較新,所以框架的設計者們不得不去其他地方獲取靈感,所以他們借鑒了一些來自后端架構中的實踐,而幾乎所有的知名后端框架都是傳統 MVC 的實現,由于其中的 一些小差異,也可以被叫做 MV*。

                      當 React.js 第一次以一個 View 層渲染庫出現在人們眼前時,它由于將 HTML 和 JavaScript 寫到一起的這種非直觀方式而被嘲諷。但人們忽視了 React 帶來的重要貢獻 —— 基于組件架構。React 并沒有發明組件的概念,但它讓組件開發更進一步。當 Facebook 在介紹 React 時將其稱為 “V in the MVC” 時,這一架構上的重大突破甚至連 Facebook 也忽視了。順便說一句,在 review 完一份 同時使用了 Angular 1.x 和 React 的代碼庫 后,我直到現在還在做惡夢。

                      不過在 2015 年,隨著 Redux 和 RxJS 的使用,Flux 和函數式響應式編程(FRP)將我們從習慣上的傳統 MVC 的思維模式轉變到 單項數據流架構。

                    那 MVC 到底問題在哪里?

                      當然,MVC 作為一個架構模式已經被開發使用了相當長的時間,同時也可以被使用與 web 開發。不要誤會,MVC 現在依然是后端開發中最好的模式,像 Rails 和 Django 等框架都很樂意使用這種模式。

                      但問題在于,MVC 在后端的使用的原則與分層方法與前端是不同的。更多精彩內容關注微信公眾號:全棧開發者中心(admin10000_com)

                     控制器與視圖耦合(Controller-View coupling)

                      從下圖可以看到視圖層和控制器在服務器端是如何交互的,它們僅有兩個接觸點,都跨越了客戶端和服務器端的邊界。

                      當我們將 MVC 放到客戶端,這就有問題了。控制器類似與我們所知的 code-behind。控制器是高度依賴視圖的(見下圖),在一些框架的實現中,它甚至是被視圖創建的(比如:ng-controller)。

                      另外,當你從單一職責原則(SRP)的角度考慮,這顯然不滿足。客戶端的控制器代碼同時進行了 事件響應 和 業務邏輯。

                     胖模型(The fat Model)

                      考慮一下你在客戶端存儲的是何種模型。一方面我們有一些數據類似于 users 或 products 代表我們的應用狀態(Application State)。另一方面,我們需要存儲一些 UI 狀態,比如 Tab 是否顯示(_showTab_)或者當前選中的值(_selectedValue_)。

                      類似于控制器,模型也在違反單一職責原則(SRP),因為我們沒有一個好的辦法將 UI 狀態和應用狀態分開管理。

                    那什么是適合組件的模型呢?

                      一個組件就是:視圖 + 事件響應 + UI 狀態。

                      下圖展示了我們如何真正的將 MVC 的模型分離成組件。然而紅線上方的部分,正是 Flux 嘗試去解決的:管理 應用狀態 和 業務邏輯。

                      隨著 React 以及基于組件的架構的流行,我們看到單項數據流在管理應用狀態方面的崛起。這兩者可以如此方便的配合在一起使用是因為它們完全覆蓋了原先的 MVC 的方式,并提供了一個對前端架構而言更好的關注點分離的方案。

                      不過不久后這就不止 React 了。如果你看過 Angular 2,你會發現它采取了完全相同的模式,不過你也可以用不同的方案來管理應用狀態,比如 ngrx/store

                      現在真的沒有能做的更好的了,MVC 在起初就注定失敗。我們需要時間來探索,這是一個 5 年的發展過程才將前端架構發展到今天。想想看,5 年其實對一個最佳實踐的建立來說不算很長。更多精彩內容關注微信公眾號:全棧開發者中心(admin10000_com)

                      MVC 在起初是必要的,因為我們那時不知道在應用越來越龐大和復雜的時候,要如何組織我們的前端應用。我覺得它已經達到了起初的目的,而且也可以學習到,如果是從一個上下文(服務器端)應用到另一個(客戶端)的時候,MVC 會是一個最佳實踐。

                    所以,未來將會是什么?

                      對我們的前端應用來說,我不認為我們會很快回到傳統的 MVC 架構。隨著也來越多的開發者開始發現組件和單項數據流架構的優勢時,關注點會被放在如何基于這條道路建設更好的工具和三方庫。

                      那這類架構回事未來 5 年最好的解決方案嗎?很有可能是這樣,但是未來沒有東西是確定的。5 年前,沒有人能預測現在我們是如何寫應用的,所以現在我們也不敢這么說。

                      原文:https://medium.com/@alexnm/is...

                    QQ群:WEB開發者官方群(515171538),驗證消息:10000
                    微信群:加小編微信 849023636 邀請您加入,驗證消息:10000
                    提示:更多精彩內容關注微信公眾號:全棧開發者中心(fsder-com)
                    MVC
                    網友評論(共0條評論) 正在載入評論......
                    理智評論文明上網,拒絕惡意謾罵 發表評論 / 共0條評論
                    登錄會員中心
                    福彩试机号今天