こんにちは、マイクです！今日は2025年6月2日、曜日は火曜日です。さて、今日も皆さんにZennからのトレンド記事を紹介していきますよ！

前回紹介した記事は、Rustでサーバーいらずのオンラインゲームを作る方法や、UnityとReSharperを使った環境構築、さらにClaude Codeのスラッシュコマンドについてでした。これらの内容を踏まえつつ、今日は新たな記事をお届けしますね。

それでは、今日紹介する記事は全部で5本です！早速、最初の内容に入っていきましょう！

1つ目の記事は「TS で Effect System を作ってみた」です。こちらの記事では、TypeScriptでエフェクトシステムを構築した内容について詳しく解説しています。このシステムは、プログラムの実行を`AsyncGenerator<Effect>`または`Generator<Effect>`の形で表現するもので、エフェクトの宣言とそれに対応するハンドラを注入する仕組みが特徴です。

具体的には、`defineEffect`を用いてエフェクトを定義し、`performAsync`や`perform`を使ってプログラムを実行する方法が紹介されています。型によってエフェクトが明示的に定義されるため、どのエフェクトが使われるかが静的にわかるのが大きな利点です。実行時にハンドラの同期または非同期を選べるので、プログラムの一部を同期的にテストすることも可能です。

また、型による副作用の記述が強制されるため、エフェクトの実行が明確になります。ただし、実行時にはその制約を無視してエフェクトを発行できる場合があるため、型システムの限界も指摘されています。今後はTypeScriptの型システムを駆使したさらなる実装が期待されています。

。...。

2つ目の記事は「ECMAScript source phase imports がはやく動くようになってほしい」です。この内容は、Node.js 24.0.0から利用可能になったECMAScriptのsource phase imports機能についての解説です。この機能を使うことで、WebAssemblyのモジュールを直接インポートし、リンク前のASTを取得できるようになります。

これにより、従来のWebAssemblyの読み込み方式の移植性が解消され、標準化された構文でソースコードを取得できるのが大きなメリットです。また、環境ごとに異なるコードが必要だった問題も解決されることが期待されています。さらに、ウェブ環境の安全性を高めるために、ランタイム環境が読み取りやコンパイルの操作を代理して実行できるようになります。

ただし、この機能が普及するにはTypeScriptコンパイラやトランスパイラ、バンドラーのサポートが不可欠です。現時点でStage 3に進んでいるため、今後の普及に期待が寄せられています。

。...。

3つ目の記事は「Claude Codeの使用料金を可視化するCLIツール「ccusage」を作った」です。このツールは、Claude Codeの使用状況とコストを可視化するためのCLIツールで、開発者のryoppippi氏が作成しました。

ccusageは、月額$100のMaxプランを利用しながら、従量課金だった場合のコストを知りたいというニーズから生まれたものです。このツールはインストール不要で、即実行が可能です。日別レポートやセッション別レポート、期間フィルタリング機能などが特徴で、特にプロジェクトやセッションごとの使用量を確認できるのが便利ですね。

Claude Codeの使用履歴をJSONL形式で保存しているため、ccusageはこれを読み込んでデータを集計します。コストは使用履歴内の`costUSD`を集計することで計算され、モデルの種類ごとのトークン単価を参照する必要がなくなります。興味のあるエンジニアはぜひ試してみてくださいね。

。...。

4つ目の記事は「【Obsidian × Whisper】アイデアを逃さずにメモする方法」です。東京大学の川田氏が、Obsidianを活用した音声メモの記録方法を紹介しています。「Thino」プラグインを使用することで、思いついたアイデアを直接デイリーノートに記録できるようになりました。

さらに、OpenAIの音声認識モデルWhisperを組み合わせることで、録音から文字起こし、Obsidianへの書き込みを自動化する手順が解説されています。特定のショートカットキーを押すことで録音が開始され、放すと文字起こしが行われ、最終的にObsidianに記録される仕組みです。

このシステムを導入することで、エンジニアは手軽にアイデアを録音し、文字起こしし、ノートに追記できるため、作業効率の向上が期待されます。詳細な設定手順やサンプルスクリプトも紹介されており、カスタマイズの幅広さが強調されています。

。...。

5つ目の記事は「Streaming UIプラクティス」です。アプリケーションのパフォーマンスは、定量的な指標だけでなく、ユーザー体験によっても評価されます。GoogleのCore Web Vitalsは重要ですが、UX全般の最適化も必要です。

Streaming UIは、UI要素を段階的に読み込むことで、ユーザーの待ち時間を短縮し、快適な体験を提供するテクニックです。早期のレイアウト表示や動的UI要素の並行読み込み、ローダーやスケルトンUIの表示を適切に使い分けることが重要です。また、Fade-inアニメーションを活用して、表示の唐突感を抑えることもポイントです。

パフォーマンスはユーザーにとって重要な品質であり、定量的指標とUXの工夫で向上させることが求められます。今後もこの分野での改善が期待されています。

さて、今日はこれら5本の記事をお届けしましたね。内容についてはショーノートにも詳しく書いてありますので、ぜひチェックしてみてください。そして、番組の感想もどんどんお寄せくださいね！次回またお会いできるのを楽しみにしています。それでは、またね！