Slide 1

Slide 1 text

tsgo を触ってみて得た学び かるカン

Slide 2

Slide 2 text

自己紹介 👋 かるカン X (Twitter): @karukan013L23 フロントエンドエンジニア 最近はTypeScript/React を書いてます コーヒーが好き

Slide 3

Slide 3 text

TSKaigi のとあるセッションにて tsgo 、触ってみましたか? ・・・触ってないです

Slide 4

Slide 4 text

というわけで、触ってみた

Slide 5

Slide 5 text

typescript-go とは? TypeScript をGo で実装し直したバージョン Strada: v6 まで(従来のTS ) Corsa: v7 以降(Go 版のTS ) ↑ 今回試したのはCorsa 現在はプレビュー版として一部機能を提供 LSP 既存のts-server からの移行 VSCode 向けに拡張機能が提供 import の補完などまだ一部動作しない リファクタリング機能でAI 統合を検討中 型チェック tsgo --noEmit で型チェックのみ実行 ↑これを試しに触ってみた

Slide 6

Slide 6 text

tsgo 、何が嬉しい? パフォーマンスの向上 Go 移植によるシングルスレッド性能の向上 3.5 faster! 並列化 2.5 〜3 ? faster! コンパイルはesbuild やSWC を使用することで高速化することができるが、型チェックはtsc しかできない 開発体験の改善 特にCI に組み込んでいる場合は、かなり恩恵を得られそう

Slide 7

Slide 7 text

本当か🤔

Slide 8

Slide 8 text

実際に試してみた tsc とtsgo を実行してパフォーマンスを比較してみる # TypeScriptのプレビュー版をインストール npm install -D @typescript/native-preview # tscを実行 # オプションを追加して、型チェックのみ実行・コンパイル関連の情報を出力 npx tsc -p ./src/tsconfig.json --noEmit --extendedDiagnostics # tsgoを実行 # オプションを追加して、型チェックのみ実行・コンパイル関連の情報を出力 npx tsgo -p ./src/tsconfig.json --noEmit --extendedDiagnostics

Slide 9

Slide 9 text

小規模プロジェクト ( ポモドーロタイマー) tsc ts-go 3.14x faster! Files: 789 Lines: 190,287 Total time: 2.23s Files: 789 Lines: 190,287 Total time: 0.710s

Slide 10

Slide 10 text

大規模プロジェクト (VSCode) tsc ts-go 8.47x faster! 💡 大規模プロジェクトほどパフォーマンス改善が顕著 Files: 5,109 Lines: 1,604,791 Check time: 40.36s Total time: 47.22s Files: 5,109 Lines: 1,604,791 Check time: 4.416s Total time: 5.571s

Slide 11

Slide 11 text

大体10x faster!!

Slide 12

Slide 12 text

tsgo を触ってみて 型チェックについては、大方は既に正常に動く状態 ローカルで動かした分にはエラーは発生しなかった いくつかIssue が上がっていた 隙を見て仕事のプロジェクトでも試してみる TypeScript のコンパイラ関連の知見が深まった 型チェック、コンパイラの関連性を改めて整理する機会になった パフォーマンス関連情報を出力できるオプション --extendedDiagnostics 1 次情報に触れることで得られる学び 記事読んで満足するのではなく、自分でも触ってみることで実感が伴った学びになる 関連領域についても調べるので、学習の機会としてもよかった 今後も継続的に情報をキャッチアップしていく

Slide 13

Slide 13 text

typescript-go のリポジトリと公式記事を読んでみよう! 公式記事 https://devblogs.microsoft.com/typescript/typescript-native-port/ https://devblogs.microsoft.com/typescript/announcing-typescript-native-previews/ typescript-go リポジトリ https://github.com/microsoft/typescript-go?tab=readme-ov-file#what-works-so-far README に対応状況が記載されている

Slide 14

Slide 14 text

ありがとうございました ぜひtsgo を触ってみてください!