システム開発設計モデル「MVCモデル」を理解する

MVCモデルとは？

MVCモデルはModel（モデル）・View（ビュー）・Controller（コントローラー）の頭文字をとった言葉で、システム設計モデルの一つです。作業をそれぞれの分野で分業することによって、保守性や業務効率を上げることが出来ます。

システム開発以外でも、会社の構造や仕組みを示す場合にも用いられているため、普段システム開発に関わりのない方でも覚えていると役立つかもしれません。

誕生の背景と広まったきっかけ

MVCモデルの歴史は古く、1979年にパロアルト研究所にてトリグヴェレンスカウグ氏が考案しました。

当初は、プログラミング言語と総合環境開発である「Smalltalk（スモールトーク）」で、ウィンドウプログラム（コンピュータのデスクトップ上で複数のウィンドウを使って動作するアプリケーション）の設計に使われることを目的としていました。そして彼らは当時のソフトウェア開発において、ソフトウェア開発の複雑性と責務を分けて分離して管理する必要性に気づき、それぞれの役割を独立させるアーキテクチャを提案しました。これがMVCモデルの始まりです。

その後ソフトウェアのGUI（Graphical User Interface：ユーザーとコンピュータの間で対話するためのグラフィカルなインターフェースのこと）の仕様が複雑化し、GUIを持つソフトウェアやウェブシステム開発において、MVCモデルの有用性と多様性が注目されるようになりました。特にJavaServer Pages（JSP）がMVCモデルを採用したことが大きなきっかけとなり、MVCモデルは広く使われるようになりました。

それぞれの役割

MVCモデルのそれぞれの役割を解説します。

・Model（モデル）
Modelはデータベースとやり取りをし、データの登録・更新・削除など適切に操作や処理を行いControllerに処理結果を提供する役割を担っています。 Controllerがクライアントからのリクエストを受け取り、Modelに対してデータの取得、保存、更新、削除を指示すると、Modelはデータベースから情報を取得し、必要に応じてデータを加工してControllerに返します。

・View（ビュー）
Viewはデータを受け取って、デザインやレイアウトを工夫して表示し、使いやすく操作性のある画面（＝パソコンやスマホの画面）としてユーザーに提供する役割を担っています。 ControllerはModelから受け取ったデータを処理し、それをViewに送ります。しかし、そのままではWebブラウザなどに表示できないため、ViewはHTML、CSS、JavaScriptなどを使用して画面表示を行う役割を果たしています。

・Controller（コントローラー）
Controllerは、Viewからユーザーの入力（リクエスト）を受け取り、それに応じて、Modelに適切な処理を指示し、その結果をViewに伝える仲介的な役割を担っています。 Modelから受け取った情報をコントローラーが検知し、Modelに対してデータの取得やその他の操作を指示し、そのデータをViewに送り更新して、新しい情報を表示します。

MVCから派生したMVVMとは？

MVCモデルから派生した設計で、MVVM（Model-View-ViewModel）というものがあります。これはModelとViewに加え、Controllerの役割の一部機能をViewModelが担うというものです。

現代のアプリケーション開発においては、データバインディング（自動的にデータをUI要素に関連付ける仕組み）の登場や保守性の向上、コンポーネント指向への移行などの要因により、ユーザーアクションやデータの変更を直接Viewに反映させることが可能となりました。

その結果、従来のControllerの機能は薄れつつあり、その代わりにViewとModelの間でデータやコマンドを仲介し、Viewのロジックを管理するViewModelが登場しました。MVCと MVVMの違い以下の通りです。

・変更・修正があった場合の影響
MVCはそれぞれの機能が独立しているため、変更・修正が容易ですが、MVVMはMVCに比べると変更・修正が複雑です。

・データの同期
MVCは、Viewに反映させるためにContorollerの仲介が必須となり、コンポーネント間のやり取りが増えるため、動作が遅くなる可能性があります。一方で、MVVMはViewとView Modelのどちらかで値が書き変われば両方の値が変更されるというデータバインディングという特徴があるため、UI更新が容易で早いです。

・作業の進めやすさ
MVCは機能ごとに分かれているため、作業を効率的に行うことが出来ますが、MVVMはViewとModelが一緒になる分、分業がしにくく作業が遅くなる場合があります。

・テストの容易性や保守性
MVCでは、ControllerがModelとViewの仲介を行いますが、構造や保守性が低下します。一方MVMMではViewModelがその役割を担うため、ビジネスロジックとUIが別々になり、コードが整理され、テストや保守が容易になります。

MVCモデルの流れ

MVCモデルではユーザーからのリクエストを中心にしており、コントローラがリクエストを受け取って処理を開始します。以下がその流れです。

ユーザーからリクエストを受け取り、Controllerが処理する
▼
Controllerがリクエストに応じ、どのようなデータの処理をするかModelに指示する
▼
Modelは処理結果のデータ処理結果をControllerに返す
▼
ControllerはModelから送られたデータを加工しViewに送る
▼
VIewが画面表示し、ユーザーが見れる

MVCはそれぞれの役割が完全に独立しているので、コードが明確で管理しやすく、再利用や保守がしやすいのです。もしこのように役割分担をしない場合、コードが膨大な量になったり、どのコードがどの役割を果たしているのか分かりづらくなり、開発中も開発後も不便になってしまいます。

MVCモデルを普段使っているサービスで考える

ここまでで、Model（モデル）・View（ビュー）・Controller（コントローラー）がそれぞれどのような役割かは分かったかと思いますが、流れの部分は分かったようで分からないという方も多いと思います。ここではMVCモデルを「航空券予約サイト」で例えてみます。

【View】
ユーザーが航空券の検索画面にアクセスし、「出発地、目的地、日付」などの情報を入力し検索ボタンをクリックする。
▼
【Controller】
入力した情報がControllerに送られる。ControllerはModelにアクセスし、入力した航空券の条件に基づいた情報をデータベースから取得する。この時ユーザーの画面には「検索中」「ローディング中」などのメッセージが表示されている。
▼
【Model】
条件が合う航空券の情報をControllerに返す。
▼
【Controller】
 ViewにModelから取得した航空券の情報をViewに渡す。
▼
【View】
ユーザーは表示された航空券の中から希望するチケットを選択する。その情報が再びControllerに送信される。
▼
【Controller】
Modelにアクセスし、選択されたチケットを予約する。
▼
【Model】
予約されたチケットの情報をデータベールに保存する。
▼
【View】
ユーザーに予約が完了したことを確認するメッセージが表示される。

MVCモデルのメリット・デメリット

MVCモデルも開発の規模や内容により、相性の良し悪しがあります。その判断を出来るようにするために、メリット・デメリットについて理解しておきましょう。

【メリット】
・効率的
MVCは専門性が高い３つの機能のコードが独立しているため、修正や追加をする際に、どのコードがどの関連にあるかが分かりやすくなっており、コードの管理が簡単です。そのため作業の分担もしやすく、効率的に行うことが出来ます。

・保守性に優れている
MVCは各機能が分割して独立して開発されるため、不必要な情報が交わらず、特定の機能を変更する際に、関連しない部分に影響を及ぼすことが少なくなります。そのため、例えばViewでバグが発生したとしても、ModelやControllerには影響がないため、原因の特定と修正を早く済ますことが出来ます。

・コードを再利用できる
各コンポーネント内でコードを再利用できます。大規模なプロジェクトでは、コードの再利用によって開発時間を短縮し、コードの品質を向上させることができます。

【デメリット】
・プロジェクトによっては不向きになる
小規模なアプリケーションの開発の場合、MVCモデルが過剰設計となり、開発工程とコストが増える可能性があります。

・パフォーマンスの影響
MVCモデルはコードが分割されており、3つのコンポーネントが相互にやり取りするため、処理のスピードが遅くなる場合があります。リアルタイム性の高いアプリケーションではパフォーマンスに影響を及ぼす可能性があります。

まとめ

ここまで、システム開発において重要な設計モデルの1つである「MVC」について、誕生の背景や詳しい概要、メリット・デメリットについて解説してきました。
効率的に開発が進めることが可能で、企業の構造・仕組みにも活用することの出来る「MVCモデル」についてぜひ覚えておいていただければと思います。
JIITAKでもiOSやAndroidをはじめ、様々な開発実績があります。各デジタル分野の専門チームでアイデアの創出から戦略設計、開発・運用まで一気通貫で対応いたしますので、もし開発でお困りごとがありましたら、ぜひ一度JIITAKまでご相談ください！