Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Why Backbone
Search
Up Chen
November 19, 2011
Programming
1
1.9k
Why Backbone
Why should we use backbone instead hard code by ourself.
Up Chen
November 19, 2011
Tweet
Share
More Decks by Up Chen
See All by Up Chen
工程師討生活工具介紹:做更快一點
wallat
9
1.1k
Other Decks in Programming
See All in Programming
採用事例の少ないSvelteを選んだ理由と それを正解にするためにやっていること
oekazuma
2
1k
20年もののレガシープロダクトに 0からPHPStanを入れるまで / phpcon2024
hirobe1999
0
430
fs2-io を試してたらバグを見つけて直した話
chencmd
0
230
rails statsで大解剖 🔍 “B/43流” のRailsの育て方を歴史とともに振り返ります
shoheimitani
2
930
talk-with-local-llm-with-web-streams-api
kbaba1001
0
180
見えないメモリを観測する: PHP 8.4 `pg_result_memory_size()` とSQL結果のメモリ管理
kentaroutakeda
0
310
Security_for_introducing_eBPF
kentatada
0
110
Haze - Real time background blurring
chrisbanes
1
510
Effective Signals in Angular 19+: Rules and Helpers @ngbe2024
manfredsteyer
PRO
0
130
Stackless и stackful? Корутины и асинхронность в Go
lamodatech
0
700
競技プログラミングへのお誘い@阪大BOOSTセミナー
kotamanegi
0
360
急成長期の品質とスピードを両立するフロントエンド技術基盤
soarteclab
0
930
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
789
250k
Mobile First: as difficult as doing things right
swwweet
222
9k
Designing for Performance
lara
604
68k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.5k
How STYLIGHT went responsive
nonsquared
95
5.2k
The Cult of Friendly URLs
andyhume
78
6.1k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
127
18k
Designing Experiences People Love
moore
138
23k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
1.2k
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.3k
Building Adaptive Systems
keathley
38
2.3k
Transcript
Why Backbone.js
Up
www.coolpics.com.tw
What can Backbone solve ?
None
None
None
None
None
None
None
None
• Light MVC for front-end for client side • Focus
on the structure • No UI widgets • Model, View, Collection, and Router.
Model is a thing trace = { stock: ‘台積電’, status:
‘not-added’ };
Bind events on Model for everything Remove Reset Change
Bind events on Model for everything Remove Reset Change Even
bind to the variable changes change:stock
Original
Original After
View represents a model status: ‘not-added’ status: ‘added’ status: ‘loading’
updates itself
How to update itself ? Bind to model’s variables !!
stock: ‘台積電’, status: ‘not-added’ change:status
Set and forget
stock: ‘宏達電’, status: ‘not-added’ traceList.set({stock:’台積電’});
stock: ‘台積電’, status: ‘loading’ stock: ‘宏達電’, status: ‘not-added’ ajax
stock: ‘宏達電’, status: ‘not-added’ stock: ‘台積電’, status: ‘loading’
stock: ‘台積電’, status: ‘loading’ stock: ‘台積電’, status: ‘added’ stock: ‘宏達電’,
status: ‘not-added’ ajax
stock: ‘台積電’, status: ‘loading’ stock: ‘台積電’, status: ‘added’ stock: ‘宏達電’,
status: ‘not-added’
stock: ‘宏達電’, status: ‘not-added’ traceList.set({stock:’台積電’});
Set and forget traceList.set({stock:’台積電’});
None
Side Benefits
None
None
None
None
So ...
None
Thank You
Recommend starting point Official Todo example http://bit.ly/trqhlV PeepCode Backbone.js basic
http://bit.ly/vCcSNw
www.coolpics.com.tw