GUI 업데이트 관리를위한 반응성 프로그래밍 및 MVVM 패턴


11

반응성 프로그래밍과 MVVM은 UI에서 도메인 계층을 분리하는 문제를 해결할 수있는 두 가지 접근 방식입니다.

  • MVVM은 UI 구성 요소에 매핑 된 데이터 구조 인 뷰 모델을 정의하여이를 수행합니다. UI는 데이터를 표시하고 사용자가 발생할 때 업데이트 할 수 있습니다.
  • 반응 형 프레임 워크는 일부 데이터가 변경되었음을 UI에 알리는 관찰 가능 그래프를 정의합니다.

반응성 프레임 워크는 주류 플랫폼 (.net 및 java의 Rx, react.js 포함)과 더 실험적인 장소 (하스켈의 FRP) 모두에서 마음을 공유하고 있습니다.

나는 주로 MVVM을 각도와 함께 사용했으며, 소규모 / 중간 프로젝트에서만 작업했지만 단순성 대 표현 비율이 매우 만족 스럽습니다.

반응 형 프레임 워크는 개발자가 mvvm이 아닌 개발자를 어떻게 사나요?

실제로 차이가 있습니까? 예를 들어 knockout.js는 mvvm 프레임 워크로 알려지지 만 인터페이스에는 반응이 있습니다.

this.firstName = ko.observable("John");
this.lastName = ko.observable("Smith");

this.fullName = ko.computed(function() {
    return this.firstName() + " " + this.lastName();
}, this);

MVVM은 프리젠 테이션 문제를 도메인과 분리 하는 패턴 입니다. 반응성 프레임 워크는 이러한 분리 패턴을 달성하는 데 사용할 수있는 도구 입니다. 그들은 독점적이지 않습니다.
AlexFoxGill

@AlexG 글쎄, 뷰 모델과 UI 사이의 커뮤니케이션을 조정하는 툴이있다. MVVM 프레임 워크라고합니다.
Simon Bergot

요점-KnockoutJS 는 반응성 프레임 워크 를 사용하여 MVVM 분리 문제를 해결합니다. AngularJS 는 dirty-checking 을 사용하여 MVVM을 활성화합니다. 그들은 패턴을 달성하는 다른 방법 일뿐입니다. 아마도 당신의 질문은 "React 패러다임은 MVVM 프레임 워크에서 Dirty-Checking 테크닉으로 달성 할 수없는 것은 무엇입니까?"입니다.
AlexFoxGill

@AlexG 그래서 구현 세부 사항이라고 말할 것입니까? 내 질문에 대한 답변이라고 생각합니다.
Simon Bergot

@Simon : 구현 세부 사항으로 인정하지는 않지만 ViewModel까지 모델의 변경 사항을 전달하는 다른 접근 방식과 마찬가지로
Bart van Ingen Schenau

답변:


10

이것들은 경쟁이 아닌 다른 개념이며 쉽게 협력하여 훌륭한 결과를 얻을 수 있습니다.

평신도 용어로 :

MVVM은 코드 숨김 (GUI / 모델 커플 링) 혼란을 피하는 데 유용합니다. 반응성 접근 방식은 이벤트 / 콜백 클러 터를 줄이는 데 유용합니다.

Microsoft는 MVVM의 최초 발명자이므로 XAML / WPF에 대해 조금 배우는 것이 좋습니다. Microsoft는 또한 Reactive 접근법 인 Reactive Extensions를 구현했습니다.

다음은 그것들을 결합하려는 적절한 시도입니다.

http://www.reactiveui.net https://github.com/reactiveui/ReactiveUI

관련 SO 질문 :

/programming/1763411/reactive-extensions-rx-mvvm

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.