Microsoft has reconfirmed their commitment to help with jQuery development and will start by adding support for templating and is allocating resources including full time developers. John Resig, JQuery creator, declared that jQuery will remained an independent open source project and will not be moved to CodePlex.
jQuery was first released by John Resig back in 2006, and Microsoft announced their support of the JavaScript library in 2008. During MIX 2010 Microsoft reconfirmed their commitment to advance jQuery, and they will contribute in three areas: templating, script loading and data binding. An unspecified number of ASP.NET developers are already working full time on jQuery.
The planned jQuery additions are going to be platform and language independent, i.e. they are not going to be tied up to ASP although Microsoft intends to use it in ASP.NET for client-side development. Actually, jQuery 1.4.2 is included with Visual Studio 2010 and ASP.NET MVC. John Resig declared that there are no plans to move jQuery to CodePlex, and the library will remain an independent project.
The first feature to be added is a templating engine useful to render data in a flexible way through templates. Stephen Walther, a Senior PM focused on ASP.NET MVC at Microsoft, has submitted a template proposal which is supposed to go through the usual validation process set up for jQuery based on community’s feedback which can accept or reject any proposal.
The proposed API mentions the following new methods:
- jQuery.fn.render – rendering DOM elements
- jQuery.fn.append("#template", arrayOrObject, options) – support for DOM manipulation by specifying a template
- jQuery.templates – add compiled templates to the templates settings object
- jQuery.tmplFn – useful to extend the built-in functions with new ones
The proposal contains a rendering example:
<script type="text/javascript">
jQuery(function(){
var products = [
{ name: "Product 1", price: 12.99},
{ name: "Product 2", price: 9.99},
{ name: "Product 3", price: 35.59}
];
$("#template")
.render(products)
.appendTo("ul");
});
</script>
<script id="template" type="text/html">
<li>{%= name %} - {%= price %}</li>
</script>
<ul></ul>
The above code is meant to produce the following result:
- Product 1 – 12.99
- Product 2 – 9.99
- Product 3 – 35.59
An experimental plug-in is available, demonstrating how the templating engine is supposed to work.