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
Data Based JavaScript
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Tim Griesser
December 15, 2014
Technology
280
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Data Based JavaScript
Tim Griesser
December 15, 2014
More Decks by Tim Griesser
See All by Tim Griesser
SDL as an Artifact: Code-First Schemas in TS & JS
tgriesser
0
170
SDL as an Artifact: Code-First Schemas and GraphQL Nexus
tgriesser
0
220
End-to-End Testing for the Modern Web
tgriesser
0
190
Paving a New Path for GraphQL Schemas
tgriesser
0
110
Embracing the Power of GraphQL
tgriesser
2
1.1k
Redux: A Predictable State Container for JavaScript Apps
tgriesser
2
460
Making Relational Cool Again (or: JavaScript on ACID)
tgriesser
1
450
The Future is Now: JavaScript, ES6, and Babel JS
tgriesser
7
1.3k
Nodevember - Making Relational Cool Again
tgriesser
1
210
Other Decks in Technology
See All in Technology
Multica × 長期記憶:40個のミニプロジェクト管理
eiei114
0
130
AIエージェントの開発・提供におけるセキュリティリスクの論点と対策
flatt_security
1
580
Where Is JetBrains AI Heading- — Central CLI, Air Alpha, and the Agentic Development Stack
x5gtrn
PRO
0
130
Self Healing Rollouts: Automating Production Fixes with Agentic AI
kdubois
0
160
PdMをやめて、 "プロダクトビルダー"という 働き方に変えました / PdM to Product Builder
shikichee
2
720
Amazon S3 Tablesに全部任せてみた結果——コンパクション/スナップショット管理は本当に手放せるか
shigeruoda
0
400
プロダクト思考 × 基盤思考を AIで実現する Compound Engineering
tkc66buzz
1
270
Bet AI Day 2026丨Agentは、「金融」という巨大産業の何を変えられるのか
layerx
PRO
0
1k
Autonomous AI Databaseサービス・アップデート(FY27)/ adb-service-update-jp-fy27
oracle4engineer
PRO
0
120
Benchmarking Vector Databases: pgvector vs. LanceDB
tsho
0
140
こんなアーキテクチャ図は嫌だ BEYOND THE TIME: 半年後の自分へ贈る15のメッセージ / 15 of Anti-pattern in AWS Architecture Diagrams
naospon
3
250
『止めない』を設計する — 制約の中で、事業の根幹を支える判断
hiroyaterui
0
200
Featured
See All Featured
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.5k
GitHub's CSS Performance
jonrohan
1033
470k
The Cost Of JavaScript in 2023
addyosmani
55
10k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
3k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.3k
Raft: Consensus for Rubyists
vanstee
141
7.7k
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
Designing Powerful Visuals for Engaging Learning
tmiket
1
530
How to Talk to Developers About Accessibility
jct
2
540
Code Review Best Practice
trishagee
74
20k
Optimizing for Happiness
mojombo
378
71k
Color Theory Basics | Prateek | Gurzu
gurzu
0
460
Transcript
Data Based JavaScript
DataBase JavaScript?
None
Heavily Inspired by Backbone.js ! • Documentation • API •
Philosophy • Conventions
None
None
None
The Big Idea??
JavaScript “Holy Grail”
None
None
None
JavaScript “Holy Grail”
None
…but I’ve given talks on this before
…and there’s still a lot of work to be done
Data Based JavaScript
Backbone Models & Collections
None
Some Thoughts, Opinions
Some Thoughts, Opinions Backbone Models & Collections do too much
Some Thoughts, Opinions Backbone Models & Collections do too much
Backbone Models & Collections alone aren’t enough
Some Thoughts, Opinions Backbone Models & Collections do too much
Backbone Models & Collections alone aren’t enough There’s better ways than listening to individual change events
Some Thoughts, Opinions Backbone Models & Collections do too much
Backbone Models & Collections alone aren’t enough There’s better ways than listening to individual change events
Backbone Models & Collections do too much
Backbone Models & Collections (might) do too much
Backbone Models & Collections (might) do too much Wrapping Data
(attributes, get, set) Validations Change Notification Relations??? Syncing?? App Specific Logic Models
Backbone Models & Collections (might) do too much Wrapping Data
(attributes, get, set) Validations Change Notification Relations??? Syncing?? App Specific Logic Wrapping models Adding, removing, fetching models Tight ties with model (change / url) Maybe pagination??? Maybe nested models?? Maybe…whatever else you want to put there? Models Collections
What should they do Wrapping Data (attributes, get, set) Return
external relations based on attributes Limited Change Notification App Specific Logic Filter models Models Collections
Collections
None
.length .pop .push .shift .unshift .slice Array-like API
None
None
Behave like sorted maps
Behave like sorted maps which gets a little tricky…
{ add: true remove: false merge: true } Collection#set
Backbone.Model and Backbone.Collection might not be enough
Backbone.Model and Backbone.Collection might not be enough Multiple “sources of
truth”
Backbone.Model and Backbone.Collection might not be enough Multiple “sources of
truth” Object Identity issues
Backbone.Model and Backbone.Collection might not be enough Multiple “sources of
truth” Object Identity issues No definitive place of knowing what data exists in your application
Better than change events?
What might an elegant solution look like?
Limit scope of Models & Collections
Complexities of Models & Collections
Simplify of listening to change / time
Backbone.Session
Backbone.Session Think like a session cookie
Backbone.Session Think like a session cookie Similar to Backbone.sync
Backbone.Session Think like a session cookie Similar to Backbone.sync Models
& collections reference back to session
getPath()
getPath()
None
None
Relations
model.set('first_name', 'Tim')
model.set('first_name', 'Tim') model.session.setIn(['users', 1, 'first_name'], 'Tim')
model.set('first_name', 'Tim') model.session.setIn(['users', 1, 'first_name'], 'Tim') refresh views containing models
looking at paths ['users'], ['users', 1]
model.set('first_name', 'Tim') model.session.setIn(['users', 1, 'first_name'], 'Tim') refresh views containing models
looking at paths ['users'], ['users', 1] Socket, Ajax, etc.
What does this gain us? Drastically simplifies Collections Single source
of truth for everything data related Easy to switch into offline mode
None
None
None
Beyond Backbone Models & Collections
None
var x = new Immutable.Map({a: 1}); ! var y =
x.set('b', 2); ! x.get('a') // 1 ! y.get('a') // 1 ! x.get('b') // undefined ! y.get('b') // 2
Takeaway Points If you like Node but want RDBMS check
out Knex & Bookshelf
Takeaway Points If you like Node but want RDBMS check
out Knex & Bookshelf Maybe Backbone.Session could be a thing?
Takeaway Points If you like Node but want RDBMS check
out Knex & Bookshelf Maybe Backbone.Session could be a thing? Or maybe &.Session?
Summary Time spent critically analyzing the data flow in your
application can save a lot of time later