Today we are releasing Threlte 8, a significant milestone that marks a leap forward in performance, flexibility, and developer experience. This release has been cooking for the last 6 months. We’re super excited about the potential it unlocks for the next chapter of 3D graphics on the web.
The new features of Svelte 5 are groundbreaking for us as developers and embracing it was also an opportunity to refine the existing APIs. Furthermore, a lot has been happening within the world of Three.js. We’ve carved the path for Threlte to take advantage of those developments too.
What’s new in Threlte 8?
Threlte 8 is packed with enhancements in @threlte/core and updates in all our
other packages. Here are the highlights:
All-new <T> component
The universal <T> component has been reduced in
complexity all while adding features and flexibility that were just not
possible before.
- Props are now evaluated individually
attachgot a lot more powerful- Automatic disposal is more transparent and
- Events have been algined with svelte 5
New @threlte/extras components
We’ve added a lot of new things to play around with in @threlte/extras including:
<AsciiRenderer>,
<CubeCamera>,
<MeshDiscardMaterial>,
<RadialGradientTexture>,
<LinearGradientTexture>,
useViewport,
<HUD>,
<Resize>,
<meshBounds>,
<Detailed> and
<View>.
Custom type support for <T>
Plugins such as
interactivity now expose
types which can be added to your ambient type definitions for the <T>
component to pick up. Event handlers and custom <T> component objects are now
type-safe.
Fixed frame physics
@threlte/rapier now supports fixed frame
physics letting you craft simulations with
predictability and consistency.
Threlte plugin API
The Plugin API got an update to fully embrace Svelte 5’s reactivity model. The doc page also had an update to better introduce the API’s capabilities.
This is the WebGPU way
Threlte 8 introduces a clear path for using WebGPU. Threlte requires minimal changes to projects in order to start using three.js’s new WebGPU renderer and we’ve also outlined how to get started with three’s new shading language - TSL.
A new package appears
An alpha release of Threlte Studio is part of this release 🎉 It’s a step towards visual editing; letting you tweak values in browser and then automatically having those changes written into your code. Theres a guided tour to help you get started. We hope it helps get things where you want them 🚀😀
How to migrate to Threlte 8
There are breaking changes. Threlte 8 is not backward-compatible but we’ve tried our best to cover the details within our migration guide. For further help, reach out to us on discord.
Built with the community, for the community
This rewrite was a team effort with great contributions from the community.
Thank you to everyone who tested out any of our @next releases. We’re immensely
grateful for the time, talent, and passion of our community. You guys rock 😃
What’s next?
We decided to deprecate the npm create threlte command. We’re excited about
Svelte’s new sv CLI to incorporate third party packages and we’re going to
offer Threlte as a package to be installed with sv in the near future.
We’d love to hear about what everyone makes with Threlte 8! Take it for a spin, explore the new documentation, and start building your next 3D application with the super powers of Threlte 8 🎉