【参加レポ】TSKaigi に参加したら TypeScript がもっと好きになった

# はじめに

TSKaigi にオフライン参加してきました！とても楽しかったです！

TSKaigi は 5/11 に開催された、 日本最大級の TypeScript のカンファレンスです！

https://tskaigi.org/

この記事では、僕が聴講したセッションの紹介をします！

# 聴講したセッションの紹介

それぞれ公式サイトへのリンクとセッションの概要・感想を書いていきます！（敬称略）

## Keynote: What's New in TypeScript by Daniel Rosenwasser

リンク: [Keynote: What's New in TypeScript](https://tskaigi.org/talks/drosenwasser)

最初に聴講したセッションは、TypeScript の Product Manager である Daniel Rosenwasser さんによる基調講演です。

TypeScript 5.4 や 5.5 の新機能を VSCode で実演しながら紹介していただきました。

ユーティリティ型の `NoInfer` で型推論を制限する機能や、JSDoc内で `@typedef` を使って import した型を使える機能など、さまざまな新機能を実演も交えての紹介だったので、英語でしたがとてもわかりやすかったです。

以下記事に紹介していただいた機能などを含む 5.5 beta の新機能がまとまっています。

https://devblogs.microsoft.com/typescript/announcing-typescript-5-5-beta/

また、最近話題のかわいいロゴについて言及もされていました。

https://twitter.com/meso/status/1789110449306546350

さわらつきさん ([X: `@sawaratsuki1004`](https://twitter.com/sawaratsuki1004)) がデザインしたロゴはこちらからダウンロードできます！

https://github.com/SAWARATSUKI/KawaiiLogos

## TypeScript ASTを利用したコードジェネレーターの実装入門 by Himenon

リンク: [TypeScript ASTを利用したコードジェネレーターの実装入門](https://tskaigi.org/talks/Himenon)

<script async class="docswell-embed" src="https://www.docswell.com/assets/libs/docswell-embed/docswell-embed.min.js" data-src="https://www.docswell.com/slide/K382Y1/embed" data-aspect="0.5625"></script><div class="docswell-link"><a href="https://www.docswell.com/s/hireroo/K382Y1-tskaigi-2024-05-11-11-30">TSKaigi 2024 TypeScript ASTを利用したコードジェネレーターの実装入門 by @hireroo</a></div>

TypeScript の AST 入門から始まり、コードジェネレーターの実装方法まで丁寧に紹介していただきました。

これまで TypeScript の AST を触ったことがない人でもわかりやすい入門的な話だけでなく、コードジェネレータを開発してきた経験から得られた実践に役立つノウハウの紹介までされていて、これからコードジェネレーターを開発する方にとって役立つ内容となっていました。

サンプルコードも以下に公開されています。

https://github.com/Himenon/tskaigi-2024-code-sample

僕はまだ TypeScript の AST は触ったことがないですが、今後何か作ってみたいと思いました！

## TypeScriptと型のパフォーマンス by ypresto

リンク: [TypeScriptと型のパフォーマンス](https://tskaigi.org/talks/ypresto)

<script defer class="speakerdeck-embed" data-id="6c125c4a957641a5a066eca590c16eb4" data-ratio="1.7777777777777777" src="//speakerdeck.com/assets/embed.js"></script>

型のパフォーマンスに関するセッションでした。

TypeScript の型では、 Type Instantiation という型パラメータを確定させるための計算が必要で、エディタなど入力のたびに型を再計算する必要がある場合など、Type Instantiationの回数による影響を受けるという説明から始まり、「どんな時にType Instantiationの回数が増えるか」という例と、「それをどうやってデバッグして修正するか」について紹介していただきました。

TypeScript 5系だとそこまで遅くないらしく、僕も普段は型のパフォーマンスを気にしたことがなかったですが、 重くなってしまう場面に遭遇したら活用していきたいです！

## 複雑なビジネスルールに挑む：正確性と効率性を両立するfp-tsのチーム活用術 by kosui

リンク: [複雑なビジネスルールに挑む：正確性と効率性を両立するfp-tsのチーム活用術](https://tskaigi.org/talks/kosui_me)

<script defer class="speakerdeck-embed" data-id="7ecb46cbf59644968875bbac8b907a60" data-ratio="1.7740440324449593" src="//speakerdeck.com/assets/embed.js"></script>

Excelで一括入稿する際のエラーがつらい、という状況を解決するべく、 TypeScript で表形式データの検証を行う際に、`fp-ts` でエラーをうまく集約して解決した、という発表をしていただきました。

`fp-ts` は、TypeScript で関数型プログラミングを行うためのライブラリです。

https://gcanti.github.io/fp-ts/

`Either` 型と `pipe` を使って関数型で書くことで、分岐なども不要で少ない行数で表現できるので、素敵だと思いました。

また、　`fp-ts` をチームで採用する際の学習コストなどの課題や、どのように導入していくとよいかなども紹介されていて、個人的に `fp-ts` をチームで使いたいと思っている僕にとって、とても役立つセッションでした！

## Step by Stepで学ぶ、ADT(代数的データ型)、モナドからEffect-TSまで by 竹下義晃(takezoux2)

リンク: [Step by Stepで学ぶ、ADT(代数的データ型)、モナドからEffect-TSまで](https://tskaigi.org/talks/takezoux2)

<script defer class="speakerdeck-embed" data-id="82a6a832046e4bbfb51cd0a9a2343240" data-ratio="1.7772511848341233" src="//speakerdeck.com/assets/embed.js"></script>

こちらも関数型のセッションです！

成功や失敗といった情報をEither型で表現し、pipe で操作することで if や try を減らして宣言的に記述できる、といった内容です。代数的データ型の入門から、Monad Transformer や Effect の紹介など、とても幅広い内容でした。

特に、僕は Haskell でモナドをさわっていたことがあるので、この発表を聞いて TypeScript でもモナドを活用してみたいと思いました！

## TypeScriptとGraphQLで実現する型安全なAPI実装 by Kazuhito Hokamura

リンク: [TypeScriptとGraphQLで実現する型安全なAPI実装](https://tskaigi.org/talks/hokaccha)

<script defer class="speakerdeck-embed" data-id="a12c4b507c2b418686d50b5f9d2576f4" data-ratio="1.7777777777777777" src="//speakerdeck.com/assets/embed.js"></script>

https://zenn.dev/hokaccha/articles/6415a5deee6e18

TypeScript で GraphQL を扱う際の型に関する発表でした！

クライアント側でクエリから型を生成したり、Fragment Colocation や　Fragment Maskingで必要な分だけ取得して必要としたフィールドのみ扱えるようにする方法の紹介がありました。

また、バックエンド側のGraphQLの実装の話もありました。GraphQL はクエリで要求されたフィールドのみを返せば良いため、Resolverの実装は不要なフィールドを計算しないようにする必要があり、mapperを書いて解決する必要があるようです。

僕は GraphQL のバックエンド側を TypeScript で書いたことがなかったので、とても興味深い話でした！

## ｽﾀｯｸﾁｬﾝ -TypeScriptで動くオープンソースロボット- by ししかわ

リンク: [ｽﾀｯｸﾁｬﾝ -TypeScriptで動くオープンソースロボット-](https://tskaigi.org/talks/meganetaaan)

https://meganetaaan.github.io/slides-tskaigi2024/

なんと、TypeScript で ハードウェア の開発をする話です！

ｽﾀｯｸﾁｬﾝは [M5Stack](https://m5stack.com/) というマイコンが組み込まれた、TypeScirpt で開発ができるコミュニケーションロボットです！

https://github.com/stack-chan/stack-chan

仕様やコミュニティがすべてオープンで、「だれもがユーザーであり、同時に開発者である」を実現しています。

開発は Moddable SDK というプラットフォームで開発して、最新のEcmaScriptが動く `XS` というJSエンジンで動かすことができるようです。

https://moddable.com/

TypeScript にはあまりハードウェアのイメージはありませんでしたが、今回の TSKaigi ではこのセッション以外にもハードウェアのセッションがあり、まだまだ僕の知らない世界があることを知る良い機会だと思いました！

# おわりに

TypeScript の型の話やハードウェアを TypeScript で開発した話、関数型プログラミングの話など、興味深いセッションが多くとても楽しい1日を過ごすことができました！見られなかったセッションやLTの中にも面白いものがまだまだたくさんありそうなので、発表資料を探してみようと思います！

セッション以外にもスポンサーブースでは各企業がさまざまな企画を行なっていたり、素敵なノベルティをいただいたり、とても楽しかったです！

懇親会には僕は不参加でしたが、とても楽しそうな雰囲気がXで漂っていました！

https://twitter.com/tskaigi/status/1789250460031094894

来年もあれば、ぜひ参加したいです！