𝗪𝗲𝗯𝗚𝗣𝗨: ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ 'ਤੇ 250,000 ਕਣ (particles)
ਅੱਜ 50ਵਾਂ ਦਿਨ ਹੈ। ਇਹ ਹਰ ਰੋਜ਼ ਜ਼ੀਰੋ ਤੋਂ ਨਵੀਂ ਤਕਨਾਲੋਜੀ ਬਣਾਉਣ ਵਾਲੀ ਮੇਰੀ ਸੀਰੀਜ਼ ਦਾ ਆਖਰੀ ਦਿਨ ਹੈ।
ਮੈਂ ਇਸ ਸੀਰੀਜ਼ ਨੂੰ ਖਤਮ ਕਰਨ ਲਈ WebGPU ਨੂੰ ਚੁਣਿਆ ਹੈ। WebGPU ਤੁਹਾਨੂੰ ਬ੍ਰਾਊਜ਼ਰ ਦੇ ਅੰਦਰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਆਪਣੇ GPU 'ਤੇ 250,000 ਕਣਾਂ (particles) ਦਾ ਸਿਮੂਲੇਸ਼ਨ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦਾ ਹੈ।
ਤੁਹਾਡੇ CPU ਵਿੱਚ ਕੁਝ ਤੇਜ਼ ਕੋਰ (cores) ਹੁੰਦੇ ਹਨ। ਤੁਹਾਡੇ GPU ਵਿੱਚ ਹਜ਼ਾਰਾਂ ਸਧਾਰਨ ਕੋਰ ਹੁੰਦੇ ਹਨ। 250,000 ਕਣਾਂ ਨੂੰ ਹਿਲਾਉਣ ਲਈ, ਇੱਕ CPU ਉਹਨਾਂ 'ਤੇ ਇੱਕ-ਇੱਕ ਕਰਕੇ ਕੰਮ ਕਰਦਾ ਹੈ। ਇੱਕ GPU ਇੱਕੋ ਸਮੇਂ ਹਜ਼ਾਰਾਂ ਕਣਾਂ 'ਤੇ ਕੰਮ ਕਰਦਾ ਹੈ।
WebGPU, WebGL ਦਾ ਆਧੁਨਿਕ ਉੱਤਰਾਧਿਕਾਰੀ ਹੈ। ਇਹ ਤੁਹਾਡੇ ਹਾਰਡਵੇਅਰ 'ਤੇ ਆਮ ਪ੍ਰੋਗਰਾਮ ਚਲਾਉਣ ਲਈ compute shaders ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ।
ਇਹ ਕਿਵੇਂ ਕੰਮ ਕਰਦਾ ਹੈ:
- ਤੁਸੀਂ GPU ਨੂੰ ਪ੍ਰਬੰਧਿਤ ਕਰਨ ਲਈ ਇੱਕ device ਬਣਾਉਂਦੇ ਹੋ।
- ਤੁਸੀਂ position ਅਤੇ velocity ਵਰਗੇ particle data ਨੂੰ ਰੱਖਣ ਲਈ ਇੱਕ buffer ਬਣਾਉਂਦੇ ਹੋ।
- ਤੁਸੀਂ ਇੱਕ ਵਾਰ ਡੇਟਾ ਨੂੰ GPU 'ਤੇ ਅਪਲੋਡ ਕਰਦੇ ਹੋ।
- ਤੁਸੀਂ ਹਰਕਤ (movement) ਨੂੰ ਸੰਭਾਲਣ ਲਈ ਇੱਕ compute shader ਲਿਖਦੇ ਹੋ।
Compute shader ਇੱਕੋ ਸਮੇਂ ਹਰ ਕਣ ਲਈ ਇੱਕੋ ਜਿਹੀ ਲੌਜਿਕ (logic) ਚਲਾਉਂਦਾ ਹੈ। ਡੇਟਾ GPU 'ਤੇ ਹੀ ਰਹਿੰਦਾ ਹੈ। ਇਹ ਹਾਰਡਵੇਅਰ ਨੂੰ ਛੱਡੇ ਬਿਨਾਂ compute ਸਟੈਪ ਤੋਂ render ਸਟੈਪ ਤੱਕ ਜਾਂਦਾ ਹੈ। ਇਹ ਰਫ਼ਤਾਰ ਸਿਮੂਲੇਸ਼ਨ ਨੂੰ 60fps 'ਤੇ ਚਲਾਉਣ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦੀ ਹੈ।
WebGPU ਬ੍ਰਾਊਜ਼ਰ ਦੇ ਅੰਦਰ ਮਸ਼ੀਨ ਲਰਨਿੰਗ (machine learning) ਅਤੇ ਭਾਰੀ ਕੰਪਿਊਟੇਸ਼ਨ (heavy computation) ਲਈ ਅਧਾਰ ਬਣ ਜਾਵੇਗਾ। ਇਹ ਵੈੱਬ ਡਿਵੈਲਪਮੈਂਟ ਦੇ ਭਵਿੱਖ ਲਈ ਇੱਕ ਮਹੱਤਵਪੂਰਨ ਸਾਧਨ ਹੈ।
ਇਸ ਸੀਰੀਜ਼ ਨੂੰ ਫਾਲੋ ਕਰਨ ਲਈ ਤੁਹਾਡਾ ਧੰਨਵਾਦ। ਤੁਸੀਂ ਹਰ ਪ੍ਰੋਜੈਕਟ ਦਾ ਪੂਰਾ ਆਰਕਾਈਵ ਇੱਥੇ ਲੱਭ ਸਕਦੇ ਹੋ।
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