[JAVASCRIPT] SPA, Javascript MVC Framework

SPA, Javascript MVC Framework

 

SPA : Single Page Application. 단일 웹페이지 내에서 오든 이벤트가 이루어진다.

웹페이지간 전환이 없어서 네트워크 트래픽도 줄이고, 동작이 빠르며, 사용에 끊어짐이 없다.

 

모바일 플랫폼에서 주로 사용되고 있는 것이 SPA이다.

센차터치도 그러하고, 제이쿼리 모바일도 그렇다.

하지만 하나의 웹페이지에 자바스크립트가 많이 들어가다보니 소스가 꼬이는 문제가 발생한다.

그래서, 자바스크립트로 구성하는 MVC(Model-View-Controller)가 나오게 된다.

 

이름만 많이 들어본 Backbone.js, Angular.js, KnockOut.js, javascriptMVC등이 있다.

 

고르기가 고민된다면 http://todomvc.com/ 을 참고하시오.

 

 

JavaScript Apps

• Backbone.js
• AngularJS
• Ember.js
• KnockoutJS
• Dojo
• YUI
• Agility.js
• Knockback.js
• CanJS
• Maria
• Polymer
• cujoJS
• dermis
• Montage
• Ext.js
• Sammy.js
• Stapes
• Epitome
• soma.js
• DUEL
• Kendo UI
• PureMVC
• Olives
• PlastronJS
• Dijon
• rAppid.js
• Knockout +
  ClassBinding
• DeftJS + ExtJS
• Aria Templates
• Enyo +
  Backbone.js
• AngularJS
  (optimized)
• React
• SAPUI5

• * R = App also demonstrates routing
• * Maroon = App requires further work to be spec-compliant

---

Compile To JavaScript

• Spine
• Dart
• GWT
• Closure
• Batman.js
• TypeScript
  + Backbone.js
• TypeScript
  + AngularJS
• Serenade.js

---

MVC Extension Frameworks

• MarionetteJS
• Thorax
• Chaplin + Brunch

---

Module Loaders

• Backbone.js + RequireJS
• Flight
• Knockout + RequireJS
• AngularJS + RequireJS
• CanJS + RequireJS
• TroopJS + RequireJS
• Thorax + Lumbar
• soma.js + RequireJS
• Durandal

---

Real-time

• Meteor
• Derby
• SocketStream
• Firebase + AngularJS

---

Compare these to a non-framework implementation

• Vanilla JS
• jQuery