Dispatches from the Edge: Part 1, Template Views

written by gmoeck

More and more developers are adopting SproutCore every day, and the need for great documentation and tutorials just keeps growing. The Core Team is also making rapid progress on the new parts of SproutCore—the so-called sexy Edge. We’ve got the fantastic new SproutCore Guides to tackle the mainstream parts of SproutCore, and now, I’m aiming to tackle the new and exciting Edge parts. 

Every other week I’ll be posting what I’ll call Dispatches from the Edge. Each Dispatch will highlight a feature from the most recent release of SproutCore, explain how to use it, and wax on about why it’s so darn cool. Dispatches will also be where the team posts announcements about upcoming SproutCore-related events. Online, offline, we’ve pretty much got it covered :)

I’d like for this to be as helpful and interesting as possible, so if there’s something you want to know about, do let me know. Comment, tweet, email—I’ll be listening!

There’s been a lot going on in the world of template views lately, making it an optimal first topic for the Dispatch. One new feature stands out as being particularly exciting… so I’ll start there :)

When you create a template for a view, that template is really specifying what the display should look like all the time. Since that’s the case, when one of the properties of the view changes, it would be nice if the view would automatically redraw that section of its display to accomodate the changes in the data. The new template view does just that.

Let’s look at an example:

Dispatches from the Edge Part 1a from SproutCore on Vimeo.

Templates, however, do more than merely specify a set of attributes that get displayed on the screen. They often contain helpers like if, unless, or each to adequately describe how to display the state of the application. It would be nice if those helpers also could know automatically when they need to redraw themselves, so that developers need only specify once how the page should look, and then let the framework do the rest.

With the new template view, you can now use the normal Handlebars helpers (, , , and ), and if the properties they reference change, SproutCore will automatically update the DOM.

Let’s look at another example:

Dispatch from the Edge Part 1b from SproutCore on Vimeo.

The key point is that when we can make our templates declarative, the framework can in large part keep track of keeping the view up to date without any boilerplate code.

 

Announcements:

April’s looking busy for SproutCore meetups across the country:

Core Team Member Yehuda Katz will also be speaking at the 4/14 Silicon Valley Ruby Meetup, as well as on Wednesday, 4/27 at Philadelphia’s Emerging Technologies for the Enterprise. 

Don’t see something up here that you think should be? Let us know!