Newsletter โ Issue 018
๐ฅ Headlines
You may have heard that Unity is trying to introduce a Runtime
Fee based on installs for games
that earned more than $200,000 in the past 12 months and have at least 200,000 lifetime installs.
This also affects games that have already been released. To the surprise of no one except the genius
executives who came up with this idea, the community is not happy. Unity received a ton of backlash
and has already backpedaled on some of the new rules. Web games, for instance, are now exempt from
this fee. They will soon announce their revised pricing.
This fiasco has led to a surge of interest in Godot, but if you have Unity refugee friends looking for new engines, send them over to ๐ Web Game Engines & Libraries! In particular,
PlayCanvas,
Rogue Engine (editor for Three.js),
Babylon.js,
Needle Engine, and
Cocos may fulfill their needs.
In other news, WebGameDev.com (yes, this website) is now open source!
It is built with Nextra, so itโs a mix of Markdown and React. Let me know on
Discord (@verekia) or Twitter if you would
like to contribute!
๐ผ Jobs
- Novablocks is a browser-native gaming platform that enables teenagers to create and play user-generated games instantly. Having recently closed funding, theyโre looking to recruit a world-class team to join them:
- Gameplay Engineer (Three.js/JS) - As a gameplay engineer, you will design and build engaging game mechanics that will be used by creators and players.
- Game Engine Developer (JS) - As a game engine developer, you will build and optimise engine systems that will be used by other developers and creators in our platform.
๐ Engines & Libraries
Three.js r156 โ See the changelog and migration guide.
R3F v8.14 โ Fixes and React Native experiments.
Drei v9.84 โ MotionPathControls, Outlines, plane support for SpriteAnimator.
TresJS 3.1.0 โ Vue Devtools are back, re-instancing of Three objects.
TresJS Cientos 3.2.0 โ Adds MeshGlassMaterial, useVideoTexture, CameraControls.
Threlte 6 is out! And they are organizing a hackathon starting on October 15th.
Phaser 3.61.0 Beta 2 โ See the changelog and announcement.
PixiJS 7.3.0 โ See the changelog. There was also a ๐ Pixi AMA that covers Pixi v8, among other things.
Babylon.js v6.21.1 โ See the changelog.
Excalibur.js v0.28.0 (video) by Erik Onarheim โ Arbitrary raycasting, text wrapping, custom shaders per actor, post-processing improvements, Aseprite plugin native file support, input mapping, and more.
๐ Tools
MeshParallaxMaterial (demo, source) by Marcin J. Here is a BabylonJS equivalent by Mirkowo.
Natuerlich (repo) by coconut-xr โ WebXR interactions library with
React Three Fiber bindings.
Triplex 0.57.0 โ Edit any child element, filter components, elements, and props, custom provider support.
R3F + Rapier Character Controller updates by Andrew Chen.
use-spritesheet by Ben Follington โ 2D sprite animation helpers with Aseprite support.
Confetti (demo, source) by Anderson Mancini โ Easily add confetti explosions to your scene.
TresLeches โ GUI control panel for Vue (and TresJS) by Alvaro Sabu.
vue-tres-starter (repo, demo) โ TresJS starter kit by Francesco Michelini.
Shaderfrog 2.0 by Andrew Ray โ A hybrid GLSL shader graph/code editor with support for Three.js, Babylon.js, and PlayCanvas. A JavaScript API is being worked on.
glTF-Compressor (article) by Khronos โ Optimize performance and the memory used by your models.
- ๐ค recast-navigation-js by Isaac Mason was rewritten to expose more of the underlying Recast and Detour libraries while still offering a high-level API. Check out the online navmesh generator.
- ๐ Ready Player Me Animation Library (repo) โ Use only allowed with Ready Player Me avatars.
๐ฌ Videos
WebGPU - Rendering the future in Real-Time by Visionary 3D
A proper look at WebGPU for native games by Madrigal
A Closer Look at 3D Rendering talk at CityJS Belgrade (slides) by Maya Nedeljkoviฤ Batiฤ
WebGL Tutorial - Hello, Triangle! by Indigo Code
glTF: Transforming 3D Asset Delivery at SIGGRAPH 2023 by Khronos
Water Reflection using Three.js (tutorial series) by Robin Payot
How to Create a Multiplayer Game with Three.js and Blender by Pandawoan
Sims-like Multiplayer Game with R3F and Socket.io (tutorial series) by Wawa Sensei
Build an Airplane Flying Game with R3F by Irradiance
TresJS Materials by Alvaro Sabu
How to add 3D to Astro using TresJS by Alvaro Sabu
Make A 3D GitHub Skyline With Threlte by Joy of Code
Creating Casual Game with PlayCanvas by Cem Demir
Babylon Chronicles podcast by BabylonJS
Introducing Node Geometry by Deltakosh
Babylon Journey: A Series On Babylon.js by Gabriel Baker
From a new Unity project to Live Sync with Three.js by Needle Engine
Online Multiplayer JavaScript Game Tutorial (6 hours, uses socket.io, no engine) by Chris Courses
JavaScript Platformer Tutorial with Kaboom.js (7 hours) by JS Legend
- ๐บ Athena Crisis Map and Campaign Editor by Christoph Nakazawa
- ๐ I Tried Simulating The Entire Ocean by Acerola (congrats on 100K subs!)
- ๐ Get Good at Blender โ Practical challenges by Grant Abbitt
โ๏ธ Articles
Whatโs New in WebGPU (Chrome 117) and Chrome 116
Painting with Math: A Gentle Study of Raymarching by Maxime Heckel
R3F: The Ultimate Guide to 3D Web Development (paid course) by Wawa Sensei
Normalized 3D cursor and focal-point depth of field by 0xca0a
WebXR is the future of VR by kayh
Drawing points with Babylon.jsโฆ by Popov
Babylon.js: A Cross-Platform Web-First Game Engine by Jason Carter
Backward Compatibility in Babylon.js by Raanan Weber
- ๐ BLUMGI: Reaching 100M players in 2 years as an indie dev by Loรฏc
- ๐ค Using a RNN for 2D Tile Map Synthesis by John โLinโ
- ๐ Experience of creating JavaScript Games podcast by JS GameDev Summit
๐ฎ Games
Atomize by Peter Adams โ New musical experience from A Number From the Ghost ๐ต
Slash Saber (source) (video) by Jan Pรกnek โ Slash bamboos to progress! (aim far ahead) ๐ฅท
The Aviator (source) by enpitsulin โ The first TresJS game based on Karim Maaloulโs tutorial ๐ซ
Arcane Archer by OnRush Studio โ Action-RPG with very polished gameplay and graphics ๐น
Village Craft by Alex So โ Collect resources and build your village ๐ช
WipEout by Dominic Szablewski (article) โ Complete rewrite from leaked PSX code ๐
Elysian (video) by Felix Z โ Multiplayer VR shooting game ๐ซ
The games that won React Jam (best game category) are:
Keep the hype UP! by console_buche and Neolectron ๐
Disco Warrior by Brian Breiholz ๐ชฉ
Chop Chop by Jason McLeod and Gustavo Vituri ๐ฝ
Also, check out the Multiplayer Madness winners and js13k entries (voting is open).
โจ Demos
Elysium (announcement and video) by The Ebenezer
Sveltroid (source) by Tyler Johnson
Upstreet metaverse by Upstreet
Romp Island by Tim Jones
Diggable Volumetric Terrain (tech post) by Ethan Hermsey
Lusion website by Lusion
Text geometry (demo) by vis_prime
Magnifying glass reveal effect by 0xca0a
3D Gameboy Emulator (source) by Bruno Marques
The Predator Cloak Material (source) by Anderson Mancini
Stylized Water Shader by Faraz, inspired by Alex Ameyeโs article.
Threlte FPS controller (demo) by Marcin J
HDR Corrupted Fireball (demo) by Benjamin Guignabert
Liked this issue? ๐ฆ Retweet it, join our Discord, and Subscribe below!