I would like to share my design of mvc via js.What do you think about it? I tried to not use any mvc framework but i want to get clear structure and a decoupled organisation.Next step for me is evaluating something like require.js to get rid of the ordering within the index fileThe code:XX.namespace.ContactListController = (function() {var _initListener = function() {    $(document).ready(function() {        $(#addContact).click(function() {            var contactName = $(#contactName).attr('value');            var contact = new  XX.namespace.ContactModel(contactName);            $.publish(add#contact, contact);        });        $(#removeContact).click(function() {            var contactName = $(#contactName).attr('value');            var contact = new  XX.namespace.ContactModel(contactName);            $.publish(remove#contact, contact);        });    });};var interface = {    init: function() {        _initListener();    }};return interface;})(XX.namespace.ContactListModel, XX.namespace.ContactListView);XX.namespace.ContactListModel = (function() {var contactList = [];/*** @private*/var _addContact = function(channel, contact) {    contactList.push(contact);};var _removeContact = function(channel, contact) {    var index = contactList.indexOf(contact);    contactList.splice(index, 1);};/*** API*/$(document).ready(function() {    $.subscribe(add#contact, _addContact);    $.subscribe(remove#contact, _removeContact);}) })();XX.namespace.ContactModel = function x(name) {this.name = name;};   XX.namespace.ContactListView = (function(){var uiComponents = {    contactList:  #contactList};var _addContact = function(channel, contact) {    $(uiComponents.contactList).append(<li contact_name=' + contact.name + '> + contact.name +</li>);};var _removeContact = function(channel, contact) {    $(uiComponents.contactList+ li[contact_name=' + contact.name+ ']).remove();};/*** API*/$(document).ready(function() {    $.subscribe(add#contact, _addContact);    $.subscribe(remove#contact, _removeContact);})})();     (function() {      XX.namespace.ContactListController.init(); })();<!DOCTYPE html><html> <head>     <meta charset=utf-8>    <script src=https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js>      </script><script src=js/extlib/tinyPubSub.js></script><script src=js/src/util/namespace.js></script><script src=js/src/model/ContactModel.js></script><script src=js/src/model/ContactListModel.js></script><script src=js/src/view/ContactListView.js></script><script src=js/src/controller/ContactListController.js></script><script src=js/src/application.js></script> </head>    <body>              <h2>ContactList1</h2>    <ul id=contactList>    </ul>    <h1>Chat</h1>    <div>        <p>            <input type=text id=contactName/>            <input type=button id=addContact value=hinzufgen>            <input type=button id=removeContact value=entfernen>        </p>        Message: <input id=msg  type=text />        <textarea id=msgContainer></textarea>    </div></body>
Javascript MVC Design Feedback
javascript;mvc