Babylon Native: The Journey So Far

“Enabling cross-platform native apps with the power of Babylon.js” — This was the goal behind Babylon Native when the team first announced the project last year in March. Ten months later, this undertaking is now a reality with a first preview that will be available at the end of February, along with the 4.1 release of Babylon.js.

Same JavaScript code rendering a full 3D scene (even with physics!) on the Web and on a Win32 application (demo video | code)

A Different Approach to Render 3D Cross-Platform

To better understand where Babylon Native sits, let’s start by looking into different ways to render 3D cross platform using Web technologies.

  • 3D embedded with browser technologies You can package your Web site into a Progressive Web app, an Electron app or an embedded WebView. In this case, as it is enabled by browser technologies, it still relies on cross-platform standards like WebGL, WebXR, Web Audio etc.
  • 3D in native applications —In Babylon Native, you still use Web technologies (e.g. JavaScript) to code your application but, this time, it runs on native APIs. The Babylon Native Runtime runs your application on platform native graphics APIs (DirectX on Windows, Metal on iOS/MacOS, OpenGL on Android and Vulkan in the future).

Use Cases and Advantages

During our discussions with early partners, this approach has driven a lot of interest for various reasons. Below are some of the use cases and advantages that came up.

Babylon Native running on Android
  • File size for mobile apps — A large file size can impact the adoption of a mobile application (for instance on iOS, after 200MB the user is presented with a warning message of a large app size before downloading over-the-air). Babylon Native should be about a few tens of MB, the biggest piece being by far the JavaScript engine (approx. 20MB).
  • Broad developer access — The use of Web technologies to develop an application allows a broader set of developers and content creators to take advantage of the platform. Development iteration time is shorter and the application code can even be updated and reloaded on the fly since there is no compilation.

Building Apps with Babylon Native

Babylon Native works by running Babylon.js inside a JavaScript context, therefore most of the code written to work in Babylon.js will work in Babylon Native. Besides a few exceptions, you’ll benefit from all the features and rapid evolution of the Babylon.js framework in your native applications.

Sample Babylon.js code where only DOM related code would need to be modified
The first step toward Babylon Native and React Native sharing a JS context

Getting Your Hands on It

There is still a lot of work to be done before being production ready, but you can already take a look at it to better understand the project — and start thinking if it could be part of your future plans.

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

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