Babylon Native: The Journey So Far

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 in the browser — You can use a JavaScript framework like Babylon.js which renders a 3D application within a browser. Browsers runs on standard like WebGL, WebXR, Web Audio which ensure the cross-platform aspect of your code.
  • 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.

  • Single code base across Web and Mobile apps — Being able to write once and re-use the code, came up very often as it reduces cost of developing and maintaining multiple applications.
Babylon Native running on Android
  • glTF consistency and conformance — Support for the latest PBR material extensions and continued conformance will come right out of the box by using Babylon.js. This is particularly important for 3D representation of product in e-commerce scenarios where customers need the highest level of fidelity. For instance, the PBR Sheen material needs to accurately represent the fabric of a couch (imagine being able to picture it in your living room via AR before ordering it online).
  • 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.



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: Powerful, Beautiful, Simple, Open — Web-Based 3D At Its Best.