새로운 프로토타입을 구상하면서 Javascript Client Framework이 필요하여 검토하던 중에 Knockout 과 backbone 을 비교해 본다.
당연히 각 프레임워크 마다 장/단점이 있게 마련이다. 무엇을 어떻게, 어디에, 어떤 용도로 사용할지에 따라서 판단이 되어야 할 것이다.
이미 웹 어플리케이션은 MVC 기반의 환경에서 개발이 되고 있다. 그러나 아직도 클라이언트 측면에서 보면 jQuery와 Aajax를 통해서 많은 부분을 해결하고는 있지만 Low-level 에서 개발이 되고 있다.
그러나 화면에 다양한 요소들을 표시하고 하나의 데이터가 변경되었을 때 여러 부분에 존재하는 요소들을 갱신하여야 한다면 이를 모두 jQuery를 이용해서 변경하는 것은 코드의 작성과 처리가 점점 더 복잡해지게 된다.
점점 더 사용자의 요구가 복잡해지고 있는 시점에 이런 복잡성과 기능성을 만족하기 위해서는 클라이언트도 프레임워크와 적절한 디자인 패턴이 적용되어야 한다. 이미 클라이언트에도 패턴이 적용된 프레임워크들이 존재하고 있다.
이제 가장 많이 사용된다고 생각되는 대표적인 클라이언트 프레임워크 2개를 비교해 보도록 한다.
Backbone.js
- 적용 패턴 : MVC (Model - View - Controller)
- 장점 : RESTful (REpresentational State Transfer) 서비스와 통합성
- 단점 : 적응을 위한 시간 필요, 추가적인 코드의 양이 많을 수 있다.
모델은 back-end Ajax 처리를 의미하고, 뷰는 화면에 정보를 표현하는 마크업이 포함된 템플릿이다. 컨트롤러는 모델과 뷰를 연계하는 역할을 담당한다.
아마도 가장 많이 사용되고 있는 프레임워크일 것이다. 이와 유사한 프레임워크는 spine
.js 가 있으며 거의 유사하지만 서버와의 연계 부분이 다르다.
backbone 이 서버의 결과를 받아서 처리할 때까지 UI 업데이트가 불가능 하지만 spine 은 UI 업데이트를 허용하고 서버 연계를 백그라운드로 처리가 된다. 물론 이런 방법은 여러 사람들이 같이 사용하는 어플리케이션에서는 데이터 불일치의 문제가 발생할 수도 있다.
backbone 과 spine 중에 하나를 선택하려면 서버와의 연계에 따른 UI 처리 방법을 기준으로 하면 될 듯 하다.
Knockout.js
- 적용 패턴 : MVVM (Model - View - ViewModel)
- 장점 : 뷰와 뷰모델 간의 선언적 바인딩, 상대적으로 적용시간이 짧다.
- 단점 : MVVM 모델이 광범위하게 사용되는 모델은 아니고, 소규모 프로젝트에 적합
모델은 back-end Ajax 처리를 의미하고, 뷰는 화면에 정보를 표현하는 마크업이 포함된 템플릿이고, 뷰모델은 모델 데이터를 보유하고 데이터에 대한 추가/편집/삭제 처리가 포함될 수 있다. 뷰는 선언적으로 뷰모델에 바인딩되는 정보를 포함하고 있다.
MVVM 모델은 주로 .NET 계열에서 많이 사용된다. View 에 Model 의 상태를 선언적으로 바인딩하는 형식의 사용에 적합하다.
최근에는 backbone 과 knockout 을 혼합한 듯한 batman 프레임워크가 존재한다. 이 프레임워크에 대해서는 좀 더 알아보아야 할 듯 하다.
Conclusion
결과적으로는 대규모 장기 프로젝트에서는 backbone 이나 spine 을 검토해 보아야 한다. 그러나 선언적 바인딩의 장점을 사용해야 하는 경우라면 Knockout 이나 batman 을 검토해 보는 것이 좋다.
중요한 점은 이런 클라이언트 프레임워크가 아직도 빠르게 변화되고 발전되고 있다는 점이다. 따라서 "어느 것이 좋다!" 라고 성급하게 말할 수는 없다.
댓글
댓글 쓰기