WebGPU: ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ 'ਤੇ 250,000 Particles
ਇਹ 50ਵਾਂ ਦਿਨ ਹੈ। ਇਹ ਮੇਰੀ ਸੀਰੀਜ਼ ਦਾ ਆਖਰੀ ਦਿਨ ਹੈ ਜਿੱਥੇ ਮੈਂ ਹਰ ਰੋਜ਼ ਜ਼ੀਰੋ ਤੋਂ ਇੱਕ ਨਵੀਂ ਤਕਨੀਕ ਬਣਾਉਂਦਾ ਹਾਂ। ਮੈਂ ਇਸ ਨੂੰ WebGPU ਨਾਲ ਖਤਮ ਕਰਨਾ ਚਾਹੁੰਦਾ ਸੀ।
ਮੈਂ ਬ੍ਰਾਊਜ਼ਰ ਦੇ ਅੰਦਰ ਪੂਰੀ ਤਰ੍ਹਾਂ GPU 'ਤੇ 250,000 particles ਦਾ ਸਿਮੂਲੇਸ਼ਨ ਕੀਤਾ।
ਤੁਹਾਡੇ CPU ਵਿੱਚ ਕੁਝ ਤੇਜ਼ cores ਹੁੰਦੇ ਹਨ। ਤੁਹਾਡੇ GPU ਵਿੱਚ ਹਜ਼ਾਰਾਂ ਸਧਾਰਨ cores ਹੁੰਦੇ ਹਨ। ਇੱਕ CPU ਇੱਕ-ਇੱਕ ਕਰਕੇ particles ਨੂੰ ਹਿਲਾਉਂਦਾ ਹੈ। ਇੱਕ GPU ਇੱਕੋ ਸਮੇਂ ਹਜ਼ਾਰਾਂ ਨੂੰ ਹਿਲਾਉਂਦਾ ਹੈ।
WebGPU, WebGL ਦਾ ਆਧੁਨਿਕ ਉੱਤਰਾਧਿਕਾਰੀ ਹੈ। ਇਹ compute shaders ਰਾਹੀਂ ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਨੂੰ ਹਾਰਡਵੇਅਰ ਤੱਕ ਪਹੁੰਚ ਦਿੰਦਾ ਹੈ। ਇਹ shaders GPU ਨੂੰ ਸਿਰਫ਼ ਗ੍ਰਾਫਿਕਸ ਬਣਾਉਣ ਦੀ ਹੀ ਨਹੀਂ, ਸਗੋਂ ਗਣਿਤ (math) ਕਰਨ ਦੀ ਵੀ ਇਜਾਜ਼ਤ ਦਿੰਦੇ ਹਨ।
ਇਹ ਕਿਵੇਂ ਕੰਮ ਕਰਦਾ ਹੈ:
• ਤੁਸੀਂ GPU ਨੂੰ ਪ੍ਰਬੰਧਿਤ ਕਰਨ ਲਈ ਇੱਕ device ਬਣਾਉਂਦੇ ਹੋ। • ਤੁਸੀਂ position ਅਤੇ velocity ਵਰਗੇ particle data ਨੂੰ ਰੱਖਣ ਲਈ ਇੱਕ buffer ਬਣਾਉਂਦੇ ਹੋ। • ਤੁਸੀਂ ਡੇਟਾ ਨੂੰ ਇੱਕ ਵਾਰ ਅਪਲੋਡ ਕਰਦੇ ਹੋ ਅਤੇ ਇਸਨੂੰ GPU 'ਤੇ ਹੀ ਰੱਖਦੇ ਹੋ। • ਤੁਸੀਂ ਇੱਕ particle ਲਈ ਇੱਕ compute shader ਲਿਖਦੇ ਹੋ। • GPU ਉਸ shader ਨੂੰ ਇੱਕੋ ਵਾਰ ਵਿੱਚ ਸਾਰੇ 250,000 particles 'ਤੇ ਚਲਾਉਂਦਾ ਹੈ।
ਡੇਟਾ GPU 'ਤੇ ਹੀ ਰਹਿੰਦਾ ਹੈ। ਇਹ CPU 'ਤੇ ਵਾਪਸ ਆਏ ਬਿਨਾਂ compute ਸਟੈਪ ਤੋਂ render ਸਟੈਪ ਤੱਕ ਜਾਂਦਾ ਹੈ। ਇਹ ਰਫ਼ਤਾਰ ਸਿਮੂਲੇਸ਼ਨ ਨੂੰ 60fps 'ਤੇ ਚਲਾਉਣ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦੀ ਹੈ।
WebGPU ਬ੍ਰਾਊਜ਼ਰ ਦੇ ਅੰਦਰ ਗਣਿਤ ਅਤੇ ਲੋਕਲ machine learning ਲਈ ਇੱਕ ਨਵੀਂ ਨੀਂਹ ਹੈ। ਇਸ ਸੀਰੀਜ਼ ਨੂੰ ਖਤਮ ਕਰਨ ਦਾ ਇਹ ਸਹੀ ਤਰੀਕਾ ਸੀ।
ਇਸ ਯਾਤਰਾ ਵਿੱਚ ਸਾਥ ਦੇਣ ਲਈ ਤੁਹਾਡਾ ਧੰਨਵਾਦ। ਤੁਸੀਂ ਹਰ ਪ੍ਰੋਜੈਕਟ ਦਾ ਪੂਰਾ ਆਰਕਾਈਵ ਇੱਥੇ ਲੱਭ ਸਕਦੇ ਹੋ।
ਪੂਰਾ ਕੋਡ (Full code): https://github.com/dev48v/webgpu-from-zero
ਪੂਰੀ ਪੋਸਟ (Complete post): https://dev.to/dev48v/webgpu-i-simulated-250000-particles-entirely-on-the-gpu-in-the-browser-2o0f
ਵਿਕਲਪਿਕ ਲਰਨਿੰਗ ਕਮਿਊਨਿਟੀ (Optional learning community): https://dev48v.infy.uk/techfromzero.php