Newsletter โ Issue 022
๐ฅ Headlines
Discord shared their plan for the future (opens in a new tab) and launched their Embedded App SDK (opens in a new tab) for Activities (NPM package (opens in a new tab)). Multiplayer web games can now be played directly within Discord via iframes, with users connected via voice chat. The SDK lets you authenticate players and manage how your game interacts with Discord. Check out the official starter (opens in a new tab), Hugo Duprez (opens in a new tab)'s starter (opens in a new tab), and Colyseus (opens in a new tab)' starter (opens in a new tab) (article (opens in a new tab)).
๐ Safari 18 beta (opens in a new tab) was announced at Apple's WWDC (opens in a new tab) developer event. WebXR is no longer behind a feature flag, and immersive-vr
sessions and hand tracking are available by default (opens in a new tab). Even though WebGPU has been available in the Technology Preview (opens in a new tab) since last December, it is unfortunately not part of this release. So, you will have to support WebGL for a while if you support Safari. On the Web Apps (PWAs) front, if a user has your web app installed and clicks a link pointing to your domain from outside their browser (like a link shared on Discord or Slack), it will open in the web app. Unfortunately, there are still no Install Prompts (opens in a new tab) on Safari, so you will have to keep explaining to your users how to install your web app manually.
The Meta Quest Browser now supports WebGPU (opens in a new tab) since version 32.0!
Babylon.js 7.0 (opens in a new tab) is out! Check out the release video (opens in a new tab). This major version includes a procedural Node Geometry (opens in a new tab) (live editor (opens in a new tab)), Global Illumination (opens in a new tab), Gaussian Splats (opens in a new tab), Ragdoll Physics (opens in a new tab) and better WebXR support.
The winners of Gamedev.js Jam 2024 (opens in a new tab) have been announced. The theme was Power.
Athena Crisis (opens in a new tab) by Christoph Nakazawa (opens in a new tab) is now open source (opens in a new tab) and funding contributions! Check out the repo (opens in a new tab).
๐ฅญ Jamango! web game raises $2.5M (opens in a new tab) โ Co-founded by Adam Dalton (opens in a new tab), Richie Whelan (opens in a new tab), and Jeremy Klarenbeek, Jamango! is a browser-based multiplayer user-generated content platform. It is currently in closed alpha, but you can check out the homepage (opens in a new tab) to get an idea of what's coming. I have been working for Jamango! for several months, and this project is truly promising. Remember this name, and keep an eye out for the public release!
โญ๏ธ Sponsor
Poki (opens in a new tab) is on a mission to create the ultimate online playground โ where players and developers come together to play and create! Together with a growing 350+ game developer community and 65 million players each month, we're creating a new standard for web games. Interested in working together? Share your game with us (opens in a new tab)!
Poki will be rolling out its new playtesting (opens in a new tab) flow soonโข๏ธ, which allows you to get unlimited free playtests of your game with Poki players! Just upload a web build of your game and start watching, no strings attached! The official announcement is still to come, but if you have questions, feel free to ping the team on the Web Game Dev Discord (opens in a new tab)!
๐ Engines
- Three.js r165 (opens in a new tab), r164 (opens in a new tab), and r163 (opens in a new tab) (changelog (opens in a new tab), migration guide (opens in a new tab)).
- Three.js Shading Language (opens in a new tab) โ First draft of the TSL spec, which allows you to write shaders in JavaScript. Check out Bruno Simon's tweets (opens in a new tab) for examples (portal shader (opens in a new tab)).
- Drei Vanilla v1.16.0 (opens in a new tab) โ
Cloud (opens in a new tab), adds
screenspace
to Outlines (opens in a new tab). - Drei v9.106.0 (opens in a new tab) โ
HLS (opens in a new tab) in
useVideoTexture (opens in a new tab),
gainmap (opens in a new tab),
envmap rotation and intensity, ScrollControls (opens in a new tab)
prepend
. - @threlte/extras 8.11.0 (opens in a new tab) โ Outlines (opens in a new tab), Text3DGeometry (opens in a new tab), InstancedSprite (opens in a new tab), Stars (opens in a new tab), Mask (opens in a new tab), ImageMaterial (opens in a new tab).
- Threlte Studio (opens in a new tab) is the upcoming editor of Threlte. Here is a sneak peek (opens in a new tab).
- TresJS v4 (opens in a new tab) - On-demand rendering, new useLoop, pointer events with event bubbling, primitives reactive obj and conditional rendering, Better disposal of resources.
- cientos v3.9.0 (opens in a new tab) โ Local canvas option for MouseParallax, Fit component, positional audio, LightFormer in Environment, Holographic Material, Ocean component, RoundedBox, mouse/touch props for camera-controls.
- PlayCanvas v1.71.0 (opens in a new tab), 1.70.0 (opens in a new tab), 1.69.0 (opens in a new tab) - Gaussian Splats (opens in a new tab), WebGPU Compute Shaders, convex hull collisions, dispersion extension support, temporal anti-aliasing (TAA). WebGPU is now supported in the editor (opens in a new tab).
- Phaser (opens in a new tab) โ A ton of ecosystem updates, including an upcoming new renderer (opens in a new tab), Phaser Compressor (opens in a new tab), Phaser Editor v4.0.2 (opens in a new tab), Phaser Sandbox v3 (opens in a new tab), Playable Ads Plugin (opens in a new tab), Discord Multiplayer Tutorial (opens in a new tab), Phaser Explorer (opens in a new tab), Create Game CLI (opens in a new tab).
- A-Frame v1.6.0 (opens in a new tab) โ Bug fixes, memory management and performance improvements. Execution order API.
- Wonderland Engine 1.2.0 (opens in a new tab) (and 1.2.1 (opens in a new tab)) โ Includes post-processing like Bloom and Tonemapping, HDR environment support, improvements to image-based lighting, animation blending, morph targets, and a JavaScript/TypeScript based editor API to write custom tools.
- Needle (opens in a new tab) 3.40.0-exp (opens in a new tab) โ Includes automatic LOD generation to improve performance and loading times.
- PixiJS 8.1.0 (opens in a new tab)
- ๐คบ Rapier 0.20.0 (opens in a new tab)
- Defold 1.8.0 (opens in a new tab)
- Construct R388 & R395 beta (opens in a new tab)
- Excalibur 0.29.2 (opens in a new tab)
- Cocos (opens in a new tab) 3.8.3 โ See changelog (opens in a new tab) (scroll down)
- WarmeY2K Engine (opens in a new tab) by Julien Rongiere โ PSX-style 3D engine.
๐ Tools
- glTF progressive (opens in a new tab) โ Automatic loading of mesh and texture LODs, by Needle Engine (opens in a new tab).
- Tree.js procedural tree generator (opens in a new tab) (repo (opens in a new tab)) by Dan Greenheck (opens in a new tab).
- three-pinata (opens in a new tab) by Dan Greenheck (opens in a new tab).
- Wiggle Bones (opens in a new tab) by Xavier (Jack) (opens in a new tab).
- ๐น๏ธ Mana Potion (opens in a new tab) (demo (opens in a new tab)) by me (opens in a new tab) โ Now with Vue, Svelte, and vanilla JS support.
- HTML23 (opens in a new tab) (demo (opens in a new tab)) live editor for pmndrs/uikit (opens in a new tab) by Bela Bohlender (opens in a new tab).
- three-fiber-webxr-toolbox (opens in a new tab) (video (opens in a new tab)) by sawa-zen (opens in a new tab).
- Triplex 67.4 (opens in a new tab) and an upcoming VS Code extension (opens in a new tab). Get in touch with Douges (opens in a new tab) to try it.
- tres-fps-controls (opens in a new tab) by Jaime Torrealba (opens in a new tab).
- ๐พ Jolt Physics v5.0.0 (opens in a new tab) by Jorrit Rouwe (opens in a new tab) โ See the list of new features (opens in a new tab).
- glTF-Transform v4 (opens in a new tab) by Don McCurdy (opens in a new tab) โ Performance improvements, new APIs for moving resources (materials, meshes, animations) between models, KHR_materials_dispersion and KHR_materials_diffuse_transmission.
- GLB UV Inspector (opens in a new tab) by Simon Harris (opens in a new tab) โ Quickly look at the UV's of a GLB.
- Model Viewer (opens in a new tab) 4.10.0 (opens in a new tab) by PlayCanvas (opens in a new tab) โ New camera controls. See changelog (opens in a new tab).
- ๐จ Khronos PBR Neutral Tone Mapper (opens in a new tab) โ True-to-Life Color Rendering with Three.js and Babylon.js support.
- Arwes (opens in a new tab) Futuristic Sci-Fi UI Web Framework by Romel Pรฉrez (opens in a new tab).
- ๐ Crocotile 3D (opens in a new tab) by Alex HW (opens in a new tab) โ Tile-based 3D modeling tool for low-poly pixel art.
- ๐ Smooth Voxels 2.3.0 (opens in a new tab) โ Three.js and A-Frame support, save animations from the Playground (opens in a new tab), new shapes.
- Colyseus 0.15.17 (opens in a new tab) โ Improves how stale rooms are cleared when using multiple processes.
- ๐ก PartyKit (opens in a new tab) by Sunil Pai (opens in a new tab) is joining Cloudflare (opens in a new tab).
- ๐ก LootLocker (opens in a new tab) โ Game backend platform.
- ๐ก Open Game Backend (opens in a new tab) by Rivet (opens in a new tab).
- ๐ก Edgegap (opens in a new tab) โ Game server hosting.
- ๐ก SpacetimeDB (opens in a new tab) (repo (opens in a new tab)) โ Database with custom logic support for multiplayer games.
- ๐ฐ 1D3 (opens in a new tab) โ Merchant of record and monetization.
- ๐ฐ Sanlo (opens in a new tab) โ Merchant of record and monetization.
๐ฌ Videos
- WebGL + WebGPU Meetup - March 2024 (opens in a new tab) by Khronos Group (opens in a new tab)
- ๐ Lerp smoothing is broken (opens in a new tab) by Freya Holmรฉr (opens in a new tab)
- ๐ How do Video Game Graphics Work? (opens in a new tab) by Branch Education (opens in a new tab)
- Zelda Wind Waker in the browser (opens in a new tab) by RobinPayot (opens in a new tab)
- Three.js Raycasting Tutorial for Beginners (opens in a new tab) by Dan Greenheck (opens in a new tab)
- Make Any 3D Model Explode, with R3F and Next 14 (opens in a new tab) by developedbyed (opens in a new tab)
- Make a Fall Guys Clone for Discord Activity (opens in a new tab) by Wawa Sensei (opens in a new tab)
- Coastal World Aesthetics (opens in a new tab) by Wawa Sensei (opens in a new tab)
- Loading 3D Models with Threlte (opens in a new tab) by Zoetrope Studios (opens in a new tab)
- Revolutionizing Game Development (opens in a new tab) (transcript (opens in a new tab)) with Will Eastcott (opens in a new tab) from PlayCanvas (opens in a new tab)
- Blender (opens in a new tab), Unity (opens in a new tab), WebXR in Blender (opens in a new tab), WebXR in Unity (opens in a new tab) mini tutorials for Needle Engine (opens in a new tab)
- Community Reel 2023 (opens in a new tab) by Wonderland Engine (opens in a new tab)
- Build a Virtual World Filled with Self-Driving Cars (opens in a new tab) (with no libraries!) by Radu Mariescu-Istodor (opens in a new tab)
- JavaScript Adventure Platformer Game Tutorial (opens in a new tab) by JS Legend (opens in a new tab)
- How to Make a Video Game - Godot Beginner Tutorial (opens in a new tab) by Brackeys (opens in a new tab)
- ๐๏ธ 3D web game dev jam! (opens in a new tab) with Brian Breiholz (opens in a new tab) on the JS Party (opens in a new tab) podcast
โ๏ธ Articles
- What's New in WebGPU (Chrome 126) (opens in a new tab) by Franรงois Beaufort (opens in a new tab)
- ๐ Choosing texture formats for WebGL and WebGPU applications (opens in a new tab) by Don McCurdy (opens in a new tab)
- ๐ Morphing and Vertex Animation Techniques (opens in a new tab) by Luiz Otavio Vasconcelos (opens in a new tab)
- ๐ Voxel Displacement Renderer (opens in a new tab) (video (opens in a new tab)) by Daniel Schroeder (opens in a new tab)
- Moebius-style post-processing (opens in a new tab) by Maxime Heckel (opens in a new tab)
- Rendering User Interfaces on the GPU (opens in a new tab) by Bela Bohlender (opens in a new tab)
- Building Your First Browser Game with Three.js and React (opens in a new tab) by Romain Herault (opens in a new tab)
- Transparently supporting both WebGL and WebGPU (opens in a new tab) by Deltakosh (opens in a new tab)
- Introduction to Babylon.js (opens in a new tab) by Jan Kaiser (opens in a new tab)
- Prefab Instancing in Wonderland Engine 1.2.0 (opens in a new tab) by David Peicho (opens in a new tab)
- Combining Pixi-React and HTML with Tunnels (opens in a new tab) by Jallen (opens in a new tab)
- Wave Function Collapse (opens in a new tab), Pathfinding (opens in a new tab), and NPC AI planning with GOAP (opens in a new tab) by Justin Young (opens in a new tab)
- Choosing your web game engine (opens in a new tab) by Poki (opens in a new tab)
- Optimizing Javascript for fun and for profit (opens in a new tab) by Rom Grk (opens in a new tab)
- Garbage Collection in V8 (opens in a new tab) by Roman Maksimov (opens in a new tab)
- ๐พ 2D Rigid Body Collision Resolution (opens in a new tab) by Kai Sassnowski (opens in a new tab)
- ๐ก Matchmaking Series: Ping (opens in a new tab) (in Call of Duty) by Activision (opens in a new tab)
- Unity sees WebGPU as a growing market (opens in a new tab) by Bryant Francis (opens in a new tab)
๐ฎ Games
- Simply Prop Hunt by Elanra Studios โ Hide-and-seek game in which you play as a Hunter or a Prop.
- Under the Red Sky by Federico Calchera & Dedra Games โ First-person 3D parkour game.
- Blumgi Soccer by Blumgi โ Shoot the soccer ball into the goal across various worlds.
- Stunt Car Extreme by Hyperkani โ Time trial driving game with stunts and jumps.
- Ragdoll Hit by Ericetto โ Control a ragdoll stickman to defeat all kinds of enemies.
- CaptainForever.io by Farbs โ Multiplayer game in which you build and fly a wireframe ship in space.
- Chroma by Logix Indie โ Link 4 or more shapes of the same color.
- Shift by Logix Indie โ Recreate a pattern by moving the rows of a hexagonal grid.
- Eggsolotl by Axol Studio โ Retro match-3 puzzle game in which you kick, lift, and throw eggs.
- Monster Match by Axol Studio โ Retro match-3 game in which you play as a lich defending its realm.
-
Food for Fish (opens in a new tab) (source (opens in a new tab)) by Kris Temmerman (opens in a new tab) โ Great-looking point-and-click adventure about underpants.
-
Equinox (opens in a new tab) by Little Workshop (opens in a new tab) โ An impressive 1st-person adventure in a spaceship. You've got to try this one!
-
Fabled Recipes (opens in a new tab) (repo (opens in a new tab)) โ by Vincent Douchin (opens in a new tab)
-
Marble Run Simulator (opens in a new tab) by Tiaratum Games (opens in a new tab) โ A marble machine construction game with great physics.
-
Pixaland (opens in a new tab) by Giorgi Nadiradze (opens in a new tab) โ A multiplayer sandbox game with a pixel art style.
-
Eternya Tactics (opens in a new tab) by Kainage Productions (opens in a new tab) โ Turb-based fantasy tactical RPG.
โจ Demos
- Stylized Castle WebGL demo (opens in a new tab) (article (opens in a new tab), repo (opens in a new tab)) by Oleksandr Popov (opens in a new tab)
- Sunday Afternoon (opens in a new tab) (repo (opens in a new tab)) by Faraz (opens in a new tab)
- BatchedMesh Instancing (opens in a new tab) (demo (opens in a new tab)) by Garrett Johnson (opens in a new tab)
- Depth peeling transparency (opens in a new tab) (demo (opens in a new tab)) by Garrett Johnson (opens in a new tab)
- R3F Camera animated along a curved path (opens in a new tab) (source (opens in a new tab)) by Michael Dobekidis (opens in a new tab)
- Car Physics mini-game (opens in a new tab) (source (opens in a new tab)) by Kryลกtof Toman (opens in a new tab)
Liked this issue? ๐ฆ Retweet it, join our Discord, and Subscribe below!