MGMLaboratory
Back

Menu

01Home
02About Us
03Projects
04Publications
05Member
06Articles
07Contact

Let's Talk

Open in Mail app

Socials

Malang (ID) --:--Privacy PolicyTerms of Service

October 24, 20232 min read

Choosing a Renderer for Web Augmented RealityChoosing a Renderer for Web Augmented Reality

The polygon count of your heaviest model should decide the library, not the other way around.

  • Conference
  • Publications

Written by

  • SRShirasaka RenIT & Infrastructure · Student Member

In this article

  1. 01What AR.js gives you
  2. 02Questions worth asking before you commit

If you are building augmented reality for the web, the rendering library is one of the first decisions you make, and one of the hardest to reverse later. Switching means rebuilding the content pipeline.

The study behind this comparison examined that choice directly, in an HTML based AR application built on AR.js, a JavaScript library that runs augmented reality in the browser without asking users to install a plugin.

01/02

What AR.js gives you

The library covers three common styles of augmented reality: marker based, where a printed or on screen bookmark triggers the content; image based, where a picture acts as the anchor; and location based, where the scene is tied to coordinates. It also supports visual and audio effects alongside the 3D content.

That breadth is convenient, because it means the rendering decision is not tied to one AR mode. The same application can mix modes and still share a rendering path.

An early augmented reality system used for search and rescue. Image: Winged1der, CC BY-SA 4.0, via Wikimedia Commons.
Fig. 01An early augmented reality system used for search and rescue. Image: Winged1der, CC BY-SA 4.0, via Wikimedia Commons.

02/02

Questions worth asking before you commit

  • How many polygons will your heaviest model actually have?
  • Does the target device have the memory and graphics headroom for it?
  • Does the library render it close to native speed, or does it fall behind?
  • Can you swap the renderer later without rebuilding your assets?

The study's own findings give one clear answer. Both approaches handled low and medium polygon models. Only at high polygon counts did WebGL fall away, while GLSL held its ground near native performance.

A path traced 3D render produced in Blender. Image: KaiaVintr, CC BY-SA 4.0, via Wikimedia Commons.
Fig. 02A path traced 3D render produced in Blender. Image: KaiaVintr, CC BY-SA 4.0, via Wikimedia Commons.

The caveat matters as much as the result. This was a rendering benchmark, not a study of a finished application, and actual performance also depends on the device and the browser running it. Use the polygon count of your real content as the deciding input, not the label on the library.

Source

  1. Hamzaturrazak et al. (2023). Performance Analysis of 3D Rendering Method on Web-Based Augmented Reality Application Using WebGL and OpenGL Shading Language. Proceedings of the 8th International Conference on Sustainable Information Engineering and Technology.

    DOI10.1145/3626641.3626949 (opens in a new tab)

Next articleWhich Factors Actually Drive Work From Anywhere Productivity(Keep scrolling)(Read it next)(Loading)