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
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
54
Step by step I followed a career in software
igorhalfeld
0
700
Using AI to create memes
igorhalfeld
0
520
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
94
Other Decks in Programming
See All in Programming
tparseでgo testの出力を見やすくする
utgwkk
2
330
メルカリのリーダビリティチームが取り組む、AI時代のスケーラブルな品質文化
cloverrose
2
440
CSC307 Lecture 01
javiergs
PRO
0
650
0→1 フロントエンド開発 Tips🚀 #レバテックMeetup
bengo4com
0
450
LLM Çağında Backend Olmak: 10 Milyon Prompt'u Milisaniyede Sorgulamak
selcukusta
0
140
脳の「省エネモード」をデバッグする ~System 1(直感)と System 2(論理)の切り替え~
panda728
PRO
0
130
AI 駆動開発ライフサイクル(AI-DLC):ソフトウェアエンジニアリングの再構築 / AI-DLC Introduction
kanamasa
11
4.8k
Pythonではじめるオープンデータ分析〜書籍の紹介と書籍で紹介しきれなかった事例の紹介〜
welliving
3
700
Navigation 3: 적응형 UI를 위한 앱 탐색
fornewid
1
510
AI時代を生き抜く 新卒エンジニアの生きる道
coconala_engineer
1
500
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
570
GISエンジニアから見たLINKSデータ
nokonoko1203
0
190
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
34k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
1
75
Stop Working from a Prison Cell
hatefulcrawdad
273
21k
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
80
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
0
3.4k
Marketing to machines
jonoalderson
1
4.5k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.1k
A designer walks into a library…
pauljervisheath
210
24k
Music & Morning Musume
bryan
46
7k
[SF Ruby Conf 2025] Rails X
palkan
0
660
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
196
71k
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/