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 binding
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Igor Halfeld
September 01, 2017
Programming
0
23
Data binding
Igor Halfeld
September 01, 2017
Tweet
Share
More Decks by Igor Halfeld
See All by Igor Halfeld
Modular monoliths with fastify
igorhalfeld
0
200
How to migrate legacy frontend?
igorhalfeld
1
130
Patterns for perfect components in Vue.js
igorhalfeld
0
110
Clean Architecture no Front-end (update 2021-05-11)
igorhalfeld
0
66
Step by step I followed a career in software
igorhalfeld
0
710
Using AI to create memes
igorhalfeld
0
530
Deninho, the TS children
igorhalfeld
1
220
Micro Front-ends, what they don't tell you
igorhalfeld
0
390
CSS in JavaScripto, the anti-pattern that is good
igorhalfeld
1
100
Other Decks in Programming
See All in Programming
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
400
AI主導でFastAPIのWebサービスを作るときに 人間が構造化すべき境界線
okajun35
0
680
メタプログラミングで実現する「コードを仕様にする」仕組み/nikkei-tech-talk43
nikkei_engineer_recruiting
0
170
米国のサイバーセキュリティタイムラインと見る Goの暗号パッケージの進化
tomtwinkle
2
550
AIコードレビューの導入・運用と AI駆動開発における「AI4QA」の取り組みについて
hagevvashi
0
410
CSC307 Lecture 14
javiergs
PRO
0
470
SourceGeneratorのマーカー属性問題について
htkym
0
180
ロボットのための工場に灯りは要らない
watany
10
2.5k
15年目のiOSアプリを1から作り直す技術
teakun
1
620
RAGでハマりがちな"Excelの罠"を、データの構造化で突破する
harumiweb
9
2.7k
Go 1.26でのsliceのメモリアロケーション最適化 / Go 1.26 リリースパーティ #go126party
mazrean
1
370
How to stabilize UI tests using XCTest
akkeylab
0
110
Featured
See All Featured
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.3k
The Curse of the Amulet
leimatthew05
1
9.8k
Designing for Performance
lara
611
70k
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
How Software Deployment tools have changed in the past 20 years
geshan
0
32k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.6k
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
200
Navigating Weather and Climate Data
rabernat
0
130
Code Review Best Practice
trishagee
74
20k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
2.4k
Transcript
DATA BINDING
@Halfeld vuejs-brasil.com.br webschool.io igorluiz.me
“ Data binding is a general technique that binds data
sources from the provider and consumer together and synchronizes them. This is usually done with two data/information sources with different languages as in XML data binding.
ONE-WAY BINDING TWO-WAY BINDING
IMPLEMENTAÇÃO Dirty Checking e Dependency Tracking
DOM Watcher Watcher Watcher Dirty Checking Angular 1 State $digest
Dependency Tracking Knockout / Vue 1.x a setter getter b
Watcher a.b Collect Dependencies Bindings DOM Notify Update Notify
Virtual DOM React etc. New Virtual DOM Tree DOM Old
Virtual DOM Tree diff + patch Render Function
Virtual DOM + Dependency Tracking Vue 2.0, React + MobX
Watcher track dependencies
Object.defineProperty(obj, prop, descriptor)
DATA DESCRIPTOR ACCESSOR DESCRIPTOR
DEMO
Obrigado! é biscoito!!! http://igorluiz.me/talks/