We learned recently, after the Apple WWDC ‘08 in SFO , that a (promising) Javascript framework, called Sproutcore, is behind MobileMe (ex .mac) . Sproutcore will help Apple to build “native look and feel web applications” and is already considered as a “Cocoa for the web”.
Apple kept it secret for a long time, but revealed this because Sproutcore is an open source project, and people don’t stop talking about this.
Apple explained at the public schedule in WWDC : “SproutCore is an open source, platform-independent, Cocoa-inspired JavaScript framework for creating web applications that look and feel like Desktop applications. Learn how to combine SproutCore with HTML5’s standard offline data storage technologies to deliver a first-class user experience and exceptional performance in your web application.”
“Open Help for JavaScript.
JavaScript is a powerful language that, thanks to its bundling with all modern web browsers, is very widely deployed. However, there is a paucity of strong tools for building anything more than basic scripts to kick off web animations and other dynamic behaviors. That has opened the door for proprietary tools such as Adobe Flash, which is built around ActionScript, which is itself based upon JavaScript.
Adobe’s Flash plugin for the Mac has long been a second class citizen because Adobe has focused on its Windows version; Steve Jobs also stated that Adobe didn’t offer a mobile runtime appropriate for the iPhone, only a Flash Lite version that wasn’t capable of running existing desktop Flash content and a desktop version that wasn’t suited to run on a mobile device, as described in Steve Jobs pans Flash on the iPhone.
In place of using Flash on its own website, Apple has been working with a number of open scripting frameworks such as Prototype and Script.aculo.us, which mentions Apple on the front page of its website as a high profile user. Those frameworks offer prebuilt code that has been polished to work on all browsers, making it easier for the developer to concentrate on what their web page should be doing rather than repeatedly reinventing the wheel for various low level functions. In that respect, open JavaScript frameworks can replace Flash without requiring any secondary plugin runtime because they are simply open JavaScript that runs in the browser directly.”
[...]
“Introducing SproutCore
Jolley’s SproutIt decided to move past common scripting frameworks to develop an entire application development stack based on the Model View Controller architecture. In MVC development, Model data and user interface Views are tied together by discrete Controller logic. This is in contrast to typical web development tools that mix logic, data, and presentation together, resulting in code that is messy and difficult to maintain.”
[...]
“Cocoa for the Web
Apple didn’t just use SproutCore, it also contributed major performance updates and added lots of new functionality. Apple’s contributions have helped make SproutCore the ideal way to build web applications that work like desktop Cocoa apps, as noted in the article Cocoa for Windows + Flash Killer = SproutCore. Both share a lot of the same conventions such as the use of bindings. SproutCore’s bindings allow developers to write JavaScript that automatically runs any time a property value changes. Using bindings, very complex applications with highly consistent behavior can be created with very little “glue” code.
Apple has also been working on the other side of the client equation to improve its own JavaScript engine in Safari. Announced just prior to WWDC, WebKit’s new SquirrelFish JavaScript interpreter will dramatically boost the performance of JavaScript applications like those built in SproutCore.”
[...]
Read the whole article on AppleInsider
For people who want a quickstart on Sproutcore ( i tested on a Mac).
As a pre-requisit you should have Ruby, and RubyGems preinstalled.
Sproutcore can be installed as a gem with the command :
> sudo gem install sproutcore
SproutCore server is based on Merb, a light ruby MVC framework, sold as ORM agnostic, Javascript library agnostic, Template engine agnostic, preferring plugins that add in support for a particular feature rather than trying to produce a monolithic library with everything in the core.
If dependencies are needed (in my case i already had Merb installed)
> sudo gem install merb
Then create your project :
> mkdir sproutcore-projects; cd sproutcore-projects
> sproutcore test
create
create clients
create frameworks
create lib
create public
create log
create README
create sc-config.rb
dependency client
exists clients
create clients/test
create clients/test/english.lproj
create clients/test/core.js
create clients/test/english.lproj/body.css
create clients/test/english.lproj/body.rhtml
create clients/test/english.lproj/strings.js
create clients/test/main.js
readme ../README
> cd test
Start the server :
> sc-server
Test the application : Open the URL http://localhost:4020/test in your browser
Now add models, controllers and views
WARNING:
For people having installed sproutcore gem, they can no longer script/generate model on a normal Rails application..
It seems there is problem with sproutcore + rubigen + rails
You should uninstall sproutcore then reinstall the 0.9.10+ release of sproutcore
More about Sproutcore here
[UPDATED] Sproutcore demos
More details about mobileme
More details about Squirrelfish on WebKit Project website
2 Comments
In just three command line, you’re now able to browse a web page that is 1Mo heavy and lots a dozen of CSS files and something like fifty JS, very promising! I’m gonna by more RAM and ask my provider to install the fiber asap.
Yoan, i /m right with you (i did not see last night) …
And no compression.
More surprising than promising for the moment… i will do tests these next evenings.
And what do you think of Objective-J > for me, no usage as i’m not Objective C programmer, so i prefer to stay coding real javascript for the moment.
Here is the sum of file weights >
du -sk /static/test/en/_cache/
1124
Here are all the files included in the HTML page of the homepage.
CSS
/static/sproutcore/en/_cache/icons-1213646404.css
/static/sproutcore/en/_cache/tests-1213646404.css
/static/sproutcore/en/_cache/menu-1213646404.css
/static/sproutcore/en/_cache/panes-1213646404.css
/static/sproutcore/en/_cache/core-1213646404.css
/static/sproutcore/en/_cache/tab-1213646404.css
/static/sproutcore/en/_cache/buttons-1213646404.css
/static/sproutcore/en/_cache/theme-1213646404.css
/static/sproutcore/en/_cache/picker-1213646404.css
/static/test/en/_cache/body-1213647898.css
JS
/static/prototype/en/_cache/prototype-1213646404.js
/static/sproutcore/en/_cache/strings-1213646404.js
/static/sproutcore/en/_cache/Core-1213646404.js
/static/sproutcore/en/_cache/foundation/date-1213646404.js
/static/sproutcore/en/_cache/foundation/string-1213646404.js
/static/sproutcore/en/_cache/foundation/benchmark-1213646404.js
/static/sproutcore/en/_cache/mixins/observable-1213646404.js
/static/sproutcore/en/_cache/mixins/array-1213646404.js
/static/sproutcore/en/_cache/foundation/object-1213646404.js
/static/sproutcore/en/_cache/foundation/input_manager-1213646404.js
/static/sproutcore/en/_cache/foundation/responder-1213646404.js
/static/sproutcore/en/_cache/foundation/node_descriptor-1213646404.js
/static/sproutcore/en/_cache/foundation/binding-1213646404.js
/static/sproutcore/en/_cache/foundation/path_module-1213646404.js
/static/sproutcore/en/_cache/mixins/delegate_support-1213646404.js
/static/sproutcore/en/_cache/views/view-1213646404.js
/static/sproutcore/en/_cache/panes/pane-1213646404.js
/static/sproutcore/en/_cache/views/container-1213646404.js
/static/sproutcore/en/_cache/panes/overlay-1213646404.js
/static/sproutcore/en/_cache/validators/validator-1213646404.js
/static/sproutcore/en/_cache/validators/credit_card-1213646404.js
/static/sproutcore/en/_cache/foundation/error-1213646404.js
/static/sproutcore/en/_cache/drag/drag-1213646404.js
/static/sproutcore/en/_cache/drag/drag_data_source-1213646404.js
/static/sproutcore/en/_cache/foundation/unittest-1213646404.js
/static/sproutcore/en/_cache/drag/drag_source-1213646404.js
/static/sproutcore/en/_cache/mixins/control-1213646404.js
/static/sproutcore/en/_cache/mixins/validatable-1213646404.js
/static/sproutcore/en/_cache/views/field/field-1213646404.js
/static/sproutcore/en/_cache/mixins/editable-1213646404.js
/static/sproutcore/en/_cache/views/field/text_field-1213646404.js
/static/sproutcore/en/_cache/mixins/inline_editor_delegate-1213646404.js
/static/sproutcore/en/_cache/views/inline_text_field-1213646404.js
/static/sproutcore/en/_cache/views/label-1213646404.js
/static/sproutcore/en/_cache/mixins/collection_view_delegate-1213646404.js
/static/sproutcore/en/_cache/views/collection/collection-1213646404.js
/static/sproutcore/en/_cache/foundation/undo_manager-1213646404.js
/static/sproutcore/en/_cache/mixins/scrollable-1213646404.js
/static/sproutcore/en/_cache/views/button/button-1213646404.js
/static/sproutcore/en/_cache/views/button/disclosure-1213646404.js
/static/sproutcore/en/_cache/views/source_list_group-1213646404.js
/static/sproutcore/en/_cache/views/image-1213646404.js
/static/sproutcore/en/_cache/views/list_item-1213646404.js
/static/sproutcore/en/_cache/controllers/controller-1213646404.js
/static/sproutcore/en/_cache/controllers/object-1213646404.js
/static/sproutcore/en/_cache/foundation/animator-1213646404.js
/static/sproutcore/en/_cache/validators/email-1213646404.js
/static/sproutcore/en/_cache/foundation/json-1213646404.js
/static/sproutcore/en/_cache/foundation/server-1213646404.js
/static/sproutcore/en/_cache/views/button/checkbox-1213646404.js
/static/sproutcore/en/_cache/mixins/selection_support-1213646404.js
/static/sproutcore/en/_cache/controllers/array-1213646404.js
/static/sproutcore/en/_cache/views/field/textarea_field-1213646404.js
/static/sproutcore/en/_cache/models/record-1213646404.js
/static/sproutcore/en/_cache/models/store-1213646404.js
/static/sproutcore/en/_cache/models/collection-1213646404.js
/static/sproutcore/en/_cache/views/collection/source_list-1213646404.js
/static/sproutcore/en/_cache/views/split-1213646404.js
/static/sproutcore/en/_cache/views/spinner-1213646404.js
/static/sproutcore/en/_cache/views/field/checkbox_field-1213646404.js
/static/sproutcore/en/_cache/drag/drop_target-1213646404.js
/static/sproutcore/en/_cache/panes/dialog-1213646404.js
/static/sproutcore/en/_cache/views/button/radio-1213646404.js
/static/sproutcore/en/_cache/foundation/mock-1213646404.js
/static/sproutcore/en/_cache/views/collection/list-1213646404.js
/static/sproutcore/en/_cache/views/collection/table-1213646404.js
/static/sproutcore/en/_cache/views/field/radio_field-1213646404.js
/static/sproutcore/en/_cache/views/error_explanation-1213646404.js
/static/sproutcore/en/_cache/foundation/page-1213646404.js
/static/sproutcore/en/_cache/views/scroll-1213646404.js
/static/sproutcore/en/_cache/views/radio_group-1213646404.js
/static/sproutcore/en/_cache/foundation/set-1213646404.js
/static/sproutcore/en/_cache/foundation/run_loop-1213646404.js
/static/sproutcore/en/_cache/views/popup_menu-1213646404.js
/static/sproutcore/en/_cache/panes/menu-1213646404.js
/static/sproutcore/en/_cache/foundation/timer-1213646404.js
/static/sproutcore/en/_cache/views/popup_button-1213646404.js
/static/sproutcore/en/_cache/controllers/collection-1213646404.js
/static/sproutcore/en/_cache/views/pagination-1213646404.js
/static/sproutcore/en/_cache/views/collection/image_cell-1213646404.js
/static/sproutcore/en/_cache/foundation/application-1213646404.js
/static/sproutcore/en/_cache/globals/panels-1213646404.js
/static/sproutcore/en/_cache/globals/popups-1213646404.js
/static/sproutcore/en/_cache/panes/panel-1213646404.js
/static/sproutcore/en/_cache/foundation/routes-1213646404.js
/static/sproutcore/en/_cache/views/field/select_field-1213646404.js
/static/sproutcore/en/_cache/views/form-1213646404.js
/static/sproutcore/en/_cache/validators/password-1213646404.js
/static/sproutcore/en/_cache/foundation/utils-1213646404.js
/static/sproutcore/en/_cache/views/tab-1213646404.js
/static/sproutcore/en/_cache/validators/date-1213646404.js
/static/sproutcore/en/_cache/globals/window-1213646404.js
/static/sproutcore/en/_cache/panes/manager-1213646404.js
/static/sproutcore/en/_cache/views/filter_button-1213646404.js
/static/sproutcore/en/_cache/validators/number-1213646404.js
/static/sproutcore/en/_cache/validators/not_empty-1213646404.js
/static/sproutcore/en/_cache/views/progress-1213646404.js
/static/sproutcore/en/_cache/views/menu_item-1213646404.js
/static/sproutcore/en/_cache/views/toolbar-1213646404.js
/static/sproutcore/en/_cache/views/segmented-1213646404.js
/static/sproutcore/en/_cache/views/split_divider-1213646404.js
/static/sproutcore/en/_cache/views/slider-1213646404.js
/static/sproutcore/en/_cache/panes/picker-1213646404.js
/static/sproutcore/en/_cache/views/collection/grid-1213646404.js
/static/test/en/_cache/strings-1213647898.js
/static/test/en/_cache/core-1213647898.js
/static/test/en/_cache/main-1213647898.js
One Trackback/Pingback
[...] http://laurentbois.com/2008/06/16/sproutcore/ [...]