建立軟體可能很複雜。
在建立業餘專案時,您可能不需要考慮太多,但生產軟體有所不同。
它可能需要多個元件,如果處理不當,所有這些元件都可能導致混亂。
但它不需要這麼複雜。在今天的文章中,我們將深入研究架構模式的世界,並討論將您的軟體分為 3 個簡單的元件,每個元件都專注於相關的任務。
每當我們談論軟體設計中的架構模式時,首先出現的架構模式包括客戶端-伺服器、分層、整體、微核心、偶數驅動等架構。 、伺服器等
然而,MVP、MVC 和 MVVM 專注於透過分離資料、使用者介面和邏輯來組織單一應用程式中的程式碼。這些是專注於整個系統的架構模式的子集。
為了保持部落格的可讀性並且不超過字長,我們將只關注在單一應用程式中組織程式碼的架構模式,即:
模型-視圖-控制器
模型-視圖-呈現器
模型-視圖-視圖模型
顯然,所有三個模型都有兩個固定的元件,即模型和視圖。因此,在討論每個架構之前,讓我們先詳細討論它們。
該模型由與軟體中存在的資料相關的所有程式碼組成。它是資料庫層和網路層與應用程式其餘部分進行通訊的層。其主要職責包括:
處理資料和業務邏輯。
封裝應用程式的資料和管理對該資料的存取的規則。
處理資料結構。
對資料執行 CRUD(建立、讀取、更新和刪除)操作。
視圖幾乎是應用程式的前端或使用者能夠看到並與之互動的所有內容。它也稱為應用程式的使用者介面 (UI)。其職責包括:
處理非業務邏輯和純粹的表示邏輯。
將其他層提供的資料呈現給使用者。
接收使用者輸入並將其轉發到其他層。
可能或可能直接與模型層通訊。
現在我們已經了解了模型層和視圖層的作用,接下來讓我們來看看各個架構模式。
從 MVC 開始,它使用控制器層與模型層和視圖層進行通訊。
控制器的主要職責包括:
透過模型層操作資料。
從視圖層接收指令,也稱為 UI。
使用由於控制邏輯而定義的變更來更新視圖。
在這裡,雖然視圖層不能直接與模型層交互,但它可以接收基於資料變化的更新。因此,所有三層都以某種形式相互連接,控制器是主要元件。
在這裡,Presenter 層承擔了 Model 層和 View 層之間的「中間人」的功能,並處理它們之間的所有通訊。模型層和視圖層之間根本沒有直接通訊。
其職責包括:
根據使用者操作更新 UI 或視圖層。
根據程式碼邏輯更新資料或模型層。
處理大部分原本需要在 MVC 架構的控制器中處理的業務邏輯。
乍一看,這個架構與 MVP 架構幾乎相同。但它們之間有一些關鍵的差異:
多個視圖可以映射到單一 ViewModel 層。
它在 ViewModel 層和 View 層之間使用資料綁定,使其更加事件驅動。
該架構中沒有使用者介面的概念。視圖層代表使用者的操作,而不是介面。
|方面| MVC | MVP | MVVM |
|--------|-----|-----|--------|
|全名 |模型-視圖-控制器 |模型-視圖-呈現器 |模型-視圖-視圖模型 |
|關注點分離 |基本 |更好 |最佳|
|資料流|雙向|單向|單向資料綁定 |
|視圖邏輯關係|多對一 |一對一 |多對一 |
|可測試性|硬|好 |最佳|
|保養|硬|簡單|簡單|
|學習曲線|簡單|簡單|更難|
|性能|由於緊密耦合,速度可能會變慢 |更鬆散的耦合帶來更好的性能 |流暢的性能,特別是對於複雜的 UI |
|使用者介面更新 |控制器更新 查看 |示範者更新 查看 | ViewModel 透過資料綁定更新View |
|對UI框架的依賴|高|低|低依賴性或無依賴性 |
|可擴充性|適合小型專案 |適用於簡單和複雜的專案 |非常適合大型資料密集型應用程式 |
但您可能會問哪一個是最受歡迎的?所有這些都是同樣流行的架構,根據公司各自的產品要求使用。採用這些不同架構的一些公司是:
戴爾
MVP:Google(對於某些 Android 應用程式)
MVVM:Apple(適用於某些使用 SwiftUI 的 iOS 應用程式)、Angular 框架、Vue.js 框架
此外,許多公司根據每個專案或產品的特定需求混合使用這些架構。架構的選擇通常取決於應用程式的複雜性、開發團隊的專業知識以及專案的特定要求等因素。
本文介紹了架構模式的基礎知識,從整體架構的設計方式到單一應用程式如何進一步劃分為三個元件以實現更好的管理和可擴展性。
MVC 以其簡單的方法在 Web 應用程式中仍然很受歡迎。
MVP 建立在 MVC 的基礎上,提供改進的可測試性和更清晰的關注點分離。
MVVM 是這三者中最新的一個,在現代應用程式開發中獲得了巨大的關注。
它們之間沒有明顯的贏家,每種模式都有獨特的優勢,適合不同的專案和開發場景。隨著軟體開發領域的不斷發展,我們可能會看到這些模式的進一步改進或新架構的出現。
想要了解有關所討論的架構模式的更多資訊?以下是我認為有用的一些參考資料:
https://www.geeksforgeeks.org/android-architecture-patterns/
https://www.masaischool.com/blog/comparing-software-architecture-patterns/
原文出處:https://dev.to/chiragagg5k/architecture-patterns-for-beginners-mvc-mvp-and-mvvm-2pe7