Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Front-end Frameworks, what's anyone says...

Avatar for Igor Halfeld Igor Halfeld
January 31, 2019
Programming
80
0

Front-end Frameworks, what's anyone says...

Avatar for Igor Halfeld

Igor Halfeld

January 31, 2019

More Decks by Igor Halfeld

See All by Igor Halfeld
Modular monoliths with fastify
Avatar for Igor Halfeld igorhalfeld
0
210
How to migrate legacy frontend?
Avatar for Igor Halfeld igorhalfeld
1
140
Patterns for perfect components in Vue.js
Avatar for Igor Halfeld igorhalfeld
0
140
Clean Architecture no Front-end (update 2021-05-11)
Avatar for Igor Halfeld igorhalfeld
0
77
Step by step I followed a career in software
Avatar for Igor Halfeld igorhalfeld
0
710
Using AI to create memes
Avatar for Igor Halfeld igorhalfeld
0
540
Deninho, the TS children
Avatar for Igor Halfeld igorhalfeld
1
230
Micro Front-ends, what they don't tell you
Avatar for Igor Halfeld igorhalfeld
0
420
CSS in JavaScripto, the anti-pattern that is good
Avatar for Igor Halfeld igorhalfeld
1
120

Other Decks in Programming

See All in Programming
難しいけど、読めた。- OSSの入口に立った話。
Avatar for shota sts11142
0
130
速く作れる。その次は、速く確かめられる開発へ 〜AIネイティブ開発を支える、Shift Down〜 / Can build fast. Next, moving to development where we can verify fast.
Avatar for r-kagaya rkaga
7
5.1k
世界の中心で、AI（App Intents）をさけぶ ー App Intents中心設計の実践ガイド
Avatar for touyou touyou
0
710
フロントエンドUIフレームワークのこれまでとこれから
Avatar for TOMIKAWA Sotaro ssssota
5
3k
Streamlitで実現する自然言語データアプリ開発
Avatar for Ayumu Yamaguchi ayumu_yamaguchi
1
320
AI時代のコードレビューは人に向けるな、仕組みに向けろ
Avatar for meijin texmeijin
4
1.9k
【高い買い物LT会】初任給で話題の国産フィジカルAIを買った話
Avatar for 赤神青空 akagami
PRO
0
170
Workers Cache を知る
Avatar for syumai syumai
0
310
JPUG勉強会 OSSデータベースの内部構造を理解しよう(第２回)
Avatar for Atsushi Ogawa oga5
0
280
iOSDCのペンライトを自動制御したい！
Avatar for Akio Itaya akkeylab
0
130
マイコン向けの軽量Ruby「PicoRuby」で各種デバイスを制御するネイティブアプリの実現手法
Avatar for bash0C7 bash0c7
0
460
Starting & Sustaining Code-Based E2E Testing for Non-Coding QA Teams( #jasstniigata )
Avatar for teyamagu teyamagu
PRO
1
670

Featured

See All Featured
The Curse of the Amulet
Avatar for Matthew Lei leimatthew05
3
15k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
515
110k
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
270
14k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
Avatar for Aleyda Solis aleyda
2
12k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
10k
The SEO identity crisis: Don't let AI make you average
Avatar for Varn varn
0
560
How to Align SEO within the Product Triangle To Get 
Buy-In & Support - #RIMC
Avatar for Aleyda Solis aleyda
2
1.8k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
234
19k
Crafting Experiences
Avatar for Bethany Jepchumba bethany
1
360
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
Avatar for Aleyda Solis aleyda
1
2.2k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
250
1.3M
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
33
5k

Transcript

  1. Front-end Frameworks O que ninguém te fala..

  2. Igor Halfeld Software Engineer & Consultancy igorluiz.me - @IgorHalfeld

  3. O que eu vim falar aqui?

  4. None

  5. Falar sobre o funcionamento deles…

  6. None
  7. None

  8. Browser É mágica!

  9. User interface Browser Engine Render Engine Data persistence Networking JavaScript

    Interpreter UI Back-end

  10. DOM Document Object Model

  11. None

  12. Virtual DOM “Virtual” Document Object Model

  13. None
  14. None

  15. Até agora, tudo legal…

  16. Beleza, e então? O front-end moderno começa depois do Angular

    1.x

  17. Watcher DOM Watcher State Watcher

  18. Virtual DOM Wrapper

  19. Deu bom

  20. Vamos imaginar… …a construção de uma interface.

  21. <p> <div> <section>

  22. Recursivo!

  23. None

  24. Render e eventos usam a main thread! Imagina se tivesse

    muitos childrens e fazer handling de eventos ao mesmo tempo!
  25. None

  26. Precisamos ter o controle! A main thread precisa estar disponível

    para updates prioritários.

  27. section div button return children sibling Fiber

  28. None

  29. Tudo ficou bem… Temos uma história feliz, mas então..

  30. Tudo complexo O desenvolvimento ficou complexo e nada divertido :(

    Complexidade instrumentar VS Complexidade inerente

  31. Virtual DOM Data-binding baseado em observers Wrapper

  32. Data-binding baseado em observers Wrapper /Compiler

  33. Apesar de tudo.. Todos são ótimos pra entregar o que

    você quer fazer e é importante saber os internos pra resolver os problemas.

  34. Obrigado! igorluiz.me/talks - @IgorHalfeld