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

A DIY Guide To Building Your Own Rendering Engi...

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Francesco Strazzullo Francesco Strazzullo
May 09, 2019
Programming
460
0

A DIY Guide To Building Your Own Rendering Engine - JsDay Verona 2019

Avatar for Francesco Strazzullo

Francesco Strazzullo

May 09, 2019

More Decks by Francesco Strazzullo

See All by Francesco Strazzullo
Strategic Testing Decisions - Build Stuff 2021
Avatar for Francesco Strazzullo francescostrazzullo
0
100
Contract-Driven_Development.pdf
Avatar for Francesco Strazzullo francescostrazzullo
0
620
Domain-Driven Frontend
Avatar for Francesco Strazzullo francescostrazzullo
0
2k
Strategic Testing Decisions
Avatar for Francesco Strazzullo francescostrazzullo
0
370
A DIY Guide To Building Your Own Rendering Engine - CityJS2021
Avatar for Francesco Strazzullo francescostrazzullo
2
120
Technical Decision-making Anti-patterns - Avanscoperta Meetup 2021
Avatar for Francesco Strazzullo francescostrazzullo
0
440
How to Choose Your Next Technology Stack
Avatar for Francesco Strazzullo francescostrazzullo
0
1.6k
The Definition of Framework
Avatar for Francesco Strazzullo francescostrazzullo
1
1.6k
How to Choose Your Next Technology Stack
Avatar for Francesco Strazzullo francescostrazzullo
1
290

Other Decks in Programming

See All in Programming
Oxlintとeslint-plugin-react-hooks 明日から始められそう？
Avatar for t6adev t6adev
0
260
Kubernetes上でAgentを動かすための最新動向と押さえるべき概念まとめ
Avatar for Sota Makino sotamaki0421
3
490
GNU Makeの使い方 / How to use GNU Make
Avatar for kaityo256 kaityo256
PRO
16
5.6k
PHPで TLSのプロトコルを実装してみるをもう一度しゃべりたい
Avatar for higaki higaki_program
0
200
10年分の技術的負債、完済へ ― Claude Code主導のAI駆動開発でスポーツブルを丸ごとリプレイスした話
Avatar for nero15 takuya_houshima
0
2.5k
Laravel Nightwatchの裏側 - Laravel公式Observabilityツールを支える設計と実装
Avatar for Ryuta Hamasaki avosalmon
1
330
YJITとZJITにはイカなる違いがあるのか？
Avatar for yamanao nakiym
0
220
実践CRDT
Avatar for tamadeveloper tamadeveloper
0
560
Liberating Ruby's Parser from Lexer Hacks
Avatar for ydah ydah
2
710
PDI: Como Alavancar Sua Carreira e Seu Negócio
Avatar for Marcel dos Santos marcelgsantos
0
120
Make GenAI Production-Ready with Kubernetes Patterns
Avatar for Bilgin Ibryam bibryam
0
120
Cache-moi si tu peux : patterns et pièges du cache en production - Devoxx France 2026 - Conférence
Avatar for Sébastien LECACHEUR slecache
0
230

Featured

See All Featured
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.3k
Crafting Experiences
Avatar for Bethany Jepchumba bethany
1
110
sira's awesome portfolio website redesign presentation
Avatar for ElsiraPls elsirapls
0
220
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
280
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
360
30k
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
Avatar for AKADEMIYA2063 akademiya2063
PRO
1
94
Navigating Algorithm Shifts & AI Overviews - #SMXNext
Avatar for Aleyda Solis aleyda
1
1.2k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
5k
Claude Code のすすめ
Avatar for schroneko schroneko
67
220k
So, you think you're a good person
Avatar for Per Axbom axbom
PRO
2
2k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
6
1.1k
Exploring anti-patterns in Rails
Avatar for Elle Meredith aemeredith
3
320

Transcript

  1. A DIY Guide To Building Your Own Rendering Engine

  2. Francesco Strazzullo (AKA Strazz) @TheStrazz86 (Follow me on Twitter!) Ego

    Slide

  3. WE DEVELOP DIGITAL PROJECT TOGETHER WITH YOU.

  4. Start With Why

  5. Why should you learn to build a Rendering Engine?

  6. Let me tell you a story...

  7. None

  8. Some years ago, we had to create a new front-end

    application on top of an old Java Framework...
  9. None

  10. We couldn’t add new dependencies...

  11. None

  12. The only available libraries were jQuery and underscore

  13. None

  14. We delivered the project, but our team was unhappy

  15. Photo by George Bonev on Unsplash

  16. Microwave spaghetti bolognese by BBC Food

  17. We panicked

  18. “Never Manipulate the DOM” Every JavaScript Developer

  19. Manipulating DOM is hard

  20. None

  21. Manipulating DOM is important for a frontend developer

  22. We should be able to “own” rendering code

  23. None

  24. Principles

  25. Choose a simple Architecture

  26. None

  27. YAGNI (You aren't gonna need it)

  28. “Premature optimization is the root of all evil” Donald Knuth

  29. Performance is UX

  30. None

  31. stats.js http://mrdoob.github.io/stats.js/

  32. None

  33. Eat The Frog

  34. https://github.com/francesco-strazzullo/jdsay-talk-2019

  35. What's next?

  36. Event Handlers

  37. Web Components

  38. What I learned

  39. Manipulating DOM is (not so) hard

  40. A custom Rendering Engine can live in harmony with frameworks

  41. It’s not a black or white solution

  42. How to decide if it’s a good solution?

  43. To be continued... https://medium.com/@TheStrazz86/framework-compass-chart-d3851c25b45d

  44. One last thing...

  45. https://www.apress.com/it/book/9781484249666

  46. http://frameworklessmovement.org/

  47. Thanks! Francesco Strazzullo [email protected]