End-to-end testing for web games

A minimal setup that just works

 Posted on April 30, 2025  |  8 minutes  |  1619 words  |  Barthélemy Paléologue

Hello everyone!

It’s been a while since I last posted. I was busy getting a job among other things, but now I’m back, and I have been cooking!

TLDR

Introduction

In the past few months, my space exploration game, Cosmos Journeyer, has been growing quite a lot, creating new challenges that some of you are probably familiar with if you are making any large project.

[Read More]

Ocean Simulation with FFT and WebGPU

Jerry Tessendorf's ocean simulation meets Tri-planar mapping

 Posted on March 20, 2024  |  16 minutes  |  3250 words  |  Barthélémy Paleologue

Introduction

It’s been a few month since I started pondering making a better ocean for Cosmos Journeyer’s procedural planets. To have actual waves moving around and not just a scrolling normal maps would make a significant difference in visual quality.

Coincidentally, I was also taking a course on computer animation (INF585) at Ecole Polytechnique, and I had the opportunity to choose my final project. Long stroy short, I decided to implement Jerry Tessendorf’s FFT-based ocean simulation on WebGPU, and this is my project report.

[Read More]

The Compute Shader Tutorial #2

Uniform buffers

 Posted on December 3, 2023  |  6 minutes  |  1115 words  |  Barthélemy Paléologue

Hello again! This is the second part of my compute shader series. If you haven’t read the first part yet, you can find it here.

Now that we know how to create simple compute shaders, we will see how to parameterize them with uniforms.

Uniformity at its finest

Uniformity at its finest

No, not that kind of uniform!

What are shader uniforms?

Last time we added 2 arrays on the GPU. What if we wanted to add the first one to twice the second one? We would have to change the underlying WGSL code to do so.

[Read More]

The Compute Shader Tutorial #1

Let's start from the beginning

 Posted on November 26, 2023  |  10 minutes  |  2109 words  |  Barthélemy Paléologue

Cover image

Welcome to my tutorial on compute shaders using WebGPU and BabylonJS! It is meant to be accessible to beginers and then to provide concrete use cases of compute shaders in the context of terrain generation and grass rendering.

What is a compute shader?

Let’s say you have an array of numbers like this:

let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

Now if you want to add 1 to each number, you can do it like this:

[Read More]