SproutCore - A Next Gen JavaScript Framework

SproutCore a next generation javascript framework

What Desktop-like Apps Client Side MVC Inspired by Cocoa

Why Common App Features for Free Cross-browser Optimized Glue-code Eliminated

JavaScript and Proud Not trying to be Java, Ruby, Python, Obj-C

Features

At the code level...

Properties Example: A contact’s ﬁrst name Most are simple values - numbers, strings, objects Can be functions which dynamically “compute” value

Observers Watch for property changes Takes some action Examples: Update view, send data to server

Bindings Two objects, “bound” together When one changes, the other changes also

Example The contact ﬁrstName property is bound to the textFieldView value property. When the contact’s ﬁrstName is updated, textFieldView’s value is updated automatically. When textFieldView’s value changes, the valueDidChange observer kicks in & updates the UI.

Glue Code Eliminated! Controllers and views automatically stay in sync with the model objects in your application!

But... there’s a small price to pay

Key Value Coding Access properties with object.get(key) Set properties with object.set(key, value); This allows SproutCore to watch things change Abbreviated as “KVC”

Example

Computed Properties Accessed like stored properties ( with get() ) Calls a function to compute the value Declared with .property()

Key Value Observing Allows Object A to observe changes to Object B How binding is able to work Abbreviated as KVO Automatic for stored (non-computed) properties Requires a little setup for computed properties...

Computed Property KVO When declaring, list the attributes the computed property relies on:

User Interface Features

Controls SC.ListView SC.GridView

Controls SC.SourceListView Form Controls

Controls Split-Panes Dialogs, Pop-up Menus, Pickers Native-Controls

Developer Tools

Generators Generate skeletons for your application, models, views, controllers Helps you get started quickly Gives you a standard place to put things

Helpers Generate your views with small, declarative helpers Similar to Ruby on Rails view helpers In fact, written in Ruby!

Development Server Handles including JS ﬁles and view partials into your HTML ﬁle - less work for you. Allows change-and-refresh style development Can proxy to external website backends for server interaction.

Build Tools Packages all assets into single files - 1 HTML, 1 CSS, 1 JavaScript. Minifies your JavaScript Host your app on any server or CDN - just static files

Thanks Scott Becker http://synthesis.sbecker.net

http://synthesis.sbecker.net	817
http://blog.dreamcss.com	455
http://www.slideshare.net	308
http://synthesis2.sbecker.net	26
http://feeds.feedburner.com	15
http://synthesis-old.sbecker.net	7
http://www.e-presentations.us	1
http://www.synthesis.sbecker.net	1

SproutCore - A Next Gen JavaScript Framework

by Scott Becker on Feb 03, 2009

Accessibility

Categories

Tags

Upload Details

Usage Rights

8 Embeds 1,630

Statistics

SproutCore - A Next Gen JavaScript Framework — Presentation Transcript