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
houdini drafts
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
julian7454
August 19, 2016
Technology
0
64
houdini drafts
julian7454
August 19, 2016
Tweet
Share
More Decks by julian7454
See All by julian7454
Vue testing library - avoriaz
julian7454
0
76
Vue 2.0 開發環境 - 以 webpack2 建立
julian7454
0
77
PostCSS 與 cssnext
julian7454
0
99
javascript品質檢測工具 - ESLint
julian7454
0
170
Other Decks in Technology
See All in Technology
セキュリティについて学ぶ会 / 2026 01 25 Takamatsu WordPress Meetup
rocketmartue
1
300
Context Engineeringの取り組み
nutslove
0
340
データの整合性を保ちたいだけなんだ
shoheimitani
8
3.1k
Claude_CodeでSEOを最適化する_AI_Ops_Community_Vol.2__マーケティングx_AIはここまで進化した.pdf
riku_423
2
560
こんなところでも(地味に)活躍するImage Modeさんを知ってるかい?- Image Mode for OpenShift -
tsukaman
0
130
AzureでのIaC - Bicep? Terraform? それ早く言ってよ会議
torumakabe
1
530
20260204_Midosuji_Tech
takuyay0ne
1
150
顧客の言葉を、そのまま信じない勇気
yamatai1212
1
350
AIと新時代を切り拓く。これからのSREとメルカリIBISの挑戦
0gm
0
900
Oracle Cloud Observability and Management Platform - OCI 運用監視サービス概要 -
oracle4engineer
PRO
2
14k
レガシー共有バッチ基盤への挑戦 - SREドリブンなリアーキテクチャリングの取り組み
tatsukoni
0
210
仕様書駆動AI開発の実践: Issue→Skill→PRテンプレで 再現性を作る
knishioka
2
640
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
85
9.4k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.8k
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.3k
Bash Introduction
62gerente
615
210k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.6k
The Invisible Side of Design
smashingmag
302
51k
What the history of the web can teach us about the future of AI
inesmontani
PRO
1
430
The Pragmatic Product Professional
lauravandoore
37
7.1k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
24k
Claude Code のすすめ
schroneko
67
210k
Statistics for Hackers
jakevdp
799
230k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
0
1.9k
Transcript
墋Օ CSS-Houdini-Drafts PIXNET F2E Julian LIFE 䨝捍ਰ
手瑽薹究㺔氂 • CSS 膏倵薩瑊ፘ㺔氂 • CSSnext 婘Ꭸԧ碝ी粬蝰๗牧֕㪔篷ဩ䋿匍ಅ磪 粬
CSS Polyfills? • ۗ javascript ጱ妿涢 • 硬臑 CSSOMጱ蟂獤
狕硬倵薩瑊獉蟂ጱ RENDERING ENGINE牫 • 翄Ӟ倵薩瑊䰬ୗጱ犋ݶᤈ傶砺֢ DOM ጱ硳胼㺔氂 • javascript framework
ጱֺৼ
Houdini 匍褩ྦྷ磪Ջ讕ۑ胼ྋࣁ樄咳牫 • CSS Parser API • Properties and Values
• CSS Typed OM • CSS Layout API • CSS Paint API • Scrolling and Animation
Houdini 匍褩ྦྷ磪Ջ讕ۑ胼ྋࣁ樄咳牫 • CSS Parser API • Properties and Values
• CSS Typed OM • CSS Layout API • CSS Paint API • Scrolling and Animation
Worklets • worklet script • 犋ݶጱ褩ྦྷ䁆ᤈ Javascript 纷ୗ嘨 • ֵአ
ES2015 ጱ class ਧ嬝۱珀ොဩጱ褸ݳ
Properties and Values • ᛔਧ嬝痀 • ے獈ࣳ獨 • https://drafts.css-houdini.org/css-properties- values-api-1/
Properties and Values
Properties and Values
CSS Layout API • ᛔਧ嬝 display 痀
CSS Layout API
CSS Layout API
CSS Paint API • registerPaint ොဩ牐樄咳ᘏݢ犥ࣁ CSS Ӿֵአ paint() 獢ୗ牧蝚螂㯽獈ጱݷ圸叨ኞӞ㮆
CSS 瑽粙
CSS Paint API
CSS Paint API
CSS Paint API
Scrolling and Animation • ඪൔ狕硬Ӟ犚 DOM ጱ痀牐蝚螂蝡圵ොୗ疰ݢ犥ݝ ๅ碝粬ਧ痀牧ᘒ犋ฎ獊蟂᯿碝 render牐
Scrolling and Animation
Scrolling and Animation
㷢ᘍ虻碘 • https://www.smashingmagazine.com/2016/03/houdini- maybe-the-most-exciting-development-in-css-youve- never-heard-of/#comment-1288360 • https://github.com/GoogleChrome/houdini-samples • https://github.com/w3c/css-houdini-drafts •
https://speakerdeck.com/ryanseddon/houdini • https://speakerdeck.com/surma/houdini-demystifying-css • http://www.w3ctech.com/topic/1816