Bagaimana Bisa Sampai ke Sini?

 (how-did-i-get-here.net)
27 poin oleh GN⁺ 2025-11-09 | 1 komentar | Bagikan ke WhatsApp
  • Halaman interaktif yang memvisualisasikan secara real-time jalur yang ditempuh paket pengguna melalui internet hingga mencapai server situs web
  • Program traceroute buatan sendiri, ktr, mengumpulkan informasi tiap hop jaringan dengan memanfaatkan nilai TTL dari paket ICMP
  • Situs web ini tetap berfungsi tanpa JavaScript, dan server mencerminkan hasil traceroute ke dalam HTML dalam bentuk streaming
  • Untuk analisis jalur, situs ini menggunakan data WHOIS dan PeeringDB untuk menampilkan Autonomous System (AS) serta informasi perusahaan yang terkait dengan tiap IP
  • Dengan menggabungkan traceroute dan struktur internet berbasis BGP, situs ini menunjukkan bahwa internet adalah sekumpulan jaringan yang tersusun dari hubungan peering antarperusahaan

Perjalanan Paket Anda

  • Traceroute di bagian atas halaman menunjukkan jalur perpindahan paket dari komputer pengguna ke server
    • Secara berurutan melewati jaringan seperti router, ISP, Amazon, NTT Global IP Network, dan Hetzner
    • Beberapa bagian ditandai sebagai “(no response)”, yang berarti server di titik tersebut tidak memberikan respons
  • Di dalam jaringan Hetzner, paket melewati beberapa router sebelum mencapai server tujuan
  • Alamat IP 213.239.252.10 ditampilkan sebagai core0.fra.hetzner.com melalui reverse DNS lookup

Behind the Scenes

  • Saat situs web menerima permintaan dari pengguna, server menjalankan traceroute dan mengirimkan hasilnya secara real-time
  • Traceroute menggunakan protokol ICMP dan mengumpulkan respons dari tiap hop dengan menaikkan nilai TTL (Time To Live) satu per satu
  • Ketika TTL menjadi 0, router terkait mengembalikan pesan galat, sehingga jalur yang dilalui paket dapat dilacak
  • ktr melakukan streaming hasil traceroute sambil secara bersamaan menelusuri informasi IP, ASN, dan jaringan pemilik untuk tiap hop

Frontend Fun

  • Tetap berfungsi tanpa JavaScript, dan browser hanya mengenalinya sebagai halaman yang memuat dengan lambat
  • Server mempertahankan koneksi HTTP sambil menyisipkan hasil traceroute ke dalam HTML secara berurutan
  • Pada setiap pembaruan, efek pembaruan real-time dibuat dengan menyisipkan blok CSS untuk menyembunyikan hasil sebelumnya
Iklan

Front to Back, Back to Front

  • Sebenarnya, server menjalankan traceroute ke IP pengguna lalu menampilkan hasilnya dalam urutan terbalik
  • Ini adalah bentuk “reverse traceroute”; meski jalur dua arah tidak selalu sepenuhnya sama, hasilnya umumnya menunjukkan jalur yang mirip

Jaringan dan Autonomous System (AS)

  • Internet adalah jaringan antarjaringan milik perusahaan yang disebut Autonomous System (AS)
  • Setiap AS memiliki ASN (Autonomous System Number) yang unik dan saling bertukar trafik melalui peering
  • Internet adalah kumpulan jaringan yang dimiliki perusahaan, bukan individu, dan koneksinya ditentukan oleh kontrak finansial serta proses administratif
  • ASN dapat diajukan melalui salah satu dari 5 Regional Internet Registry (RIR)

WHOIS dan PeeringDB

  • Untuk menemukan AS tempat tiap IP pada traceroute berada, digunakan protokol WHOIS dan basis data PeeringDB
  • WHOIS memiliki struktur sederhana: setelah koneksi TCP dibuat dan kueri dikirim, server mengembalikan informasi
  • Karena nama field dan format berbeda-beda di tiap server, parser diimplementasikan sebagai simulator sederhana yang mendekati cara baca manusia
  • PeeringDB menyediakan informasi perusahaan untuk sekitar sepertiga dari seluruh AS

BGP (Border Gateway Protocol)

  • BGP adalah protokol inti yang menentukan bentuk internet, dengan menukar informasi rute antar-AS
  • Border router mempertahankan tabel routing BGP yang menyimpan daftar ASN untuk setiap rute
  • Ketika dua AS melakukan peering, router mereka membentuk sesi BGP dan bertukar route advertisement
  • Di antara beberapa rute, router memilih rute terpendek atau yang memiliki preferensi lebih tinggi untuk meneruskan paket
Iklan

Sejarah BGP

  • Eksperimen jaringan yang dimulai dari ARPANET pada 1969 berlanjut ke RFC 1105 oleh Cisco dan IBM pada 1989, yang melahirkan BGP v1
  • Setelah itu, BGP v2 (1990) dan v4 (1994) dirilis, dan v4 masih digunakan hingga sekarang
  • BGP kemudian menjadi protokol standar untuk menentukan jalur konektivitas antarsemua jaringan di internet

Hubungan antara Traceroute dan BGP

  • Contoh jalur: AS16509 → AS2914 → AS24940
    • Amazon (AS16509) → NTT Global IP Network (AS2914) → Hetzner (AS24940)
  • Bahkan dalam ASN yang sama pun bisa ada beberapa hop, yang ditangani oleh protokol routing internal atau rute statis
  • Hubungan peering antar-AS menentukan keterjangkauan nyata di internet

Ringkasan

  • Situs web menjalankan traceroute ke IP pengguna dan mengirimkan hasilnya sebagai stream HTTP
  • Traceroute menggunakan TTL dari paket ICMP untuk memvisualisasikan jalur antar-router
  • Setiap router termasuk dalam Autonomous System (AS) dan saling terhubung melalui BGP
  • Hubungan peering menentukan keterjangkauan dan struktur internet

Epilog

  • Penulis merasa pemahamannya tentang struktur internet masih kurang, lalu membuat tulisan interaktif edukatif yang berfokus pada protokol
  • Alih-alih menunggu proyek besar yang benar-benar sempurna, ia memilih merilis sesuatu meski dalam bentuk kecil
  • Proyek ini selesai berkat dorongan dari komunitas Hack Club, serta memanfaatkan program traceroute open source
  • Dengan pesan bahwa “yang kecil tapi selesai itu lebih baik”, penulis berharap ini bisa tetap hidup sebagai konten web yang berkelanjutan

Bacaan terkait

1 komentar

 
GN⁺ 2025-11-09
Komentar Hacker News

  • Saya rasa fitur reverse traceroute ini masih berguna Namun pada praktiknya, meskipun jalur AS sama, peering point-nya hampir selalu berbeda Kebanyakan AS menggunakan hot-potato routing sehingga paket diserahkan ke titik peering yang paling dekat dengan asal trafik Bahkan jika memakai cold-potato pun tetap asimetris. Selain itu, saat panjang AS-path sama, kebijakan hot-potato juga bisa membuat jalur yang dipilih berbeda (Edit: memperbaiki kekeliruan hot/cold)

    • Saya sudah menjalankan traceroute dan reverse traceroute beberapa kali, dan sebagian besar jalur AS-nya terlihat mirip Hanya saja, pada traceroute kadang terlihat lebih banyak jalur internal ISP Secara umum kamu benar, dan nanti saya ingin menjelaskan lebih rinci soal perbedaan routing hot-potato vs cold-potato Bagaimanapun, menurut saya hasil reverse traceroute ini saja sudah cukup untuk menjelaskan struktur internet
    • Sebagai catatan, yang kamu maksud itu memang hot-potato routing Setiap AS menyerahkan paket secepat mungkin jika bisa Mungkin terasa tidak adil, tetapi itu pilihan yang masuk akal karena kita tidak tahu detail jalur di dalam AS tujuan Misalnya jika ada jaringan di Berlin dan Hamburg, dan pihak seberang juga punya peering di dua kota itu, menyerahkan di lokasi terdekat adalah cara untuk menghindari bolak-balik yang tidak perlu

  • Menarik melihat penjelasan mengapa traceroute dimuat satu baris demi satu baris dari bawah ke atas Ternyata caranya dengan menyisipkan blok CSS secara berkala untuk menyembunyikan status sebelumnya, tanpa JavaScript; sangat terasa seperti hacking dan kreatif

    • Bahkan tanpa JavaScript, Declarative Shadow DOM bisa dipakai untuk melakukan streaming HTML yang urutannya tidak beraturan Contoh dan penjelasannya dirangkum dengan baik di posting blog ini

  • Frasa “This is not my beautiful website.” terasa jenaka

    • Balasan “This is not my beautiful home-page.” juga cerdas

  • Kalau belum pernah mencoba,

    tracepath -m60 bad.horse

    lalu

    openssl s_client -connect signed.bad.horse:443 -servername signed.bad.horse

    layak dicoba

    • Keren! Rasanya seperti penghormatan geeky untuk Dr. Horrible Hasil tracepath dimulai dari “bad.horse” lalu berlanjut ke “he.rides.across.the.nation” dan seterusnya, jadi benar-benar lucu
    • Ada juga yang ini 
      ssh funky.nondeterministic.computer
    • Dan 
      ssh watch.ascii.theater
      juga patut dicoba

  • Katanya proyek ini kembali naik ke halaman depan Hacker News sehingga server sempat tersendat Lexi mengumumkan agar orang-orang “cek lagi besok”

    • Sekarang katanya sudah agak membaik. Concurrency-nya sedikit ditambah, dan pelajaran yang didapat adalah lain kali akan memakai Tokio

  • Dari judulnya saya kira akan muncul lagu Talking Heads

    • Lirik “letting the days go by” langsung terngiang otomatis
    • Kalau melihat HTML-nya, mungkin ada sesuatu yang tersembunyi :)

  • Tautan “Once in a Lifetime” rasanya seperti sudah tertanam di otak Hanya dengan melihat judulnya saja, bass line-nya langsung terputar otomatis

    • Saya juga langsung dilanda krisis eksistensial

  • Setelah saya jalankan sendiri, saya jadi sadar bahwa koneksi internet utama saya putus dan beralih ke jalur cadangan Tadi ada pemadaman listrik, dan saya mengetahuinya berkat alat ini. Cukup berguna

    • Benar-benar menemukan rute yang lebih jarang dilalui (route less travelled)

  • Kadang informasi bagian atas “You are here” muncul seperti ini

    Host               ASN   Network         Region
123-456-789-101.static.kc.net.uk AS19905 UltraDDoS Protect    Global

    Tapi di waktu lain muncul

    Host               ASN   Network         Region
123-456-789-101.static.kc.net.uk AS12390 Kingston Communications Europe

    dan tampil bergantian seperti itu. Saya penasaran kenapa ASN-nya berubah dengan rasio 50:50 padahal IP-nya sama. Terlihat seperti berubah secara acak

  • Awalnya halaman itu berfungsi baik tanpa JavaScript, tetapi kemudian HTML penggantinya malah ter-encode sebagai teks

    
 #strYQt8 { display: none; }

    Jadi tampil rusak seperti itu Saya mengirim PR perbaikannya di GitHub