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
Svelte 如何編譯程式碼(1)
Search
Kalan
October 02, 2020
Programming
240
0
Share
Svelte 如何編譯程式碼(1)
Kalan
October 02, 2020
More Decks by Kalan
See All by Kalan
單頁式應用中的無障礙設計
kjj6198
0
820
選擇 Svelte 的三個理由 - JSDC
kjj6198
0
400
Svelte - 如何在前端框架中脫穎而出 | ModernWeb'21
kjj6198
0
220
状態管理を楽にする道
kjj6198
1
430
Day25. 如何解析 HTML 語法
kjj6198
0
180
Day24. Svelte 如何編譯程式碼(2)
kjj6198
0
230
Day22. Svelte 經驗談
kjj6198
0
210
Day18. UI 實戰篇 - 圖片檢視器
kjj6198
0
200
Day17. UI 實戰篇 - 音樂播放器
kjj6198
0
110
Other Decks in Programming
See All in Programming
RailsTokyo 2026#4: AI様があれば、 Hotwireの弱点は消えるか?
naofumi
5
990
運用エージェントは "作る" から "育てる" へ - 記憶と自己進化の3層設計パターン / self-evolving-agents-three-layer-agent-design
gawa
12
3.1k
生成AI時代にこそ効くGo | Why Go Works in the Age of Generative AI
mom0tomo
7
2.8k
Spec-Driven Development with AI-Agents: From High-Level Requirements to Working Software
antonarhipov
2
370
AI 時代のソフトウェア設計の学び方
masuda220
PRO
28
10k
Copilot CLI の継戦能力を高める コンテキスト管理
nozomutu
1
1.1k
These Five Tricks Can Make Your Apps Greener, Cheaper, & Nicer
hollycummins
0
220
サーバーレスで作る、動画データ管理基盤
oyasumipants
0
290
AIエージェントと協働するCLI開発 — BunとOpenClawで学んだこと
yoshikouki
1
220
関係性から理解する"同一性"の型用語たち
pvcresin
2
580
バックエンドにElysiaJSを採用して気付いた、良い点・悪い点
wanko_it
1
180
RTSPクライアントを自作してみた話
simotin13
0
260
Featured
See All Featured
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
2.9k
Building the Perfect Custom Keyboard
takai
2
770
Making the Leap to Tech Lead
cromwellryan
135
9.8k
The Art of Programming - Codeland 2020
erikaheidi
57
14k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
170
Joys of Absence: A Defence of Solitary Play
codingconduct
1
380
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.3k
What's in a price? How to price your products and services
michaelherold
247
13k
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
710
How to Ace a Technical Interview
jacobian
281
24k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Transcript
第 12 屆 IT 鐵⼈賽 30 天從 0 到 1
學 Svelte Day23 - 進階篇:Svelte 如何編譯?
第 12 屆 IT 鐵⼈賽 Svelte 編譯流程 {#if} {#each} {#await}
等另外處理 html 語法解析 遇到 { } 內的表達式 ⽤ acron 解析 css (<style> 裡頭) 使⽤ css-tree 產⽣語法樹 AST 產⽣語法樹 <script> 裡頭 使⽤ acron 分析並產⽣語法樹 AST
第 12 屆 IT 鐵⼈賽 語法樹完成! 主要會產⽣三個語法樹,CSS、HTML、instance CSS HTML instance
第 12 屆 IT 鐵⼈賽 準備編譯 a11y 檢查、變數宣告檢查、選擇器檢查、依賴(dependency)⽣成 等等可以在編譯時期完成的事情