1 poin oleh jhs6312 6 jam lalu | Belum ada komentar. | Bagikan ke WhatsApp

Halo. Saya sedang membuat Spanlens, platform observabilitas open source untuk melihat logging panggilan LLM, pelacakan biaya, dan trace agen di satu tempat.

Alasan membuatnya

Saat menggunakan LLM untuk side project pribadi, ada dua hal yang terus mengganggu saya.

Yang pertama adalah pelacakan biaya.
Semuanya bermula saat saya membuat ekstensi browser berbasis GPT dan kaget pertama kali menerima tagihan OpenAI di akhir bulan. Sebagai mahasiswa, jumlahnya memang tidak besar, tetapi yang terlihat hanya total keseluruhan; tidak ada tampilan terpisah untuk biaya dari fitur mana, atau rata-rata token yang digunakan tiap model. Jadi saya berulang kali menanam console.log di kode, mengekspor ke CSV, menjumlahkannya di Excel, lalu mengalikan dengan harga per model untuk membuat estimasi.

Yang kedua adalah debugging agen.
Ini pengalaman yang saya alami sendiri saat menambahkan integrasi LangGraph ke Spanlens: ketika satu trace yang berisi banyak panggilan LLM memakan waktu 30 detik, saya harus membuka log dan menelusurinya secara manual untuk mengetahui

  • node mana yang paling banyak memakan waktu
  • mengapa tool yang sama dipanggil dua kali
  • pada titik mana state LangGraph berubah

Karena ingin mengurangi dua masalah ini, saya membuat Spanlens.

Fitur utama

  1. Integrasi satu baris baseURL

Jika baseURL SDK OpenAI/Anthropic/Gemini diubah menjadi https://api.spanlens.io/proxy/openai/v1, maka request, response, token, dan biaya akan tercatat otomatis. Response dipass-through apa adanya, sehingga streaming, tool calling, dan JSON mode semuanya bekerja sama seperti aslinya.

Untuk kasus seperti agen yang memerlukan pendekatan wrap, saya membuat SDK yang dapat menyuntikkan trace_id dan span_id agar relasi parent-child juga bisa tercatat bersama.

  1. Trace agen + tampilan topologi LangGraph

Trace tidak hanya ditampilkan sebagai timeline berurutan berdasarkan waktu, tetapi juga ditumpangkan langsung di atas node graf yang sebenarnya. Jika agennya dibuat dengan LangGraph, Anda bisa melihat dalam satu layar node mana yang memakan waktu paling banyak dan edge mana yang paling sering dilalui.

  1. Analisis Critical Path otomatis

Di dalam trace, rantai panggilan yang paling banyak memakan latency akan ditandai secara otomatis. Saya ingin mengurangi jumlah klik yang dibutuhkan untuk menemukan jawaban dari pertanyaan, “Kenapa trace ini lambat?”

  1. Perbandingan statistik A/B untuk prompt

Membandingkan dua versi prompt yang sama berdasarkan latency, biaya, dan penggunaan token. Bukan sekadar perbedaan rata-rata sederhana, tetapi menggunakan Welch t-test untuk menampilkan perbedaan dengan mempertimbangkan varians sampel. Saya menambahkan ini agar bisa mengatakan “perbedaannya signifikan,” bukan sekadar “rata-ratanya sedikit lebih rendah.”

  1. Self-hosting

Bisa dijalankan di server sendiri lewat image Docker. Kodenya sama persis dengan versi SaaS dan tersedia apa adanya di repositori publik. Seluruh kode menggunakan lisensi MIT.

Bagaimana implementasinya

Saat ini, pipeline-nya kurang lebih seperti ini.

  • Request proxy diterima dengan Hono, lalu header Authorization dan metadata X-Spanlens-* dipisahkan; provider key didekripsi dengan AES-256-GCM dan hanya digunakan di memori tepat sebelum pemanggilan.
  • Untuk response streaming, body.tee() digunakan agar stream asli langsung dikembalikan ke klien, sementara salinannya diproses parser di background untuk menghitung token dan biaya.
  • Log dimuat ke ClickHouse secara asinkron. Jika INSERT gagal, datanya disimpan di fallback queue Supabase dan akan dicoba ulang oleh cron, sehingga meski polanya fire-and-forget, saya tetap berusaha menghindari kehilangan data.
  • Harga model disimpan di tabel DB dan dicache dengan TTL 5 menit stale-while-revalidate. Harga fallback berfungsi sebagai jaring pengaman saat cold start.

Awalnya ini hanya proxy sederhana, tetapi setelah benar-benar dipakai, yang lebih penting ternyata bukan raw log melainkan trace yang dinormalisasi. Untuk menjawab “Kenapa trace ini lambat?”, tidak cukup hanya urutan panggilan; dibutuhkan juga relasi parent-child, panggilan paralel, dan Critical Path. Dari kebutuhan itu lahir fitur seperti tampilan topologi LangGraph dan Critical Path otomatis.

Stack-nya adalah Next.js 14, Hono, Supabase Postgres, ClickHouse, semuanya dalam pnpm monorepo berbasis TypeScript.

Hal yang masih saya pertimbangkan

  • Saya ingin self-hosting cukup dengan satu baris docker run, tetapi untuk itu Supabase Postgres juga harus ikut dijalankan. Saat ini docker-compose mengasumsikan managed Supabase dan terdiri dari 3 container: web, server, dan ClickHouse. Saya masih mempertimbangkan apakah lebih baik menambahkan opsi self-hosting untuk Supabase juga, atau tetap mempertahankan asumsi managed.

  • Di perbandingan A/B prompt, perhitungan Welch t-test sudah ada, tetapi saya belum bisa memutuskan apakah lebih membantu menampilkan p-value apa adanya, atau cukup badge kesimpulan saja (signifikan/tidak). Saya juga sedang memikirkan bagaimana memberi peringatan saat sampelnya kecil (n<30).

  • Di tampilan topologi LangGraph, node, edge, dan Critical Path sudah divisualisasikan, tetapi perubahan state channel sengaja saya keluarkan karena noise-nya terlalu banyak. Saya ingin mendengar pendapat apakah pelacakan perubahan state lebih dibutuhkan untuk debugging nyata, atau tingkat detail sekarang sudah pas.

Ini adalah proyek yang dimulai dari ketidaknyamanan yang saya alami sendiri dan terus saya rapikan secara konsisten.

[ Spanlens ]
Web: https://www.spanlens.io
GitHub: https://github.com/spanlens/Spanlens
Panduan self-hosting: https://www.spanlens.io/docs/self-host

Saya akan sangat berterima kasih atas masukan apa pun, baik soal UX dashboard, visualisasi trace, metode integrasi proxy, pengalaman self-hosting, maupun sudut pandang lainnya. Terutama, jika ada provider selain OpenAI/Anthropic/Gemini yang menurut Anda sebaiknya didukung, beri tahu saya lewat komentar.

Ada versi demo di website, jadi mohon banyak perhatian dan dukungannya.
Saat ini UI masih dalam bahasa Inggris, dan dukungan bahasa Korea juga akan segera ditambahkan.

Belum ada komentar.

Belum ada komentar.