PERFORMANCE PROFILING JS

Performance profiling adalah teknik yang berguna untuk memahami bagaimana kode kamu berjalan. Di JavaScript, proses ini sangat penting untuk memastikan bahwa aplikasi web kamu berjalan dengan cepat dan efisien. Dalam artikel ini, kita akan membahas berbagai metode untuk melakukan profiling kinerja JavaScript (JS).

Profiling Kinerja Menggunakan Developer Tools

Rata-rata browser modern memiliki Developer Tools yang dilengkapi dengan fitur profiling. Contohnya seperti di Google Chrome, kamu dapat menggunakan tab “Performance” untuk mulai menganalisis kinerja kode JS kamu.

Langkah-langkah untuk Profiling di Google Chrome

1. Buka Developer Tools (Tekan F12 atau klik kanan dan pilih “Inspect”)
2. Pilih tab “Performance”
3. Click tombol perekam (tombol lingkaran di kiri atas)
4. Jalankan aksi di aplikasi yg ingin kamu profil (misalnya, scroll halaman, klik tombol, dll.)
5. Click tombol perekam lagi untuk berhenti merekam.

Hasilnya akan memberikan diagram batang yang menunjukkan waktu eksekusi untuk setiap fungsi JS.

Menggunakan Console.time()

Metode lain yang bisa digunakan adalah dengan menggunakan console.time() dan console.timeEnd() yang disediakan oleh JS. Metode ini memungkinkan kamu menentukan bagian kode mana yang ingin di-profil.

Misalnya, kamu bisa memulai waktu sebelum fungsi dipanggil dan menghentikannya setelah fungsi selesai dipanggil.

console.time("fungsiSaya");

fungsiSaya();

console.timeEnd("fungsiSaya");

Ini akan mencetak total waktu eksekusi fungsi ke console.

Menggunakan Node.js dan V8 Profiling

Apabila kamu bekerja dengan Node.js, kamu juga bisa menggunakan fasilitas bawaan V8 engine untuk profiling kinerja. Node.js memiliki modul ‘perf_hooks’ yang memungkinkan kamu untuk mengukur waktu eksekusi kode kamu.

const { performance } = require('perf_hooks');

let start = performance.now();

fungsiSaya();

let end = performance.now();

console.log(`fungsiSaya memakan waktu: ${end - start} ms.`);

Ingatlah bahwa profil kinerja adalah alat penting dalam pengembangan JavaScript. Melalui pemahaman yang baik tentang bagaimana kode kamu berjalan, kamu bisa melakukan optimasi yang akan menciptakan aplikasi web yang lebih cepat dan lebih responsif. Selamat mencoba!