Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

SWC Transformerから見るTypeScript関数記述ベストプラクティス

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Kaito Fujimura Kaito Fujimura
May 11, 2024
Technology
590
1

SWC Transformerから見るTypeScript関数記述ベストプラクティス

Avatar for Kaito Fujimura

Kaito Fujimura

May 11, 2024

More Decks by Kaito Fujimura

See All by Kaito Fujimura
iPhone Eye Tracking機能から学ぶやさしいアクセシビリティ
Avatar for Kaito Fujimura fujiyamaorange
0
1.1k

Other Decks in Technology

See All in Technology
Sigmaで作る業務アプリ
Avatar for kazushiro_honma kazushiro_honma
0
140
2026-09-10 【Snowflake World Tour Tokyo 2026】dbt Core と Snowflake で実現する多層的なデータガバナンス / Multi-Layered Data Governance Powered by dbt Core and Snowflake
Avatar for civitaspo civitaspo
0
390
現場で役立つ技術負債の効果的な返済方法
Avatar for 増田 亨 masuda220
PRO
6
2.1k
30座EKS, 180次升級淬煉的EKS Upgrade Skill 的歷程
Avatar for Eric eric8230
0
130
空間オーディオで過去の 自分（ゴースト）と競うランニング 〜HealthKitのルートを足音に変える実装〜
Avatar for Nao-RandD nao_randd
0
170
2026_devsumi_ozono.pdf
Avatar for O3(ozono) o3
3
480
技術的負債から考える、AI時代のエンジニアリング投資 — ビズリーチの技術的負債と向き合った経験から、変更し続けられるソフトウェアを考える/ technical-debt-con2026
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
2
1.5k
OpenTelemetryのメトリクスをCloudWatchに送ってPromQLで見てみた
Avatar for Itaru Ota ota1022
0
150
アプリログインとWeb認証基盤をつなぐ ASWebAuthenticationSession 作法
Avatar for Go Takagi shimastripe
1
310
AI時代、データエンジニアが一番おもろい
Avatar for ゲンシュン genshun9
0
550
日経電子版を支えていく Kasane Design System/fec_fukuoka
Avatar for 日本経済新聞社 エンジニア採用事務局 nikkei_engineer_recruiting
0
1.4k
すぐできる衛星通信対応 あとは山奥に行くだけ
Avatar for tatetate55 tatetate55
0
120

Featured

See All Featured
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
281
24k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
19k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.8k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
3.2k
What the history of the web can teach us about the future of AI
Avatar for Ines Montani inesmontani
PRO
1
690
KATA
Avatar for Megan Lloyd mclloyd
PRO
35
15k
Agile Actions for Facilitating Distributed Teams - ADO2019
Avatar for Mark Kilby mkilby
0
280
Getting science done with accelerated Python computing platforms
Avatar for Jacob Tomlinson jacobtomlinson
2
480
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
300
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
Avatar for UX Y'all uxyall
1
400
Navigating the moral maze — ethical principles for Al-driven product design
Avatar for Skipper Chong Warson skipperchong
2
540

Transcript

  1. SWC Transformer TypeScript TSKaigi 2024 @fujiyamaorange

  2. Pay / Biome Utility Types Pick Pay for Business fujiyamaorange

  3. TypeScript SWC Transform emit

  4. None
  5. None

  6. Function Expression Arrow Function Function Declaration

  7. None

  8. SWC Transformer

  9. TypeScript SWC Transform emit

  10. SWC ~Speedy Web Compiler~ Next.js 12 Rust Babel 17 Rust

    SWC (TypeScript Babel )

  11. SWC Transformer

  12. React 3 ※React =JSX alt data-testid

  13. Before After

  14. Before After alt

  15. Before After data-testid

  16. None

  17. TypeScript SWC Transform emit

  18. 20.93s 22.78s 22.59s Transform 12000 React cargo test --example --

    --test-threads=1 Transform

  19. SWC Transformer

  20. I/O

  21. 20.93s 22.78s 22.59s 17.70s 19.56s 19.31s (Transform) 3.23s 3.22s 3.28s

    Transform

  22. Transform ( )

  23. Transform

  24. Transform SWC fork SWC create

  25. Transform SWC fork SWC create

  26. ( ) parse 919.22ms 959.42ms 929.58ms 931.66ms transform 56.26ms 61.25ms

    58.77ms 15.72ms emit 8.75s 9.70s 9.56s 7.22s all 20.93s 22.78s 22.59s 17.70s ※

  27. TypeScript SWC Transform emit

  28. emit e.#mtd_name(self) mtd_name SWC AST Node SWC 200 AST Node

    ( : →FnDecl)

  29. FnDecl AST emit!

  30. emit AST Node AST emit

  31. None

  32. TypeScript SWC Transform emit

  33. None

  34. TypeScript (function) (function expression) (Arrow function expressions) SWC SWC Next.js

    Compiler Trait swc_ecma_visit::VisitMut TSKaigi Canva ~Gray Purple Isometric Elements & Mockups 5G Technology Technology Presentation~ carbon