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
22
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
190
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
59
Step by step I followed a career in software
igorhalfeld
0
700
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
98
Other Decks in Programming
See All in Programming
ぼくの開発環境2026
yuzneri
0
140
CSC307 Lecture 09
javiergs
PRO
1
830
メルカリのリーダビリティチームが取り組む、AI時代のスケーラブルな品質文化
cloverrose
2
510
CSC307 Lecture 05
javiergs
PRO
0
500
今こそ知るべき耐量子計算機暗号(PQC)入門 / PQC: What You Need to Know Now
mackey0225
3
370
QAフローを最適化し、品質水準を満たしながらリリースまでの期間を最短化する #RSGT2026
shibayu36
2
4.3k
KIKI_MBSD Cybersecurity Challenges 2025
ikema
0
1.3k
Amazon Bedrockを活用したRAGの品質管理パイプライン構築
tosuri13
4
250
Lambda のコードストレージ容量に気をつけましょう
tattwan718
0
110
CSC307 Lecture 04
javiergs
PRO
0
660
AI前提で考えるiOSアプリのモダナイズ設計
yuukiw00w
0
220
Basic Architectures
denyspoltorak
0
660
Featured
See All Featured
The Language of Interfaces
destraynor
162
26k
Product Roadmaps are Hard
iamctodd
PRO
55
12k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
210
Reality Check: Gamification 10 Years Later
codingconduct
0
2k
Utilizing Notion as your number one productivity tool
mfonobong
3
220
Efficient Content Optimization with Google Search Console & Apps Script
katarinadahlin
PRO
0
310
Prompt Engineering for Job Search
mfonobong
0
160
Heart Work Chapter 1 - Part 1
lfama
PRO
5
35k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
9.5k
Building a Modern Day E-commerce SEO Strategy
aleyda
45
8.6k
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
250
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/