🙆‍♀️

MVCとMVVMの違い

2023/08/30に公開

はじめに

メンターさんにMVCだけじゃなくて、MVVMなどについても知っておくといいよとアドバイスをいただいたので、調べてまとめてみました。
MVCとMVVMもサービスを利用するユーザーに見えることありません。よく使われる言葉として、設計モデルとも呼ばれています。

MVCとは

MVCとは、「Model」「View」「Controller」の頭文字をとったものです。

「Model」

システムの中で、ビジネスロジックを担当
人間で言えば、脳みたいなイメージで、ある処理にたいして計算を行ったり、処理を記憶させていつでも引き出せるような状態にすることができる。

「View」

ユーザーが閲覧できる所で、表示や入出力といった処理を担当。

「Controller」

ユーザーの入力に基づいて、ModelとViewの制御を担当。
人間で言えば、脳に命令したり、脳が処理した内容を足に伝えたり、神経みたいな役割をしています。

メリット

  • 機能毎に分割されているため,分業して作業を進めやすくなる(開発者の得意な所に集中できる)
  • それぞれが独立しているので変更・修正があった場合にその影響を受けにくい

デメリット

  • 仲介役のControllerの負担が大きくなる
  • FatViewControllerになりやすい

MVVMとは

MVCとは、「Model」「View」「ViewModel」の頭文字をとったものです。
「Model」と「View」の役割はMVCモデルと一緒です。
MVVMは主にクライアントサイド(ユーザーのブラウザ上で実行されるプログラムのこと)の開発、特にユーザーインターフェースの開発で使用されます。

「ViewModel」

ModelからのUIに描画するための情報を変換保持する役割。
ModelとViewを紐付ける接着剤のような役割を果たし、ViewModelで変更されたデータは即座にViewに反映される

(MVCとの違い)

ユーザーが入力した情報と、格納したデータをデータバインディングにて自動的に処理していく

データバインディングとは

ViewとView Modelを結び付ける仕組みのこと。

データバインディングの特徴は、ViewとView Modelどちらかで値が書き変われば、値が変化するたびにViewとView Model、両方の値が変更されるという点。

つまり、ユーザーが画面上で何らかの処理した場合でも、コンピューター上やサーバ上で何らかの処理があった場合でもViewとView Modelそれぞれに反映されるということです。

メリット

  • Viewに素早くデータを反映することができる
  • データバインディング(MVVMはデータバインディングをサポートしているため、ビューとビューモデル間の同期を自動化することができ、手動でビューを更新する必要がなくなり、コードがシンプルになる)

デメリット

  • 動作の流れが見えづらくなる
  • MVCと比べ、分業して作業を進めにくい

ユーザーの入力した情報をすぐに反映したり、サーバ側で自動的にデータを更新する頻度の多いサービスでは、MVVMの方が適している

参考にさせていただいた記事

https://qiita.com/shunta01/items/ed46b904071841957f8a

まとめ

MVCモデルは、現在railsで実装する際に利用している手法なのでなじみがありますが、MVVMは実際に運用してみないと理解しきれない部分が多くあるなと思いました。

Discussion