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
0
160
Svelte 如何編譯程式碼(1)
Kalan
October 02, 2020
Tweet
Share
More Decks by Kalan
See All by Kalan
單頁式應用中的無障礙設計
kjj6198
0
750
選擇 Svelte 的三個理由 - JSDC
kjj6198
0
300
Svelte - 如何在前端框架中脫穎而出 | ModernWeb'21
kjj6198
0
150
状態管理を楽にする道
kjj6198
1
320
Day25. 如何解析 HTML 語法
kjj6198
0
130
Day24. Svelte 如何編譯程式碼(2)
kjj6198
0
170
Day22. Svelte 經驗談
kjj6198
0
140
Day18. UI 實戰篇 - 圖片檢視器
kjj6198
0
130
Day17. UI 實戰篇 - 音樂播放器
kjj6198
0
51
Other Decks in Programming
See All in Programming
103 Early Hints
sugi_0000
1
230
採用事例の少ないSvelteを選んだ理由と それを正解にするためにやっていること
oekazuma
2
1k
SymfonyCon Vienna 2025: Twig, still relevant in 2025?
fabpot
3
1.2k
「Chatwork」Android版アプリを 支える単体テストの現在
okuzawats
0
180
php-conference-japan-2024
tasuku43
0
320
tidymodelsによるtidyな生存時間解析 / Japan.R2024
dropout009
1
790
ドメインイベント増えすぎ問題
h0r15h0
2
360
アクターシステムに頼らずEvent Sourcingする方法について
j5ik2o
4
290
開発者とQAの越境で自動テストが増える開発プロセスを実現する
92thunder
1
190
これでLambdaが不要に?!Step FunctionsのJSONata対応について
iwatatomoya
2
3.7k
創造的活動から切り拓く新たなキャリア 好きから始めてみる夜勤オペレーターからSREへの転身
yjszk
1
130
fs2-io を試してたらバグを見つけて直した話
chencmd
0
240
Featured
See All Featured
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
44
9.3k
Bootstrapping a Software Product
garrettdimon
PRO
305
110k
Facilitating Awesome Meetings
lara
50
6.1k
Documentation Writing (for coders)
carmenintech
66
4.5k
Agile that works and the tools we love
rasmusluckow
328
21k
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
28
2.1k
YesSQL, Process and Tooling at Scale
rocio
169
14k
The Cult of Friendly URLs
andyhume
78
6.1k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
Producing Creativity
orderedlist
PRO
341
39k
Bash Introduction
62gerente
608
210k
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)⽣成 等等可以在編譯時期完成的事情