Cara Kerja JavaScript di Browser: Apa yang Sebenarnya Terjadi?
Kalau hari ini kamu buka website lalu klik tombol, muncul alert, atau form bisa validasi tanpa reload halaman, itu semua kelihatannya sederhana.
Tapi di balik layar browser, ada proses yang cukup panjang sebelum JavaScript bisa jalan.
Menariknya, semua itu terjadi dalam hitungan milidetik, tanpa kita sadari.
Saat Website Dibuka di Browser
Ketika kamu mengetik alamat website lalu tekan Enter, browser tidak langsung menampilkan halaman begitu saja.
Yang terjadi kurang lebih seperti ini:
- Browser meminta file HTML ke server
- HTML mulai dibaca dari atas ke bawah
- Browser membangun struktur halaman
Di tahap ini, JavaScript belum tentu langsung dijalankan.
HTML Dibaca, JavaScript Menyusul
Browser membaca HTML secara berurutan.
Saat bertemu tag <script>, browser akan berhenti sejenak.
Kenapa? Karena JavaScript bisa memengaruhi isi halaman.
Kalau JavaScript langsung dijalankan tanpa menunggu, hasil tampilannya bisa berantakan.
Peran Mesin JavaScript di Browser
Setiap browser punya mesin JavaScript sendiri:
- Chrome pakai V8
- Firefox pakai SpiderMonkey
- Safari pakai JavaScriptCore
Mesin inilah yang:
- Membaca kode JavaScript
- Mengubahnya jadi perintah mesin
- Menjalankannya di browser
Semua proses ini terjadi di sisi pengguna, bukan di server.
JavaScript dan DOM: Pasangan Tidak Terpisahkan
Begitu halaman terbentuk, browser membuat DOM (Document Object Model).
DOM ini bisa dibilang “peta” dari seluruh elemen HTML.
JavaScript berinteraksi dengan halaman lewat DOM:
- Mengubah teks
- Menambah elemen
- Menghapus elemen
- Merespon klik pengguna
Inilah alasan JavaScript disebut bikin website jadi interaktif.
Kenapa Posisi Script Itu Penting?
Mungkin kamu pernah lihat JavaScript ditaruh di:
Html
<script src="script.js"></script>
Kalau script ditaruh di atas, JavaScript bisa dijalankan sebelum HTML selesai dibaca.
Akibatnya, elemen yang ingin diakses belum ada.
Makanya, banyak developer menaruh JavaScript di bagian bawah atau pakai event tertentu.
Event: JavaScript Menunggu Aksi
JavaScript tidak selalu jalan sendiri.
Sering kali, JavaScript menunggu sesuatu terjadi.
Contohnya:
- Klik tombol
- Ketik di input
- Scroll halaman
Baru setelah itu, kode JavaScript dijalankan.
Dari sinilah muncul istilah event-driven.
Sinkron dan Asinkron (Sedikit, Tapi Penting)
Tidak semua JavaScript berjalan berurutan.
Ada proses yang:
- Harus ditunggu
- Berjalan di belakang layar
Misalnya:
- Ambil data dari server
- Delay waktu
- Tunggu respon API
Browser punya mekanisme sendiri untuk mengatur ini supaya halaman tidak freeze.
Kalau Dilihat dari Kacamata Pemula
Di awal belajar, mungkin semua ini terdengar ribet.
Tapi sebenarnya, kamu tidak perlu menghafal semuanya sekaligus.
Yang penting dipahami dulu:
- JavaScript dijalankan oleh browser
- Browser membaca HTML dulu
- JavaScript berinteraksi lewat DOM
- Event menentukan kapan kode dijalankan
Penutup
Setiap kali JavaScript jalan di browser, ada banyak proses yang bekerja di balik layar.
Kita mungkin tidak melihatnya, tapi efeknya langsung terasa.
Kalau kamu sudah paham cara kerjanya, banyak error yang awalnya membingungkan akan terasa lebih masuk akal.
Di artikel selanjutnya, kita akan mulai masuk ke struktur dasar JavaScript supaya kamu bisa mulai nulis kode dengan lebih percaya diri.