Różnica między MVVM a MVP

Celem rozwoju oprogramowania jest tworzenie rozwiązań uwzględniających potrzeby i problemy użytkowników i firm. Aby to osiągnąć, istnieją różne technologie i wzorce architektury Model-View-ViewModel (MVVM) i Model-View-Presenter (MVP) są używane.

Podobnie jak w przypadku wszystkiego, co jest produkowane, pierwszym krokiem jest etap planowania i projektowania. Proces projektowania oprogramowania może być specyfikacją opartą na preferowanym zestawie narzędzi technologicznych i może obejmować wszystkie działania od koncepcji - poprzez - planowanie - do wdrożenia - do aktualizacji i modyfikacji.

Obejmuje projektowanie architektoniczne niskiego i wysokiego poziomu, oparte na wybranych wzorach architektonicznych, i odwzorowuje rozwiązania wielokrotnego użytku z wykorzystaniem wzorców projektowych.

Struktura aplikacji

Architektura oprogramowania określa strukturę aplikacji, która spełnia wymagania techniczne, operacyjne i użytkownika oraz odnosi się do sposobu organizacji i zarządzania kodem.

Decydowanie o architekturze aplikacji ma kluczowe znaczenie, ponieważ nie jest to łatwa, zmienna część aplikacji, która jest już opracowana; dlatego wzór architektoniczny musi zostać ustalony przed rozpoczęciem programowania.

Wzorce architektoniczne różnią się nieco od wzorców projektowych, ponieważ ich zakres jest znacznie szerszy dzięki rozwiązaniu problemów technicznych, takich jak wydajność i ograniczenia sprzętowe oraz wysoka dostępność. Przykładami różnych wzorców architektury są MVC, MVVM i MVP.

Z drugiej strony wzorce projektowe są sformalizowanymi najlepszymi praktykami, które ułatwiają programowanie obiektowe wielokrotnego użytku oraz są łatwiejsze w utrzymaniu i zmianie niż architektura aplikacji. 

Wzory architektury

Kontroler widoku modelu (MVC) był jednym z pierwszych wzorów architektonicznych opracowanych dla aplikacji internetowych, zyskującym popularność od połowy lat dziewięćdziesiątych, szczególnie wśród społeczności Java.

Nowsze frameworki, takie jak Django dla Pythona i Railsów (Ruby on Rails), skupiają się na szybkim wdrażaniu, dlatego MVC zajmuje udział w rynku jako wielką atrakcję wzorców architektonicznych.

Tradycyjnie rozwój interfejsu użytkownika zawierał dużo kodu do obsługi skomplikowanej logiki, dlatego wzorce architektury zostały zaprojektowane w celu zmniejszenia kodu na poziomie interfejsu użytkownika, dzięki czemu jest on bardziej „czysty” i łatwiejszy do zarządzania.

Tak więc ze wzorem MVC składa się aplikacja internetowa

• Model (dane)
• Widok (interfejs do przeglądania danych i manipulowania nimi)
• Kontroler (operacje i czynności wykonywane na danych)

The Model obsługuje dane i logikę biznesową i są Nie zależności między Model i Kontroler lub Widok.

The Widok przedstawia dane użytkownikowi w obsługiwanym formacie i wymaganym układzie oraz kiedy Kontroler odbiera żądania użytkowników (w celu pobrania danych), wywołuje odpowiednie zasoby potrzebne do wykonania żądania.

Zastosujmy ten wzór do budowy księgarni online.

Użytkownicy mogą wyszukiwać, przeglądać, rejestrować i kupować książki, a także zarządzać swoimi profilami i listami książek. Gdy użytkownik kliknie kategorię SCI-FI, wszystkie powiązane książki powinny zostać wyświetlone jako dostępne.

The Kontrolery obsłużyć działania, które zarządzają książkami (lista, dodawanie, przeglądanie itp.). Może być ich wiele Kontrolery z jednym głównym Kontroler „kierowanie ruchem”.

W tym przykładzie plik Kontroler nazywa się controller_books.php i Model (np. model_books.php) obsługuje dane i logikę związaną z książkami.

Wreszcie inny Wyświetlenia będą wymagane, na przykład podczas dodawania książek do koszyka online lub podczas przeglądania szczegółów książki ze zdjęciami i recenzjami.

The controller_books.php odbiera akcję (żądanie użytkownika) od głównego Kontroler (na przykład. index.php). The controller_books.php analizuje żądanie i wywołuje funkcję model_books.php (dane), aby zwrócić listę książek SCI-FI.

Odpowiedzialność za Model jest dostarczenie tych informacji przy użyciu dowolnej logiki, która została zastosowana (przy użyciu filtrów wyszukiwania). The Kontroler następnie pobiera informacje i przekazuje je odpowiednim Widok (widok wyszukiwania, widok wydruku, widok szczegółów itp.), a informacje są prezentowane (za pośrednictwem Widok) do użytkownika, który zainicjował żądanie.

To są podstawy wzorca MVC, który ewoluował odradzające się warianty wzorców architektury, takie jak Model-View-Presenter (MVP), Model-View-ViewModel (MVVM), Hierarchical-Model-View-Controller (HMVC), i Adapter Model View (MVA) itp.

Wzór MVP

Model-View-Presenter (MVP)

The Wzór MVP istnieje już od jakiegoś czasu i jest odmianą MVC. Został zaprojektowany specjalnie do automatyzacji testów, gdzie celem było zwiększenie ilości kodu, który można przetestować za pomocą automatyzacji, a wzorzec rozwiązuje niektóre problemy z warstwą prezentacji, izolując logikę biznesową od interfejsu użytkownika.

Ekran jest widokiem, dane, które wyświetla, to model, a prezenter łączy je razem.

MVP obejmuje następujące elementy z oddzielnymi obowiązkami:

• Model (określa dane do wyświetlenia)
• Widok (wyświetla dane z Modelu i kieruje żądania użytkownika do Prezentera).
• Prezenter (współdziała między widokiem i modelem i łączy je razem)

The Widok (strona internetowa) wyświetla elementy sterujące strony i zarządza nimi, przekazując zdarzenia (żądania użytkowników) do Prezenter które zostały zainicjowane w Widok.

The Prezenter reaguje na te zdarzenia, czytając i aktualizując Model żeby zmienić Widok i dlatego Prezenter obowiązkiem jest związanie Model i Widok.

Po obejrzeniu MVC i MVP wzorce, podobieństwo ma odrębne obowiązki dla każdego elementu i promują oddzielenie między Widok (UI) i Model (dane). Znaczące różnice między tymi wzorami są bardziej widoczne w sposobie ich realizacji.

MVP może być złożonym wzorcem do wdrożenia w przypadku zaawansowanych rozwiązań, ale z pewnością ma ogromne zalety, jeśli jest wdrożony jako dobrze zaprojektowane rozwiązanie, chociaż niekoniecznie może być odpowiednim wyborem dla prostych rozwiązań.

Wzór MVVM

Model-View-ViewModel (MVVM)

The MVVM wzór został zaprojektowany specjalnie dla platform Windows Presentation Foundation (WPF) i Microsoft Silverlight i może być używany na wszystkich urządzeniach XAML [i] platformy.

WPF to system Microsoft, który renderuje interfejsy użytkownika w programach Windows i został wydany po raz pierwszy w .NET Framework 3.0.

MVVM został ulepszony z MVC i według tego wzoru Widok jest aktywny z zachowaniami, zdarzeniami i wiązaniem danych oraz Widok synchronizuje się z ViewModel (co umożliwia rozdzielenie prezentacji oraz ujawnia metody i polecenia do zarządzania i manipulowania Model.

MVVM obejmuje trzy podstawowe elementy:

• Model (reprezentuje dane z walidacją i logiką biznesową)
• Widok (Widok jest odpowiedzialny za zdefiniowanie struktury, układu i wyglądu tego, co użytkownik widzi na ekranie. Idealnie widok jest definiowany wyłącznie za pomocą XAML, z ograniczonym kodem, który nie zawiera logiki biznesowej. wiążące między Widok i ViewModel aby wyświetlić dostępne opcje synchronizacji modelu i ViewModel z widokiem)
• ViewModel (oddziela widok od modelu i udostępnia metody i polecenia do manipulowania danymi (model).

The Widok odbiera dane z ViewModel (poprzez wiązanie danych i metody), aw czasie wykonywania - Widok zmieni się w odpowiedzi na wydarzenia w ViewModel.

The ViewModel pośredniczy między Widok i Model i obsługuje Widok logika. Współdziała z Model - pobieranie danych z Model i prezentując to Widok do wyświetlenia.

Wszystkie te elementy są od siebie oddzielone, co pozwala na większą elastyczność niezależnej pracy nad nimi, izolowanie testów jednostkowych i zamiana ich bez wpływu na żaden inny komponent.

Ta struktura pozwala Model oraz inne komponenty, które mogą ewoluować niezależnie, umożliwiając programistom jednoczesną pracę nad różnymi aspektami rozwiązania. Na przykład, gdzie projektanci pracują nad Widok, po prostu generują próbki danych bez potrzeby dostępu do innych komponentów. Ułatwia to łatwe przeprojektowanie interfejsu użytkownika jako Widok jest zaimplementowany w XAML.

Jak wspomniano wcześniej z MVP, proste rozwiązania nie wymagałyby architektury i wzorców projektowych, takich jak „Hello World!” jest zbyt podstawowy, aby podążać za jakimkolwiek wzorem; jednak wraz z wprowadzaniem kolejnych funkcji, funkcji i komponentów wzrasta złożoność aplikacji, a także ilość kodu, który należy zarządzać.

W podsumowaniu

Od początku tworzenia interfejsu użytkownika wzorce projektowe stają się coraz bardziej popularne, aby ułatwić proces programowania, aplikacje są bardziej skalowalne i ułatwia testowanie.

Ilustrowana różnica między wzorcami MVP i MVVM:

• Zarówno MVP i MVVM, Widok jest punktem wejścia do aplikacji
• W MVP, istnieje odwzorowanie jeden na jednego między Widok i Prezenter, w którym MVVM, związek jest jeden do wielu między Widok i ViewModel.
• MVP jest używany głównie w formularzach Windows Forms i aplikacjach Windows Phone oraz MVVM jest przeznaczony dla Silverlight, WPF, Knockout / AngularJS itp.