Skip to content

Instantly share code, notes, and snippets.

@justinbmeyer
Created October 11, 2011 22:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save justinbmeyer/1279732 to your computer and use it in GitHub Desktop.
Save justinbmeyer/1279732 to your computer and use it in GitHub Desktop.
JavaScriptMVC 3.2

Features

steal

Most of the work for the new release has been around a new version of steal. We've re-worked steal from the ground up to:

  • Simplify the API
  • Make loading faster, but still work with any script.
  • Enable 'on-demand' loading

API Improvements

For 2.0, JavaScriptMVC broke an application structure into folders for controllers, models, views, etc. Besides steal(), there were helper functions used for loading each type of resource and each helper function had slightly different rules about where they found resources. It was confusing. So we simplified it. There's only one method you need to know ... steal. Steal uses the extension to determine type. Instead of:

steal.plugins('jquery/controller',
              'mxui/data/grid',
              'steal/less')
     .models('task')
     .views('list.ejs')
     .then(function(){
     steal.less('style').then(function(){
         // code goes here
     })
})

You write:

steal('jquery/controller',
      'mxui/data/grid',
      'steal/less',
      './models/task')
.then('./views/list.ejs',
      './style.less',
      function(){
         // code goes here
})

Now, you use steal for everything. Type is inferred by extension. then() is really just another call to steal, except that it waits for all scripts prior to it to run before running scripts after then.

Faster Loading, but Works with Everything

For performance, you want to load files as quickly as possible. Steal now loads scripts in parallel and runs them as soon as possible (out of order). Instead of:

image of ordered

You'll see:

image of paralllel

Loading an app in development mode is now much faster. But often, you have scripts that need to load in a particular order. For example, loading jquery.ui.tabs.js after jquery.ui.core.js. This is where then() is useful:

steal('jquery')
   .then('./jquery.ui.core.js')
   .then('./jquery.ui.tabs.js', function(){
  // jQuery, core, and tabs have loaded
})

This loads and runs each script one after the other.

On-demand loading

steal now makes it much easier to

The future of steal

The new version of steal is also a lot about the future.
It's currently very flexible, allowing you to split builds up, map a one url to another url, etc.

For 3.3, we are planning:

  • AMD support
  • Better building options (making it easy to split up your app in several cache-able packages).

The future

  • AMD support
  • better packaging
  • easier type integration

We've re-worked steal from the ground up to be more extendable and have a much nicer API. It also handles types like LESS and CoffeeScript much easier.

Before

steal.plugins('jquery/controller')

Now

steal('jquery/controller')

This change is really about paving the way to the future.

  • better packaging

Tutorials

$.Observe

$.route

The ultimate in routing.

FuncUnit and the Browser Driver

Steal Page

Create

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment