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
250
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Svelte 如何編譯程式碼(1)
Kalan
October 02, 2020
More Decks by Kalan
See All by Kalan
單頁式應用中的無障礙設計
kjj6198
0
830
選擇 Svelte 的三個理由 - JSDC
kjj6198
0
430
Svelte - 如何在前端框架中脫穎而出 | ModernWeb'21
kjj6198
0
230
状態管理を楽にする道
kjj6198
1
440
Day25. 如何解析 HTML 語法
kjj6198
0
190
Day24. Svelte 如何編譯程式碼(2)
kjj6198
0
240
Day22. Svelte 經驗談
kjj6198
0
230
Day18. UI 實戰篇 - 圖片檢視器
kjj6198
0
210
Day17. UI 實戰篇 - 音樂播放器
kjj6198
0
110
Other Decks in Programming
See All in Programming
Claude CodeとAgentCore Gatewayを繋ぐ際の認証認可 / Authentication and authorization when connecting Claude Code with AgentCore Gateway
har1101
2
420
業務時間外もAIに働いてもらう話
colorful12
3
9.8k
T3DD26: From RAGs to Riches
martinhelmich
0
130
My Marp Sample
sinoue0108
0
140
【QA Test Talk Vol.8】AI-DLC による Whole Team Approach の加速
pkshadeck
PRO
0
270
Claude Codeを組織的に動かして月400PRを実現した話
happy_ryo
0
240
新人はどこまで自力でやり、どこからAIに頼るべきか/エンジニア育成に向き合う_先輩たちの悩みと知見共有会
toppan_digital_dev
1
460
自動化したのに回らない テスト運用の壁―AI時代の品質責任と生産性
mfunaki
0
570
MySQLとPostgreSQLって何が違うの?
akagami
0
160
PyO3 で既存 Python 評価器を Rust core 化する ー wasm-bindgen でブラウザにも配るための設計
kdash
1
190
Oxlintはいいぞ(続)
yug1224
1
520
typoなんかねぇよ
raspython3
0
640
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
19k
Design in an AI World
tapps
1
300
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3.7k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
590
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
410
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.8k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Abbi's Birthday
coloredviolet
3
9.7k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
680
sira's awesome portfolio website redesign presentation
elsirapls
0
380
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6.1k
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)⽣成 等等可以在編譯時期完成的事情