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
TypeScriptのコード生成をつらくしないために
Search
Nkowne63
May 11, 2024
800
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
TypeScriptのコード生成をつらくしないために
Nkowne63
May 11, 2024
More Decks by Nkowne63
See All by Nkowne63
2020-11-05-side-effects-composition__1_.pdf
neutron63zf
1
460
vueで中規模以上のフロントエンドを組んでいて 役に立ったtips
neutron63zf
5
3.5k
20200128_nkowne63
neutron63zf
0
48
Vueで「見た目」「振る舞い」を分離してみよう
neutron63zf
0
630
20190523_nkowne63zf_1.pdf
neutron63zf
0
430
「つなぎこみ」を自動化する
neutron63zf
0
530
for文禁止縛り in JS
neutron63zf
0
780
Featured
See All Featured
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
500
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
4
570
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
62k
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
650
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.5k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
490
Code Review Best Practice
trishagee
74
20k
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
3
870
The Curious Case for Waylosing
cassininazir
1
490
Six Lessons from altMBA
skipperchong
29
4.5k
How to Ace a Technical Interview
jacobian
281
24k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
6.1k
Transcript
TypeScriptのコード生成をつ らくしないために ノーン(@nkowne63)
自己紹介 ノーン(@nkowne63) 大学院に通いながら株式会社ventusでエンジニ アをしている。 今日の話は2019年~から開発しているプロダクト で遭遇したコード生成についての話。
コード生成をどういうときに書く? APIやDBといった「TypeScriptの外」とのやりとり 基本的にはライブラリがあるのでそれを使えばよいが...... 今回は「自分たちで実装しなきゃいけなくなった」ときに避けるべきアンチ パターンを1つ紹介する。
処理だけをコード生成 TypeScriptの型推論の能力は割と 優れているので、 処理だけをコード生成しても適切に アノテーションされていれば問題なく 使える → 最初のうちは開発が高速化する が......
処理だけコード生成することのつらさ 生成されたコードがバグっていると 厳しいデバッグが始まる...... 後からより優れたOSSやコード生成 が出てきた時に影響範囲が大きす ぎる → 乗り換えられない!
対策:型をまずは生成して処理は別で書く 型(インターフェース)だけ生成し、 処理を別で書く(or生成する)こと で、速いサイクルで処理を差し替え られるようになる。
対策:型をまずは生成して処理は別で書く 後に良いOSSが出たときに、そちら に段階的に移行する戦略を取りや すい。 具体的な処理はコード生成を用い てもよいし、GenericsやProxyを用 いた動的な実装でもよい。
TSの機能を積極的に使ってless codegenを志向する Template Literal TypesやMapped Types, Conditional Typesなどを用 いることで、生成しなければいけな いものを減らしていき、運用しやす
くすることができる。
まとめ • コード生成される具体的な処理に依存してしまうと、後々差し替え が効かなくなってつらくなる • コード生成を行うときは、処理だけではなく型の生成をして、デバッ グの難易度を下げたり差し替えをしやすくしよう