DenoでOpenTelemetryに入門する

Transcript

1. 2025/03/14 toranoana.deno #20 DenoでOpenTelemetryに 入門する

2. nus3（なすさん） サイボウズ所属 フロントエンド刷新⁨⁩と格闘する日々を過ごして、もうすぐ4年になります

3. はじめに

4. 業務でもプライベートでも Denoを使わせてもろてます

5. Denoの好きなところ U 開発に必要なものがビルトインされているので、
 やりたいことをすぐに始められるとこ% U Linter、Formatter、テスト、型（tsconfig U ロゴが、かあいA U グッズも、かあいい

   2023年のDeno Festでの戦利品たち 余談だけどもGo (Gopherくん) も同じ理由でも好き

6. そんなDenoのv2.2が
 先日リリース

7. https://deno.com/blog/v2.2

8. OpenTelemetry ... 言葉は見たことあるが ナニモワカラン この子はウチのマスコットのハシコウくん

9. ナニモワカランが
 Denoにビルトインされた ということは...

10. Denoの好きなところ  開発に必要なものがビルトインされているので  Linter、Formatter、テスト、型（tsconfig%  ロゴが、かあい8  グッズも、かあいい 、


    やりたいことをすぐに始められるとこu 2023年のDeno Festでの戦利品たち 余談だけどもGo（Gopherくん）も好き

11. Denoをきっかけに OpenTelemetryに 入門できる！！

12. ナニモワカラン状態から DenoでOpenTelemetryを 試してみる

13. Denoのドキュメントにある OpenTelemetryのQuick start をやってみる

14. https://docs.deno.com/runtime/fundamentals/open_telemetry/

15. Quick start H9 Denoで任意のスクリプトを実1 09 DockerでOpenTelemetry用コンテナを起 9 計測結果を確認する

16.  Denoで任意のスクリプトを実行 w 環境変数とフラグを追加して、Denoでの
 OpenTelemetryを有効H w OpenTelemetryを有効化することで、OpenTelemery用の
 エンドポイント（デフォルトはlocalhost:4318）に
 スクリプト実行時に何かしらのデータを送信するように

17.  Denoで任意のスクリプトを実行 my_script.tsは以下のような内S f Deno.serve()でHTTPサーバーを起C f リクエストを受け取ったら、fetch()を実行して
 外部にリクエストを送" f fetch()の返り値をレスポンスとして返す

18.  DockerでOTel用コンテナを起動 grafana/otel-lgtmって
 どんな構成なんじゃろ...?

19.  DockerでOTel用コンテナを起動 https://grafana.com/blog/2024/03/13/an-opentelemetry-backend-in-a-docker-image-introducing-grafana/otel-lgtm/

20.  DockerでOTel用コンテナを起動 https://grafana.com/blog/2024/03/13/an-opentelemetry-backend-in-a-docker-image-introducing-grafana/otel-lgtm/  DockerでOTel用コンテナを起動 v Prometheus→メトリクスを収集するDh v ⁨⁩Tempo→トレースを収集するDh v

    Loki→ログを収集するDh v localhost:4318に送信することで、
 データを保存してくれてそV v localhost:3000にアクセスすることで、
 Grafanaを介してデータを参照できそう みたいな構成っぽい

21. È 計測結果を確認する @ localhost:3000にアクセスするとGrafanaのUIが表示される

22. È 計測結果を確認する @ localhost:3000にアクセスするとGrafanaのUIが表示される Lokiをみると、console.logで出力されたログが見れた

23. È 計測結果を確認する @ localhost:3000にアクセスするとGrafanaのUIが表示される Traceなるもの
 が見れる

24. ここまでのまとめ u DenoでOpenTelemetryを有効にすると、
 任意のエンドポイントへ何かしらのデータを
 送信してくれ6 u データの送信先（grafana/otel-lgtmのような）
 があれば、データを保存してくれるし、そのデータを
 いろんな観点で確認できた

25. ざっくり動くものはイメージはできたので、 OpenTelemetryの
 公式ドキュメントを読んでみる https://opentelemetry.io/ja/

26. 公式ドキュメントを読んでみて m Otelはアプリケーションの状態を知るための仕様が
 定められてるって印X m この仕様にはアプリの状態を知るための情報を
 どのように生成、収集、管理、送信するかを定めてH m 仕様だからベンダーやツールに依存しな( m

    仕様に合わせてツールが作られてH m 統一された仕様があることで、マイクロサービスなど
 複数システムを跨ぐようなリクエストの流れを
 一貫して追える

27. https://grafana.com/blog/2024/03/13/an-opentelemetry-backend-in-a-docker-image-introducing-grafana/otel-lgtm/ ここに統一の仕様
 (データ形式など)
 があることで 統一の仕様を前提にツールが作れる 公式ドキュメントを読んだ後のイメージ

28. アプリの状態を可視化するために 可視化する情報（シグナル？テレメトリ？）のカテゴi G トレー9 G リクエストの経d G メトリク9 G 実行時に取得できる測定&

    G ロV G 任意のメタデータを含むタイムスタンプ付きの
 テキスト

29. トレースとは 1つのリクエストが辿った経路を記録する 図はclaudeさんに作ってもらった

30. DenoでOpenTelemetryを 有効にすることで これらを自動で収集できる （自動計装）

31. Denoで収集できるもの 6 トレーW 6 ⁨⁩Deno.serveでのHTTPリクエスD 6 fetchを使ったHTTPリクエスD 6 メトリクW 6

    Deno.serveによるリクエストの時間や$ 6 リクエストのbodyサイ 6 ロ3 6 console.*で作成されたロ3 6 Denoによって作成されたログ

32. 感想

33. 自動計装による
 導入の手軽さがとても良い！

34. という話が、昨日ブログで公開されてた https://docs.deno.com/runtime/fundamentals/open_telemetry/ Node.jsにOtelを追加するには8つの依存と84行のコードを追加し、
 ログ出力は独自で実装したものに置き換える必要があった それが1つのコマンドで実現できるようになるよ。そう、Denoならね⁨⁩⁨⁩
 （意訳）

35. Otel調べるのなんか腰が重かったけども... DenoでOtelがサポートされるって聞いて Otelをすごく身近に感じられた （し、実際サッと調べられた）

36. 余談 b @opentelemetry/apiを使うことで独自のトレースや
 メトリクスを収集でき# b ログは任意のメタデータを含められ# b ってことはOtelに則ってCore Web Vitalsも収集できそうa

    b みたいなことを探求してきたい

37. おわり