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
A DIY Guide To Building Your Own Rendering Engi...
Search
Francesco Strazzullo
May 09, 2019
Programming
0
430
A DIY Guide To Building Your Own Rendering Engine - JsDay Verona 2019
Francesco Strazzullo
May 09, 2019
Tweet
Share
More Decks by Francesco Strazzullo
See All by Francesco Strazzullo
Strategic Testing Decisions - Build Stuff 2021
francescostrazzullo
0
85
Contract-Driven_Development.pdf
francescostrazzullo
0
600
Domain-Driven Frontend
francescostrazzullo
0
2k
Strategic Testing Decisions
francescostrazzullo
0
350
A DIY Guide To Building Your Own Rendering Engine - CityJS2021
francescostrazzullo
2
94
Technical Decision-making Anti-patterns - Avanscoperta Meetup 2021
francescostrazzullo
0
420
How to Choose Your Next Technology Stack
francescostrazzullo
0
1.6k
The Definition of Framework
francescostrazzullo
1
1.6k
How to Choose Your Next Technology Stack
francescostrazzullo
1
260
Other Decks in Programming
See All in Programming
品質ワークショップをやってみた
nealle
0
630
O Que É e Como Funciona o PHP-FPM?
marcelgsantos
0
200
Software Architecture
hschwentner
6
2.3k
GC25 Recap: The Code You Reviewed is Not the Code You Built / #newt_gophercon_tour
mazrean
0
110
フロントエンド開発のためのブラウザ組み込みAI入門
masashi
7
3.5k
SwiftDataを使って10万件のデータを読み書きする
akidon0000
0
240
CSC305 Lecture 08
javiergs
PRO
0
280
スマホから Youtube Shortsを見られないようにする
lemolatoon
27
34k
20251016_Rails News ~Rails 8.1の足音を聴く~
morimorihoge
3
730
コードとあなたと私の距離 / The Distance Between Code, You, and I
hiro_y
0
190
登壇は dynamic! な営みである / speech is dynamic
da1chi
0
360
EMこそClaude Codeでコード調査しよう
shibayu36
0
420
Featured
See All Featured
Product Roadmaps are Hard
iamctodd
PRO
55
11k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
10
890
Embracing the Ebb and Flow
colly
88
4.9k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
GraphQLとの向き合い方2022年版
quramy
49
14k
How STYLIGHT went responsive
nonsquared
100
5.9k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
658
61k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Optimising Largest Contentful Paint
csswizardry
37
3.5k
The World Runs on Bad Software
bkeepers
PRO
72
11k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
Practical Orchestrator
shlominoach
190
11k
Transcript
A DIY Guide To Building Your Own Rendering Engine
Francesco Strazzullo (AKA Strazz) @TheStrazz86 (Follow me on Twitter!) Ego
Slide
WE DEVELOP DIGITAL PROJECT TOGETHER WITH YOU.
Start With Why
Why should you learn to build a Rendering Engine?
Let me tell you a story...
None
Some years ago, we had to create a new front-end
application on top of an old Java Framework...
None
We couldn’t add new dependencies...
None
The only available libraries were jQuery and underscore
None
We delivered the project, but our team was unhappy
Photo by George Bonev on Unsplash
Microwave spaghetti bolognese by BBC Food
We panicked
“Never Manipulate the DOM” Every JavaScript Developer
Manipulating DOM is hard
None
Manipulating DOM is important for a frontend developer
We should be able to “own” rendering code
None
Principles
Choose a simple Architecture
None
YAGNI (You aren't gonna need it)
“Premature optimization is the root of all evil” Donald Knuth
Performance is UX
None
stats.js http://mrdoob.github.io/stats.js/
None
Eat The Frog
https://github.com/francesco-strazzullo/jdsay-talk-2019
What's next?
Event Handlers
Web Components
What I learned
Manipulating DOM is (not so) hard
A custom Rendering Engine can live in harmony with frameworks
It’s not a black or white solution
How to decide if it’s a good solution?
To be continued... https://medium.com/@TheStrazz86/framework-compass-chart-d3851c25b45d
One last thing...
https://www.apress.com/it/book/9781484249666
http://frameworklessmovement.org/
Thanks! Francesco Strazzullo
[email protected]