Babylon.js 5.0: Beyond the Stars

WebGPU

WebGPU represents the next evolution in browser to GPU communication. The W3C’s “GPU for the Web” Community Group built it from the ground up with performance in mind. WebGPU offers web developers access to some of the most advanced modern graphics capabilities such as compute shaders and lightning-fast texture loading. We have been actively participating in the WebGPU Workgroup from its earliest days and are proud to announce that Babylon.js 5.0 offers FULL support for WebGPU.

Cross-Platform Native Deployment

We know developers want to reach as many people as possible with as little effort as possible. We are proud to announce that Babylon.js 5.0 unlocks the ability to use the Babylon.js API to develop web AND native applications. Whether you’re targeting Web, Windows, Mac, iPhone, or Android Phone, Babylon.js 5.0 allows you to write your rendering code once and deploy it across the platforms of your choice, using the browser OR as native applications!

Space Pirates Demo

What would the Babylon.js 5.0 release be without an appropriately themed demo to go with it? The Babylon Space Pirates Demo is designed to give game developers a tiny glimpse at the amazing possibilities of the Babylon.js Platform.

Animation Curve Editor

Up until now, creating and modifying animation data in a rendering engine can be complicated and verbose. Not anymore! Babylon.js 5.0 adds a built-in Animation Curve Editor (ACE), making it incredibly easy to create and modify animation data directly in your Babylon scene. Also, as with all Babylon.js Platform tools, you can save your animation data to the Babylon.js Snippet Server and load it back into your Babylon.js scene with one single line of code!

Performance Profiler

Performance is one of the most important things to keep on the front of your mind as you create advanced interactive 3D experiences. After all, you don’t want to create an awesome experience that only runs on the most high-end graphics cards, right? You want to create something that EVERYONE can enjoy, and this means keeping track of and optimizing the performance of your scene. Babylon.js 5.0 makes performance debugging and management a breeze with the introduction of the new Performance Profiler. This handy tool allows you to see a real time graph of key performance indicators of your scene, all hooked up live! Make a change, see the impact on perf. It’s really that simple!

Unlimited Morph Targets

No matter what you call them, Blend Shapes, Shape Keys, or Morph Targets, Babylon.js 5.0 adds rocket fuel to your ability to use influenced vertex positions. This new feature now gives you literally unlimited amounts of Morph Targets. Want to have a complex animated face with thousands of Morph Targets to get that perfect expression? Now you can, all in the web, all for free!

GUI Editor Beta

Babylon.js has a powerful GUI system that offers countless widgets, controls, and properties to help you create rich GUIs. With Babylon.js 5.0 that powerful system becomes far simpler to use with the introduction of the GUI Editor Beta. While still in active development, the GUI Editor Beta is a rich and modern tool, allowing you to create the perfect GUI with a simple and intuitive drag-and-drop interface. Say goodbye to thousands of lines of GUI code and hello to a world of design with the GUI Editor Beta and loading your creations with a single line of code!

Order Independent Transparency

Rendering transparent objects is complicated! The Babylon.js Platform has always strived to make it as easy as possible to help you inform the system of rendering order, alpha index, run depth-prepasses, and much more, so your scene can look correct. With Babylon.js 5.0 we’ve wrapped a bow on it all. All of the complexity of rendering transparent objects can now disappear with one single, simple line of code:

New Node Material Nodes

The Node Material Editor is one of the most advanced tools available in the Babylon Platform. One simple UI that helps you generate stunning GLSL shaders with ease. With Babylon.js 5.0 the Node Material gets even better with the introduction of several powerful new nodes!

WebXR Advancements

WebXR is an incredible web standard allowing web developers to create amazing cross-browser XR experiences. Using WebXR to add a mobile AR component to your web site can be a simple and fun way to engage your readers/users even further. While the technology to render world-locked 3D objects has existed in Babylon.js for some time, Babylon.js 5.0 steps the beauty-factor up several notches with the introduction of Light Estimation. This powerful yet easy-to-use new feature allows your Babylon.js scenes to estimate the light in your real-world location and automatically match the lighting and shadows of your virtual world-locked object. This creates a cutting-edge level of immersion between the physical and digital worlds…and it’s all here in Babylon.js…all for free! Babylon.js 5.0 also adds support for WebXR image tracking and WebXR Layers!!!

glTF Updates

The Babylon.js Platform prioritizes support for the absolute latest and greatest advancements to the glTF file format. This means every new version of Babylon.js unlocks new beautiful advancements in rendering capabilities, and Babylon.js 5.0 turns up the heat! With full support for KHR_materials_volume, KHR_materials_transmission, and KHR_materials_ior, you can now render some absolutely STUNNING visuals!

Mixed Reality Toolkit for Babylon.js

Babylon.js 5.0 also adds updated support for the world’s most advanced 3D interface component library, Mixed Reality Toolkit. This advanced library makes it incredibly easy to add advanced XR UX elements into your Babylon.js scenes such as: holographic slates, 3D Sliders, Touch Holographic Buttons, Touch Mesh Buttons, and much, much more!

Asset Librarian

The Babylon.js Platform offers a large library of free Creative Commons 0 assets available for you to use in your Babylon.js scenes, completely for free. With Babylon.js 5.0, accessing these assets is easier and faster than ever! The new Asset Librarian brings a new Assets namespace that you can use in your projects to easily access the 200+ free assets to make your Babylon.js scenes soar.

Material Plugin Manager

When it comes to creating real-time shaders power, performance, and flexibility are critical! Babylon.js 5.0 brings introduces a brand new feature that doubles down on all of three. The Material Plugin Manager gives you the ability to add custom code to any Babylon.js shader. This means that you can fully customize any advanced shader, such as PBR, to go even further. The Material Plugin Manager provides developers with the flexibility to fully customize the power, performance, and look of any shader!

Dev Stories Documentation

Babylon.js 5.0 adds a whole new category of documentation called “Dev Stories.” These new tutorials are designed to walk you, step-by-step, through some common scenarios that many Babylon.js developers ask about. From setting up a Babylon.js project quickly, adding interactive 3D elements to your e-commerce site, to deploying your Babylon.js project to a Native Application, “Dev Stories” are rich, deep, detailed tutorials aimed at helping you take your project from idea to reality!

“Going The Distance With Babylon.js” A New Book

We are also incredibly excited to share that alongside Babylon.js 5.0, community member and talented author Josh Elster has written an entirely new book about Babylon.js 5.0. Published by Packt Publishing, “Going The Distance With Babylon.js” is written from the mindset of taking you through the entire development process of building a game with Babylon.js from the ground up. We are thrilled to partner with Josh and Packt on this book and think it’ll be a great addition to your library and accelerate your Babylon.js learning journey.

Much Much More

Wow that’s a lot, but that’s only the tip of the iceberg! Improved Shadow Performance, Vertex Animation Textures, a brand-new Build System, there’s more to Babylon.js 5.0 than you can imagine! Want a full view of everything that’s new? For a full list of features, enhancements, and fixes you can head on over here.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Babylon.js

Babylon.js

Babylon.js: Powerful, Beautiful, Simple, Open — Web-Based 3D At Its Best. https://www.babylonjs.com/