{

Progressive Loadingwith steal

Austin McDaniel @js_consultant

Big apps have big downloads…

Apps on top of apps…

App 1

App 2

App 3

Main ApplicationHandles Authentication

Opening other apps

Widgets inside of widgetsinside of other widgets inside of other widgets inside of other widgets…

App A

Main Application

App B App C App D

Modal Combo box

Steal to the rescue…

Directed acyclic graphs…

The graph…

AppA.js

Main Application

AppB.js AppC.js AppD.js

Modal Combo box

AppA_AppB.js AppB_AppC_AppD.js

steal(’main’)

.packages(‘app/appa.js’,

‘app/appb.js’,

‘app/appc.js’)

API

$(‘.tab’).click(function(){

steal(‘app/appa.js’)

});

Then when you need it…

steal.packages(, ‘app/appa.js’: ‘app/packages/appb.js’ })

steal.p.make({ src: ‘appa.js’, has: *‘app/jquery.js’+ })

steal.p.make({ src: ‘app/packages/appa.js’, needs: *‘app/appa_appb.js’+ })

What it generates…

Demo of it running and in action….

Any Questions?

https://github.com/jupiterjs/steal/tree/packages

Try it out…