writing fast client-side code: lessons learned from sproutcore
DESCRIPTION
The SproutCore framework has evolved over the past five years to be an extremely high-performance framework that focuses on making it possible to build native-like applications in the browser.This means handling problems like working with extremely large data-sets, inconsistent connectivity, and complex DOMs. Lately, it has meant figuring out how to properly use new browser features that can make a big difference to perceived performance, like hardware acceleration.In this talk, Yehuda will cover some of the techniques that SproutCore has used historically to enable extremely complex applications to perform well in the browser, as well as what new technologies the team is looking at to leverage the latest browser technologies in building compelling content for the web.TRANSCRIPT
![Page 1: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/1.jpg)
SproutCore and Performance
Wednesday, June 29, 2011
![Page 2: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/2.jpg)
“Albert Einstein
One should not pursue goals that are easily achieved. One must develop an instinct for what one can just barely achieve through one’s greatest efforts.
Wednesday, June 29, 2011
![Page 3: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/3.jpg)
"Fast By Default"
Wednesday, June 29, 2011
![Page 4: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/4.jpg)
Core Concepts
Wednesday, June 29, 2011
![Page 5: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/5.jpg)
1. JS is cheaper
than DOMWednesday, June 29, 2011
![Page 6: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/6.jpg)
2. Keep Intermediate State in JS
Wednesday, June 29, 2011
![Page 7: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/7.jpg)
(and out of DOM)
Wednesday, June 29, 2011
![Page 8: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/8.jpg)
3. Events Cannot
CoalesceWednesday, June 29, 2011
![Page 9: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/9.jpg)
(prefer cache
clearing)Wednesday, June 29, 2011
![Page 10: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/10.jpg)
4. Materialize Objects
When UsedWednesday, June 29, 2011
![Page 11: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/11.jpg)
(also, proxy, don't copy)
Wednesday, June 29, 2011
![Page 12: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/12.jpg)
5. Follow Speed
GuidelinesWednesday, June 29, 2011
![Page 13: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/13.jpg)
JS is Cheaper
than DOMWednesday, June 29, 2011
![Page 14: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/14.jpg)
change title
change name
change address
change DOM
change DOM
change DOM
Wednesday, June 29, 2011
![Page 15: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/15.jpg)
change title
change name
change address
change DOM
Wednesday, June 29, 2011
![Page 16: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/16.jpg)
change title
change name
change address
change DOM
Wednesday, June 29, 2011
![Page 17: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/17.jpg)
browsereventloop
SCrunloop
Wednesday, June 29, 2011
![Page 18: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/18.jpg)
nativeevent
handle event
handle event
handle event
sync bindings
Wednesday, June 29, 2011
![Page 19: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/19.jpg)
nativeevent
handle event
handle event
handle event
sync bindings
Wednesday, June 29, 2011
![Page 20: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/20.jpg)
nativeevent
handle event
handle event
handle event
sync bindings
Wednesday, June 29, 2011
![Page 21: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/21.jpg)
JS Code
JS Code
JS Code
Event Handling
...
DOM Code
Wednesday, June 29, 2011
![Page 22: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/22.jpg)
Keep Intermediate State in JS
Wednesday, June 29, 2011
![Page 23: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/23.jpg)
Case Study
Wednesday, June 29, 2011
![Page 24: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/24.jpg)
“ I want to have a view that displays the total number of items that are marked done.
I want to have a feature that can mark all remaining items done.
Wednesday, June 29, 2011
![Page 25: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/25.jpg)
What do you want to do?
4 items remaining
Mark All Done
Wash dishes
Take out garbage
Make bed
Relax
Wednesday, June 29, 2011
![Page 26: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/26.jpg)
What do you want to do?
4 items remaining
Mark All Done
Wash dishes
Take out garbage
Make bed
Relax
✓
Wednesday, June 29, 2011
![Page 27: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/27.jpg)
What do you want to do?
3 items remaining
Mark All Done
Wash dishes
Take out garbage
Make bed
Relax
✓
Wednesday, June 29, 2011
![Page 28: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/28.jpg)
What do you want to do?
3 items remaining
Mark All Done
Wash dishes
Take out garbage
Make bed
Relax
✓
Wednesday, June 29, 2011
![Page 29: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/29.jpg)
What do you want to do?
3 items remaining
Mark All Done
Wash dishes
Take out garbage
Make bed
Relax
✓✓
Wednesday, June 29, 2011
![Page 30: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/30.jpg)
What do you want to do?
0 items remaining
Mark All Done
Wash dishes
Take out garbage
Make bed
Relax
✓✓✓✓
✓
Wednesday, June 29, 2011
![Page 31: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/31.jpg)
"KVO"
Wednesday, June 29, 2011
![Page 32: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/32.jpg)
item marked done
re-render stats view
Wednesday, June 29, 2011
![Page 33: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/33.jpg)
Backbone
window.AppView = Backbone.View.extend({ initialize: function() { _.bindAll(this, 'addOne', 'addAll', 'render'); this.input = this.$("#new-todo"); Todos.bind('add', this.addOne); Todos.bind('refresh', this.addAll); Todos.bind('all', this.render); Todos.fetch(); }, render: function() { var done = Todos.done().length; this.$('#todo-stats').html(this.statsTemplate({ total: Todos.length, done: Todos.done().length, remaining: Todos.remaining().length })); }});
Wednesday, June 29, 2011
![Page 34: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/34.jpg)
Backbone
window.TodoList = Backbone.Collection.extend({ done: function() { return this.filter(function(todo){ return todo.get('done'); }); }, remaining: function() { return this.without.apply(this, this.done()); }}); window.Todos = new TodoList;
Wednesday, June 29, 2011
![Page 35: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/35.jpg)
Toggling
Todos.forEach(function(todo) { todo.toggle();});
Wednesday, June 29, 2011
![Page 36: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/36.jpg)
item marked done
compute remaining
compute done
render stats view
x N
Wednesday, June 29, 2011
![Page 37: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/37.jpg)
This is foundational
Wednesday, June 29, 2011
![Page 38: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/38.jpg)
No notion of intermediate
stateWednesday, June 29, 2011
![Page 39: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/39.jpg)
Prefer Coalescing Operations
Wednesday, June 29, 2011
![Page 40: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/40.jpg)
SproutCore
ArrayController.create({ content: [],
remaining: function() { return this.filterProperty('isDone', false); }.property('@each.isDone')});
Wednesday, June 29, 2011
![Page 41: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/41.jpg)
Superficially Similar
Wednesday, June 29, 2011
![Page 42: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/42.jpg)
item marked done
clear remaining cache
compute remaining
render stats view
x N
run loop
intermediate state
Wednesday, June 29, 2011
![Page 43: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/43.jpg)
Easy to Overlook
Wednesday, June 29, 2011
![Page 44: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/44.jpg)
SproutCore
ArrayController.create({ content: [],
remaining: function() { return this.filterProperty('isDone', false); }.property('@each.isDone')});
Wednesday, June 29, 2011
![Page 45: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/45.jpg)
Key:Declare Intent
Wednesday, June 29, 2011
![Page 46: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/46.jpg)
"Coalesce"
Wednesday, June 29, 2011
![Page 47: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/47.jpg)
Wrong
Wednesday, June 29, 2011
![Page 48: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/48.jpg)
A
"hello"
B
"hello"
Wednesday, June 29, 2011
![Page 49: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/49.jpg)
A
"1"
B
"1"
Wednesday, June 29, 2011
![Page 50: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/50.jpg)
A
"12"
B
"12"
Wednesday, June 29, 2011
![Page 51: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/51.jpg)
A
"123"
B
"123"
Wednesday, June 29, 2011
![Page 52: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/52.jpg)
Right
Wednesday, June 29, 2011
![Page 53: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/53.jpg)
A
"hello"
B
"hello"
Wednesday, June 29, 2011
![Page 54: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/54.jpg)
A
"1"
B
"hello"
Wednesday, June 29, 2011
![Page 55: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/55.jpg)
A
"12"
B
"hello"
Wednesday, June 29, 2011
![Page 56: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/56.jpg)
A
"123"
B
"hello"
Wednesday, June 29, 2011
![Page 57: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/57.jpg)
A
"123"
B
"hello"run loop
Wednesday, June 29, 2011
![Page 58: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/58.jpg)
A
"123"
B
"123"
Wednesday, June 29, 2011
![Page 59: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/59.jpg)
Not 3 Deferred
ObserversWednesday, June 29, 2011
![Page 60: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/60.jpg)
Materialize Objects
When UsedWednesday, June 29, 2011
![Page 61: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/61.jpg)
Large JSON Structure
{ contacts: [ { name: "Yehuda", ... }, ... x 10,000 ]}
Wednesday, June 29, 2011
![Page 62: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/62.jpg)
Acre, Julie
Appleseed, Johnny
Arrow, Bob
Astels, David
Atwood, Michael
Axelrod, Peter
Azeroth, Roy
Wednesday, June 29, 2011
![Page 63: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/63.jpg)
Data Store
(JSON Hashes)
Contact
nametitleaddresstelephone
on demand
Wednesday, June 29, 2011
![Page 64: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/64.jpg)
Data Store
(JSON Hashes)
Contacts
where company = "GOOGLE"
live
RecordArray
Ajax Response
Wednesday, June 29, 2011
![Page 65: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/65.jpg)
Contact
datastatus
{ name: "yehuda" title: "Chief Technologist" address: "690 Spruce" telephone: "718.877.1325"}
Wednesday, June 29, 2011
![Page 66: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/66.jpg)
No Need to Copy
PropertiesWednesday, June 29, 2011
![Page 67: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/67.jpg)
Again, Foundational
Wednesday, June 29, 2011
![Page 68: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/68.jpg)
One More Thing
Wednesday, June 29, 2011
![Page 69: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/69.jpg)
Page Speed
Wednesday, June 29, 2011
![Page 70: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/70.jpg)
Build Tools
Wednesday, June 29, 2011
![Page 71: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/71.jpg)
Packed Files
Wednesday, June 29, 2011
![Page 72: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/72.jpg)
CDN: Versioned
URLsWednesday, June 29, 2011
![Page 73: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/73.jpg)
Expires Header: Same
Wednesday, June 29, 2011
![Page 74: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/74.jpg)
Stylesheets at the Top
Wednesday, June 29, 2011
![Page 75: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/75.jpg)
Scripts at the Bottom
Wednesday, June 29, 2011
![Page 76: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/76.jpg)
Simple Layout
Wednesday, June 29, 2011
![Page 77: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/77.jpg)
External JS and CSS
Wednesday, June 29, 2011
![Page 78: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/78.jpg)
Minification
Wednesday, June 29, 2011
![Page 79: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/79.jpg)
Easier said than done
Wednesday, June 29, 2011
![Page 80: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/80.jpg)
SproutCore 2.0
Wednesday, June 29, 2011
![Page 81: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/81.jpg)
OverallFile Size
Matters, but not as much as you think.
Wednesday, June 29, 2011
![Page 82: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/82.jpg)
Modules w/ Declared
DepsWednesday, June 29, 2011
![Page 83: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/83.jpg)
Lazy Loading Modules
Wednesday, June 29, 2011
![Page 84: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/84.jpg)
Thank you.
Wednesday, June 29, 2011
![Page 85: Writing Fast Client-Side Code: Lessons Learned from SproutCore](https://reader033.vdocuments.net/reader033/viewer/2022042814/555930d7d8b42a543d8b4913/html5/thumbnails/85.jpg)
Questions
Wednesday, June 29, 2011