Blog Details

image

Jasa Pembuatan Website Bogor dengan Optimasi Skrip Pelacak dan Chatbot Berbasis Web Worker

Website korporat jarang berjalan dengan kode buatan sendiri saja. Hampir selalu ada tambahan dari pihak lain: skrip analitik untuk membaca perilaku pengunjung, piksel iklan, chatbot layanan pelanggan, peta tertanam, hingga widget media sosial. Masing-masing berguna bagi bisnis, tetapi di sisi browser semuanya berebut sumber daya yang sama: thread utama.

Akibatnya terasa langsung oleh pengunjung. Mengetik di kolom pencarian terasa tersendat, tombol lambat merespons, dan halaman seperti membeku sesaat. Padahal kode milik sendiri tidak berubah sedikit pun.

Mengapa Skrip Pihak Ketiga Membebani Thread Utama

Browser menjalankan sebagian besar pekerjaan halaman pada satu thread utama: merender tampilan, menangani klik dan ketikan, serta mengeksekusi JavaScript. Dokumentasi Partytown, salah satu pustaka yang dibuat untuk masalah ini, merangkum potensi dampak skrip pihak ketiga yang dimuat tanpa kehati-hatian, termasuk menjadi titik kegagalan tunggal (single point of failure) bagi halaman. Ketika skrip pelacak atau chatbot melakukan pekerjaan berat di thread yang sama dengan penanganan input, pengguna merasakannya sebagai kelambatan.

Filosofi yang diusung Partytown sederhana: thread utama sebaiknya dikhususkan untuk kode milik sendiri, sedangkan skrip yang tidak berada di jalur kritis dipindahkan ke web worker.

Apa Itu Web Worker dan Sandbox Skrip

Web worker memungkinkan JavaScript berjalan pada thread latar belakang yang terpisah dari thread utama. Tugas berat dikerjakan di sana, sementara tampilan dan interaksi tetap lancar. Kendalanya, worker tidak punya akses langsung ke DOM dan banyak objek global halaman, sehingga sebagian besar skrip pihak ketiga tidak dapat langsung dijalankan di dalamnya tanpa penyesuaian.

Partytown menjembatani kendala itu. Skrip yang diberi atribut type="text/partytown" tidak dieksekusi di thread utama. Pustaka mengambil isinya dan menjalankannya di dalam web worker, lalu menyediakan objek Proxy yang meneruskan akses ke DOM dan global lain ke thread utama saat dibutuhkan. Karena semua akses harus melewati proxy, pengelola dapat mengizinkan atau menolak akses skrip ke API tertentu seperti cookie, localStorage, dan userAgent, bahkan mencatat setiap pembacaan dan penulisan untuk memahami perilaku skrip. Inilah sisi sandbox dari pendekatan ini.

Manfaat yang ditawarkan, menurut dokumentasi proyeknya, mencakup membebaskan thread utama untuk aplikasi utama, mengisolasi tugas berjalan lama di thread worker, serta membatasi akses skrip pihak ketiga ke thread utama. Sebuah ulasan LogRocket melaporkan pengurangan waktu pemblokiran thread utama sebesar 297 ms pada percobaan mereka dibandingkan metode standar.

Cocok untuk Portal Informasi dan Profil Korporat

Skrip yang paling layak dipertimbangkan untuk dipindahkan antara lain:

  • Analitik dan pelacak. Mengumpulkan data kunjungan tidak perlu bersaing dengan penanganan ketikan pengunjung.
  • Piksel iklan dan tag manager. Biasanya memuat rantai skrip tambahan yang sulit dikontrol.
  • Chatbot dan widget layanan. Sering berukuran besar, tetapi hanya dipakai sebagian kecil pengunjung.
  • Widget media sosial dan penyemat pihak ketiga.

Bagi portal informasi yang dibuka dari perangkat dan koneksi yang beragam, penghematan beban thread utama langsung terasa pada kenyamanan berinteraksi.

Hal yang Perlu Diperhatikan

Pendekatan ini bukan solusi ajaib, dan pengembang proyeknya sendiri mencantumkan catatan penting: Partytown masih berstatus beta dan tidak dijamin berfungsi pada setiap skenario. Beberapa pertimbangan praktis:

1. Uji setiap skrip satu per satu. Tidak semua skrip pihak ketiga kompatibel dengan eksekusi di worker. Verifikasi bahwa data analitik tetap tercatat dan widget tetap berfungsi.

2. Pilih skrip yang tidak berada di jalur kritis. Skrip yang menentukan tampilan awal sebaiknya tetap berjalan normal.

3. Siapkan konfigurasi akses yang tepat. Tentukan API mana yang boleh diakses skrip, dan tinjau catatan akses untuk mengenali perilaku yang tidak diharapkan.

4. Perhatikan dukungan browser. Pustaka bergantung pada service worker atau Atomics untuk komunikasi sinkron, dan akan kembali ke cara eksekusi konvensional bila browser tidak mendukung keduanya.

5. Kombinasikan dengan praktik dasar. Pemuatan dengan async atau defer, pemuatan saat interaksi, dan audit skrip yang benar-benar diperlukan tetap menjadi langkah pertama yang efektif.

6. Ukur dampaknya. Bandingkan metrik seperti total blocking time dan responsivitas input sebelum dan sesudah penerapan.

Dirancang dari Awal, Bukan Ditambal Belakangan

Bisnis cenderung menambahkan skrip pihak ketiga satu per satu, sehingga dampak kumulatifnya baru terasa ketika website sudah lambat. Mengatur strategi pemuatan sejak perancangan, termasuk mana yang boleh dipindahkan ke worker, mana yang ditunda, dan mana yang dihapus, jauh lebih efisien. Layanan Jasa Pembuatan Website dari Bogorwebsite.com memperhatikan aspek performa semacam ini, sehingga website profil korporat dan portal informasi yang dibangun tetap responsif meski dilengkapi alat pemasaran dan layanan pelanggan.

Dengan pengalaman lebih dari 15 tahun membangun berbagai jenis website, hasil kerja kami dapat dilihat pada halaman portofolio.

Alat Bisnis yang Tidak Mengorbankan Pengalaman Pengunjung

Pelacak dan chatbot memang membantu bisnis, tetapi nilainya hilang bila pengunjung pergi karena halaman terasa lambat. Dengan penataan yang tepat, keduanya dapat tetap bekerja tanpa mengganggu input pengguna.

Jika Anda ingin website korporat yang tetap cepat meski memakai banyak layanan pihak ketiga, tim Bogorwebsite.com siap berdiskusi. Hubungi kami melalui WhatsApp atau kunjungi halaman kontak.