WebXR initialization fails (sometimes) - remove remote dependency?


Sometimes when I initialize WebXR using the default helper, I get the following error:

Uncaught (in promise) Unable to load the snippet 8RUNKL#3

inside WebXRNearInteraction._generateNewTouchPointMesh()

NodeMaterial.ParseFromSnippetAsync("8RUNKL#3", meshCreationScene).then(function (nodeMaterial) {
     touchCollisionMesh.material = nodeMaterial;

Would there be a way to remove the remote dependency and rely on my local packages only? For example bundling this NodeMaterial in @babylonjs/materials instead. This way we can remove a remote dependency (useful in offline scenarios, or in case of unavailability).

Or, is there a known workaround this? For example not using the default Helper to initialize WebXR but rather having a custom setup?

Thanks in advance.

1 Like

You could supply the option motionControllerOrbMaterial - I don’t know if default helper provides parameter:
BabylonJS/Babylon.js: Babylon.js is a powerful, beautiful, simple, and open game and rendering engine packed into a friendly JavaScript framework. (github.com)

What remote dependency is that? do you mean the snippet? I wouldn’t mind adding the option allowing you to override this if this is what you mean. i.e. - serve the snippet yourself and provide the URL to the near interaction module.

Indeed, I’m referring to the snippet hosted on the babylonjs website. I’m a bit of a noob when it comes to NodeMaterials, but I envision this Material, being part of the BabylonJS core package (WebXR) being part of the packages I already download on my machine (node_modules) so I can further distribute the Material in my production build, without the need to rely on a server being available to give me the Material.

I guess providing a URL could also work, but it means I have to host the material code somewhere myself - feels kinda wrong. Would there be a way to incorporate this Material into the @babylonjs/materials package instead, so the WebXR code only relies on ‘local’ code?

Appologies if this doesn’t make sense, but having a remote (non-explicit) dependency in the core code seems prone to errors (compared to serving the core right away in my JS bundles).

the node material is not the @babylonjs/materials package. there is no need for the materials package to load the node materials.

We usually follow the URL-replacement reference (in the rest of the framework), so I will follow the same architecture here.

Of course, I appreciate your input, and I’m actually not complaining just trying to find a reliable solution for the future. I think being able to host my own server to give snippets is a great feature (if implemented already) that would eliminate the need for a 3rd party server to be up and running.

I think my issue is more of a philosophical one, related to service availability and the engine’s audience. I’ve now been using BJS for about 3 years, part-time, and still learn every day. I appreciate this great community and how friendly everyone is. I’m learning new things every day, and still consider myself a noob when it comes to building games (probably will always feel this way). BJS is a great tool, highly advanced and best of all, it’s free, open-source, and built as product of love by all of you. I share the same passion for games, and really wish to be successful in building one sometime.

Long story short, if I were to build a game, and distribute it to my users, especially if I wanna make it commercial, I need to know my game is highly-available. I need to nail down all my server dependencies, and if they are 3rd party ones, will need to have SLAs in place (Service Level Agreements) and make sure those dependencies will be up at all times (within the SLA). This way I know for sure I’m in control of my own product - either through serving 100% of the content through my server (i.e. bundle it and serve it on demand), or by making sure the content is highly available.

Apologies if I polluted the thread, I’m actually curious if there’s an alternative to using the snippet.babylonjs.com website (which I see defined here: Babylon.js/constants.ts at b6f1ad7e5172de095afeecc3f62ddaa075d6ffec · BabylonJS/Babylon.js · GitHub), point that constant value to my server, and how one might go about finding all the snippet dependencies in the BJS Core, and then making them available in my server. Not sure if this has been a discussion topic before, but it seems like a toolchain might be needed.

It’s your thread :slight_smile:

This was addressed already. You can start your own snippet server, and we have a reference project you can use for that - GitHub - BabylonJS/SnippetServerReference. Changing the URL in constants will pass the reference to all core components.

Nice, thanks for the pointer.

I think I’ll spend some time creating a small npm package that would parse all the snippets reference in the current BJS distribution inside node_modules, and download the files in some local folder like /public/assets so they will be part of the app distribution package. This way I can have this step as part of the production build and have the snippets in my source control.

Will follow up with some code after I make it.

Thanks once more for the replies.

1 Like

Doing an usage search on GitHub, it seems this particular snippet is the only one being referenced directly in code: Search · ParseFromSnippetAsync · GitHub

Since this doesn’t seem like an extensively used pattern, I’ll be happy to download and serve this one locally to guarantee its availability.