Menjelajahi pola desain MVC, MVP, dan MVVM

Antarmuka pengguna sering kali berisi banyak kode yang berantakan terutama karena logika rumit yang perlu ditangani. Pola presentasi dirancang terutama dengan satu tujuan, mengurangi kode kompleks di lapisan presentasi dan membuat kode di antarmuka pengguna bersih dan mudah dikelola. Dalam posting ini, saya akan menyajikan diskusi tentang pola desain MVC, MVP, dan MVVM dan menyoroti kapan salah satu harus menjadi desain pilihan daripada yang lain.

Model View Controller

Kerangka kerja Model View Controller (umumnya dikenal sebagai MVC) membantu Anda membangun aplikasi yang lebih mudah untuk diuji dan dipelihara. Ini terdiri dari tiga komponen utama, yaitu:

  1. Model - ini adalah lapisan yang mewakili data aplikasi
  2. View - ini mewakili presentasi atau lapisan antarmuka pengguna
  3. Pengontrol - lapisan ini biasanya berisi logika bisnis aplikasi Anda

Tujuan utama dari pola desain MVC adalah pemisahan perhatian untuk memfasilitasi kemampuan pengujian. Pola desain Model View Controller memungkinkan Anda mengisolasi masalah dan membuat kode aplikasi Anda lebih mudah untuk diuji dan dipelihara. Dalam desain MVC tipikal, permintaan pertama kali tiba di pengontrol yang mengikat model dengan tampilan yang sesuai. Dalam pola desain MVC, tampilan dan pengontrol menggunakan desain strategi dan tampilan dan model disinkronkan menggunakan desain pengamat. Oleh karena itu, kita dapat mengatakan bahwa MVC adalah pola gabungan. Pengontrol dan tampilan digabungkan secara longgar dan satu pengontrol dapat digunakan oleh beberapa tampilan. Tampilan mengikuti perubahan model.

Model View Presenter

Pola desain MVP (Model View Presenter) juga terdiri dari tiga komponen - model, tampilan, dan presenter. Dalam pola desain MVP, Controller (dalam MVC) diganti dengan Presenter. Berbeda dengan pola desain MVC, Presenter merujuk kembali ke tampilan karena pemalsuan tampilan mana yang lebih mudah dan pengujian unit aplikasi yang memanfaatkan pola desain MVP di atas pola desain MVC jauh lebih mudah. Dalam pola desain MVP, penyaji memanipulasi model dan juga memperbarui tampilan. Ada dua variasi desain ini. Ini termasuk yang berikut ini.

  1. Tampilan Pasif - dalam strategi ini, tampilan tidak mengetahui model dan penyaji memperbarui tampilan untuk mencerminkan perubahan dalam model.
  2. Pengawas Pengawas - dalam strategi ini, tampilan berinteraksi dengan model secara langsung untuk mengikat data ke kontrol data tanpa campur tangan penyaji. Penyaji bertanggung jawab untuk memperbarui model. Ini memanipulasi tampilan hanya jika diperlukan - jika Anda membutuhkan logika antarmuka pengguna yang kompleks untuk dieksekusi.

Meskipun kedua varian ini mempromosikan kemampuan pengujian logika presentasi, varian tampilan pasif lebih disukai daripada varian lainnya (pengontrol pengawas) sejauh menyangkut kemampuan pengujian terutama karena Anda memiliki semua logika yang diperbarui tampilan di dalam penyaji.

Pola desain MVP lebih disukai daripada MVC saat aplikasi Anda perlu menyediakan dukungan untuk beberapa teknologi antarmuka pengguna. Ini juga disukai jika Anda memiliki antarmuka pengguna yang kompleks dengan banyak interaksi pengguna. Jika Anda ingin melakukan pengujian unit otomatis pada antarmuka pengguna aplikasi Anda, pola desain MVP sangat sesuai dan lebih disukai daripada desain MVC tradisional.

Model - Tampilan - ViewModel (MVVM)

Model - View - ViewModel (MVVM) adalah variasi dari pola desain Model Presentasi Martin Fowler. MVVM adalah penyempurnaan dari desain MVC populer dan ViewModel di MVVM digunakan untuk memfasilitasi Pemisahan Presentasi. Di MVVM, logika disimpan di penyaji dan tampilan sepenuhnya diisolasi dari model. Meskipun penyaji tidak mengetahui tampilan tersebut, namun tampilan tersebut mengetahui penyaji - penyaji di MVVM digunakan untuk mewakili tampilan abstrak antarmuka pengguna. Tampilan pasif menyiratkan bahwa tampilan tidak memiliki pengetahuan apa pun tentang model. Dalam pola desain MVVM, Tampilan aktif dan berisi perilaku, peristiwa, dan informasi pengikatan data. Perhatikan bahwa tampilan di MVVM tidak bertanggung jawab untuk mengelola informasi status - tampilan agak disinkronkan dengan viewmodel.Viewmodel di MVVM bertanggung jawab untuk pemisahan presentasi dan mengekspos metode dan perintah untuk mengelola status tampilan dan memanipulasi model.

Bagaimana tampilan dan viewmodel di MVVM berkomunikasi? Nah, tampilan dan viewmodel di MVVM berkomunikasi menggunakan metode, properti, dan peristiwa. Penyatuan data dua arah atau penyatuan data dua arah antara tampilan dan model tampilan memastikan bahwa model dan properti dalam model tampilan selaras dengan tampilan. Pola desain MVVM sangat cocok dalam aplikasi yang membutuhkan dukungan untuk penyatuan data dua arah.