یکی از مهمترین قسمت‌های الگوهای طراحی (هر سه مورد MVVM MVC MVP ) قسمت View آن است.
اینکه داده‌ای که داده شده است کجا تبدیل به template می شود؟
به هر صورت باید در container view مربوط به application دیتای مورد نظر را نشان داد. روش خیلی ساده این است که کل html را از سرور بگیرید. در حقیقت model شما یک قسمت داشته باشد به اسم raw html و هر دفعه آن را نمایش دهید. که البته دیتای بیهوده زیادی هر دفعه باید منتقل شود.
روش دوم این است که html را بسازید. به مثال توجه کنید.

$("#views").empty();
var container = $("<div />").attr({id: "user"});
var name = $("<span />").text(data.name);
$("#views").append(container.append(name));

به راحتی html ساخته می‌شود ولی آیا برای هر html ی باید code مربوطه کامل در قسمت javascript بیاید؟ تغییرات html این کار بسیار دشوار است و در نهایت قسمت javascript هم کد بیهوده زیادی خواهد داشت.
تعداد زیادی برنامه template rendering در javascript هست.

• olado/doT -> https://github.com/olado/doT
• jasonmoo/t.js -> https://github.com/jasonmoo/t.js
• flatiron/plates -> https://github.com/flatiron/plates
• List.js - Add search, sort and flexibility to plain HTML lists or tables with cross-browser native JavaScript by @javve -> http://listjs.com/
• Tempo :: The tiny JSON rendering engine by TwigKit -> http://twigkit.github.com/tempo/
• honza/140medley -> https://github.com/honza/140medley
• John Resig - JavaScript Micro-Templating -> http://ejohn.org/blog/javascript-micro-templating/
• deepsweet/microjungle -> https://github.com/deepsweet/microjungle
• pvande/Milk -> https://github.com/pvande/Milk
• {{ mustache }} -> http://mustache.github.com/
• mir.aculo.us JavaScript with Thomas Fuchs » Blog Archive » Little helpers: a tweet-sized JavaScript templating engine -> http://mir.aculo.us/2011/03/09/little-helpers-a-tweet-sized-javascript-templating-engine/
• hij1nx/weld -> https://github.com/hij1nx/weld

به طور مثال با استفاده از milk یک قالب می سازیم.

Milk.escape('<tag type="evil">');  // => '&lt;tag type=&quot;evil&quot;&gt;'

Milk.escape = function(str) { return str.split("").reverse().join("") };

// Milk.escape is used to handle all escaped tags
var template = "{{data}} is {{{data}}}";
Milk.render(template, { "data": "reversed" });  // => "desrever is reversed"

همانطور که در مثال می‌بینیم Template را با Date مربوطه Render میکنیم. و کارهایی مثل escape, helper, partial template هم انجام می دهد.
Tag های قالب هم مثل mustache می باشد.
در حقیقت Event هم می تونه جزئی از view باشد. قبل‌تر هم گفتم بهتر است که deligate بر روی قسمت‌های کوچک‌تر قالب باشد. وقتی container مربوط به View شما مشخص است چه بهتر که بر روی همان deligate را انجام دهید و در نهایت به یک action برسید.
از طرفی نیاز هست که هر view قابلیت render مجدد داشته باشد. Data ممکن است تغییر کند و با هر تغییر باید render انجام شود (از طریق model یا …)

backbone.js view
در backbone هم قسمتی هست که نیاز است همه event ها bind شود و …
 

var DocumentRow = Backbone.View.extend({

  tagName: "li",

  className: "document-row",

  events: {
    "click .icon":          "open",
    "click .button.edit":   "openEditDialog",
    "click .button.delete": "destroy"
  },

  render: function() {
    ...
  }

});

اسامی tagName و className و id در حقیقت آدرس RootElemnt هستند. که می‌توان در render از آن استفاده کرد.
از طرفی event هم دو قسمت دارد که اول نوع event و دوم elementi که بر روی آن deligate صورت می‌گیرد است. مورد روبروی هر کدام هم در حقیقت this.title هست که می‌شود مستقیماً یک function باشد.
برای render هم مثلاً شما از milk استفاده می‌کنید همچین کدی را خواهید داشت.

Template = $(this.tagName)
Milk.render(template, this.data);

data هم از طریقModel باید تأمین شود.