Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How to write your own Virtual DOM

Avatar for Cheesecake Labs Cheesecake Labs
December 21, 2017
Technology
0
130

How to write your own Virtual DOM

Avatar for Cheesecake Labs

Cheesecake Labs

December 21, 2017
Tweet

More Decks by Cheesecake Labs

See All by Cheesecake Labs
Cats' wellness & care
Avatar for Cheesecake Labs cheesecakelabs
0
49
How do we create the first impressions?
Avatar for Cheesecake Labs cheesecakelabs
0
55
Menstrual cup: suit and freedom
Avatar for Cheesecake Labs cheesecakelabs
0
66
Life is a cycle, better with a bicycle
Avatar for Cheesecake Labs cheesecakelabs
0
51
Interview Process: how to get the best of people
Avatar for Cheesecake Labs cheesecakelabs
1
84
My capsule wardrobe experience
Avatar for Cheesecake Labs cheesecakelabs
3
60
Stonewall Rebellion and its impact on LGBTQIA+ history
Avatar for Cheesecake Labs cheesecakelabs
1
40
Pregnancy, childbirth and breastfeeding: What do I have to do with it?
Avatar for Cheesecake Labs cheesecakelabs
0
48
MBTI - Psychological types described by Jung
Avatar for Cheesecake Labs cheesecakelabs
0
130

Other Decks in Technology

See All in Technology
生成AIを安心して活用するために──「情報セキュリティガイドライン」策定とポイント
Avatar for gree_tech gree_tech
PRO
1
350
Dylib Hijacking on macOS: Dead or Alive?
Avatar for Patrick Wardle patrickwardle
0
460
QA業務を変える（！？）AIを併用した不具合分析の実践
Avatar for ma2ri__ ma2ri
0
120
個人でデジタル庁の デザインシステムをVue.jsで 作っている話
Avatar for にしはら nishiharatsubasa
3
4.6k
事業開発におけるDify活用事例
Avatar for KentaroFujii kentarofujii
5
1.3k
JSConf JPのwebsiteをGatsbyからNext.jsに移行した話 - Next.jsの多言語静的サイトと課題
Avatar for Leko leko
2
180
「改善」ってこれでいいんだっけ？
Avatar for うきぐも / すずき ukigmo_hiro
0
410
生成AI時代のPythonセキュリティとガバナンス
Avatar for abenben abenben
0
120
ソースを読むプロセスの例
Avatar for Satoru Takeuchi sat
PRO
15
9.9k
Wasmの気になる最新情報
Avatar for asuka askua
0
180
現場データから見える、開発生産性の変化コード生成AI導入・運用のリアル〜 / Changes in Development Productivity and Operational Challenges Following the Introduction of Code Generation AI
Avatar for NTT docomo Business nttcom
1
460
だいたい分かった気になる 『SREの知識地図』 / introduction-to-sre-knowledge-map-book
Avatar for katsuhisa_ katsuhisa91
PRO
3
1.3k

Featured

See All Featured
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
1.7k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
3.1k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
2.8k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.6k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
630
Building an army of robots
Avatar for Kyle Neath kneath
305
46k
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
407
66k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
411
23k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
24
3.7k

Transcript

  1. How to write your own Virtual DOM Daniel Leite de

    Oliveira

  2. This image cannot currently be displayed. Two Myths about VDOM

  3. This image cannot currently be displayed.

  4. This image cannot currently be displayed.

  5. This image cannot currently be displayed.

  6. This image cannot currently be displayed.

  7. This image cannot currently be displayed.

  8. This image cannot currently be displayed.

  9. This image cannot currently be displayed.

  10. This image cannot currently be displayed.

  11. This image cannot currently be displayed.

  12. This image cannot currently be displayed.

  13. This image cannot currently be displayed.

  14. This image cannot currently be displayed. Sorry… it is the

    JS World

  15. This image cannot currently be displayed. What is a DOM?

  16. Document Object Model "DOM is a programming interface for HTML

    and XML documents." "The DOM represents the document as nodes and objects. "
  17. None

  18. This image cannot currently be displayed. Virtual DOM

  19. "Virtual DOM is any kind of representation of a real

    DOM" "The Virtual DOM is an abstraction of the HTML DOM. Since the DOM itself was already an abstraction, the virtual DOM is, in fact, an abstraction of an abstraction." "The Virtual DOM was not invented by React"

  20. This image cannot currently be displayed. Render Process

  21. None

  22. This image cannot currently be displayed. DOM vs Virtual DOM

  23. None

  24. This image cannot currently be displayed. The last concept… I

    promise
  25. None
  26. None

  27. This image cannot currently be displayed. Let's bake it together!

  28. None

  29. Thank you!