Baru-baru ini, kami melakukan eksperimen dengan matrix multiplication menggunakan WebGPU. Kali ini, kami ingin menguji performa CPU dan GPU dalam melakukan komputasi numerik intensif untuk menghasilkan fractal Mandelbrot. Uji coba ini dilakukan menggunakan JavaScript + React dengan teknologi WebGPU dan bahasa WGSL (WebGPU Shading Language). Tujuan utama dari benchmark ini adalah untuk mengukur percepatan dan kecepatan yang dapat diberikan GPU dibandingkan CPU dalam tugas yang bersifat paralel, dengan Mandelbrot set dipilih karena algoritmanya yang legendaris. Algoritma ini memungkinkan setiap piksel dihitung secara independen, memiliki beban komputasi tinggi, dan mudah divisualisasikan, sehingga cocok untuk mengukur efisiensi compute pipeline WebGPU.
Dalam demo ini, pengguna dapat langsung melihat perbandingan waktu komputasi antara CPU dan GPU secara visual, serta mengenali kemampuan perangkat mereka. Core code dari demo ini terdiri dari computeShaderWGSL yang merupakan inti komputasi GPU, calculateMandelbrotCPU yang berfungsi sama dengan GPU namun di sisi CPU, dan visualisasi hasil perhitungan melalui fungsi drawMandelbrot. Shader dijalankan secara paralel oleh ratusan bahkan ribuan thread GPU, membuatnya jauh lebih cepat daripada versi CPU yang menghitung piksel satu per satu.
Setelah eksekusi, aplikasi menampilkan dua kanvas: satu hasil CPU dan satu hasil GPU, serta informasi waktu komputasi dan faktor percepatan. Hasil benchmark seperti ini dapat digunakan untuk menguji efisiensi pipeline WebGPU browser, mengetahui perbedaan performa komputasi antara CPU dan GPU, serta menjadi dasar untuk eksperimen WebGPU berikutnya. Keseluruhannya, demo ini menyoroti kemampuan WebGPU dalam membuka akses komputasi paralel langsung dari browser, memungkinkan JavaScript untuk melakukan tugas-tugas yang sebelumnya hanya mungkin di CUDA atau OpenCL.


