WebXR Development

Parts of Spatial Web Apps 

XR/spatial applications are a collection of files that are usually served through a web server. A web browser can interpret these files and run the web app.

Common Files 

The most important files and file extensions to know are listed below:

index.htmlMain HTML page of the spatial web app.
.jsContains JavaScript code.
.tsContains TypeScript code, which is converted to .js before publishing the spatial web app.
.wasmWebAssembly (which is compiled from languages like C++ or Rust).
.glb3D model file format that may even embed textures.
.gltfText based 3D model file format.
.binUsually referenced by a .gltf and contains binary 3D model data.
.objA simpler, text-based model file format.
.mtlA material file, usually referenced by a .obj file.
.jsonArbitrary data used by the application.
.cssA “Cascading Style Sheet”, which is used to tweak the appearance of HTML elements.

Additionally, a spatial web app will use audio files (.mp3, .wav, .ogg, …), image files (.webp, .png, .jpg) and sometimes even video files (.webm, .mp4, .mov).

3D Models 

VR and AR apps can be anything from fully immersive environments to simple floating UI panels. In most cases, at least a few 3D models (also called “assets” when used in your app) will be needed.


Many free and paid assets can be found on platforms like Sketchfab, TurboSquid and itch.io.

There are some totally free sources for 3D models like Quaternius, Kenney.nl and Poly Haven.

You can also often use asset packs from Unity or Unreal Engine.

3D Scanning 

The process of converting photos of real world objects to 3D models is called “Photogrammetry”, or 3D scanning.

Apps like RealityScan for your smartphone or software like Reality Capture can help you bring real world models into your spatial web apps.


Manually creating 3D models can be a time consuming task. 3D modelers use software like Blender or Maya to craft 3D models custom for your need.

If 3D modelling is not for you, you might find a 3D artist to hire on ArtStation.


All assets of a spatial web app are transmitted over the internet. This can impact loading times, which makes it important that the assets are compressed and optimized.


Code for spatial web apps can be written in TypeScript, JavaScript, C++, Rust and many other languages. JavaScript is executed directly, while languages like C++ are compiled to WebAssembly.

The code has many responsibilities in a spatial web app:

  • Rendering: Creating the images that are shown on the smartphone or VR device. Computer graphics is a complex field of computer science. To manage it, WebXR developers use rendering frameworks to take care of common tasks for them.
  • Loading Assets: Loading any 3D models, textures, audio, videos and other data when it is needed. Frameworks will usually provide functionality to read data from different 3D file formats, and on the web, the browser can take care of loading images and audio file formats for you.
  • User Interaction: Reacting to user input, giving feedback and applying actions as response to the user’s actions.
  • App Logic: The computations, processing and data interactions the app is meant to do, from querying databases to generating data.

Libraries, frameworks and 3D engines like Wonderland Engine help with all of these tasks and provide commonly used functionality to empower spatial web developers to build their apps more efficiently.

Web Services 

The app might interact with online services for accounts, storing individual information, querying large database, streaming media and much more.