WebGPU: อนุภาค 250,000 ตัว บนเบราว์เซอร์ของคุณ
นี่คือวันที่ 50 และเป็นวันสุดท้ายของซีรีส์ที่ผมสร้างเทคโนโลยีใหม่จากศูนย์ในทุกๆ วัน ผมอยากจะปิดท้ายด้วย WebGPU
ผมได้จำลองอนุภาค 250,000 ตัวบน GPU ภายในเบราว์เซอร์ทั้งหมด
CPU ของคุณมีคอร์ที่ทำงานเร็วเพียงไม่กี่คอร์ แต่ GPU ของคุณมีคอร์ขนาดเล็กจำนวนหลายพันคอร์ CPU จะเคลื่อนย้ายอนุภาคทีละตัว ในขณะที่ GPU สามารถเคลื่อนย้ายอนุภาคหลายพันตัวได้พร้อมกัน
WebGPU คือผู้สืบทอดสมัยใหม่ของ WebGL มันช่วยให้เบราว์เซอร์ของคุณเข้าถึงฮาร์ดแวร์ผ่าน compute shaders ซึ่ง shader เหล่านี้ช่วยให้ GPU สามารถคำนวณทางคณิตศาสตร์ได้ ไม่ใช่แค่การวาดกราฟิกเท่านั้น
หลักการทำงาน:
• คุณสร้าง device เพื่อจัดการ GPU • คุณสร้าง buffer เพื่อเก็บข้อมูลอนุภาค เช่น ตำแหน่งและความเร็ว • คุณอัปโหลดข้อมูลเพียงครั้งเดียวและเก็บไว้บน GPU • คุณเขียน compute shader สำหรับอนุภาคหนึ่งตัว • GPU จะรัน shader นั้นกับอนุภาคทั้ง 250,000 ตัวพร้อมกัน
ข้อมูลจะถูกเก็บไว้บน GPU โดยจะเคลื่อนย้ายจากขั้นตอนการคำนวณ (compute step) ไปยังขั้นตอนการเรนเดอร์ (render step) โดยไม่ต้องส่งกลับไปยัง CPU ความเร็วนี้ช่วยให้การจำลองทำงานได้ที่ 60fps
WebGPU คือรากฐานใหม่สำหรับการคำนวณทางคณิตศาสตร์ในเบราว์เซอร์และ machine learning ภายในเครื่อง นี่คือวิธีที่เหมาะสมที่สุดในการปิดท้ายซีรีส์นี้
ขอบคุณที่ติดตามการเดินทางครั้งนี้ คุณสามารถดูคลังโปรเจกต์ทั้งหมดได้ที่นี่
โค้ดฉบับเต็ม: https://github.com/dev48v/webgpu-from-zero
โพสต์ฉบับเต็ม: https://dev.to/dev48v/webgpu-i-simulated-250000-particles-entirely-on-the-gpu-in-the-browser-2o0f
ชุมชนการเรียนรู้ (ไม่บังคับ): https://dev48v.infy.uk/techfromzero.php