Newsletter – Issue 007

📆 2023-01-31

🔥 Headlines

The Khronos WebGL + WebGPU meetup (opens in a new tab) is today, January 31st, at 5pm PST (8pm EST, 2am Central Europe) and will include presentations by Ken Russell (opens in a new tab) (Khronos, Google), mrdoob (opens in a new tab), Kelsey Gilbert (Mozilla) and John Anderson (Google Earth). Omar Shehata (opens in a new tab) writes recaps (opens in a new tab) of those recurring meetups.

Chrome Canary on Android now supports WebGPU (opens in a new tab) if you toggle the #enable-unsafe-webgpu flag.

Automerge 2.0 (opens in a new tab) got released. It's a Conflict-free Replicated Data Type (opens in a new tab) (CRDT) library for Rust and JavaScript to facilitate state synchronization between Peer-to-Peer clients or client and server. Here is an introduction (opens in a new tab) to the concept. It's like Git for objects, with automatic conflict resolution (opens in a new tab). CRDTs are used for real-time collaborative applications (like Google Docs or Figma), offline-first apps, and P2P decentralized apps and games. Not something you'll need for most games, but it's good to know that it exists if you someday run into concurrency issues when multiple players try to mutate a game state simultaneously. Yjs (opens in a new tab) is a popular alternative.

I listed the download sizes of all games on the ✨ Games & Demos (opens in a new tab) page and 🎮 WebGamer.io (opens in a new tab), which you can see on game thumbnails on both pages. That's the total transferred size from hard refresh to actual gameplay. The smallest games boot with as little as 3MB and go up to 87MB. With a fast CDN, parallelized downloads, and a background download strategy, games under 20MB or even 30MB can load quickly or almost instantly. On mobile, 53% of users (opens in a new tab) leave a web page if it takes more than 3 seconds to load, so try to show the main menu as fast as possible and keep downloading well-compressed and optimized resources in the background.

⬆️ Updates

Three.js r149 (opens in a new tab) – Includes a new three-bvh-csg (opens in a new tab) example (opens in a new tab) by Garrett Johnson (opens in a new tab) (changelog (opens in a new tab), migration guide (opens in a new tab)).
Drei v9.55 and v9.56 (opens in a new tab) – Adds <Bvh> (opens in a new tab) by 0xca0a (opens in a new tab) to very conveniently improve raycasting performance via three-mesh-bvh (opens in a new tab). OrbitControls and CameraControls performance improvements (opens in a new tab) by Faraz (opens in a new tab).
R3F-Perf (opens in a new tab) v7.0.0 (opens in a new tab) by Renaud Rohlinger (opens in a new tab) – Headless mode, tree shaking, new CPU metric and report system.
PlayCanvas (opens in a new tab) – Improves glTF Editor imports (opens in a new tab) with camera, light, and Draco-compressed mesh support.
Babylon.js v5.44.0 (opens in a new tab)
Needle (opens in a new tab) 2.61.0-pre (opens in a new tab)

✍️ Content

✨ Games & Demos

🎮 Hockey Pockey (opens in a new tab) by krazybubbler (opens in a new tab) – Uses React Three Fiber (opens in a new tab) and use-cannon (opens in a new tab). 🏒
✨ BugBall (opens in a new tab) by John Cotterell (opens in a new tab) (source (opens in a new tab)). Go, cute red robots team! ⚽️
✨ Hand tracking experiment (opens in a new tab) (video (opens in a new tab)) by Xavier (Jack) (opens in a new tab). 👋
✨ WebXR Portals (opens in a new tab) by Noeri Huisman (opens in a new tab). 🟠🏃🔵

See more on the ✨ Games & Demos (opens in a new tab) page or 🎮 WebGamer.io (opens in a new tab).

On WebGamer.io (opens in a new tab), you can now ⭐️ save games to your Favorites, ⬇️ install the portal as a PWA (opens in a new tab), and hover thumbnails to see 🖼 gameplay preview pictures and download sizes.

Liked this issue? 🐦 Retweet it, join our Discord, and Subscribe below!

It takes me ~10 hours to make an issue like this! Please consider ❤️ sponsoring my work like these lovely folks:

Issue 008 Issue 006