Skip to content
CAI
Software that uses CAICheck a score

aframevr/aframe

69.5

Adequate · 1 October 2026

4.9k

lines of production code

JavaScript

primary language

2

measurements over time

CAI band scale
CAI trend line
CAI lens gauges

What this system is

This system is A-Frame, a web framework for building virtual reality and augmented reality experiences using HTML-based markup. It provides a component-based architecture that maps declarative attributes to 3D entities, supporting features like hand tracking, WebXR anchors, and spatial UI. The codebase includes extensive examples and tests covering performance optimization, mixed reality interactions, and modern rendering techniques such as WebGPU and post-processing.

How it got here

2015–2016 — Webpack migration and ES module refactoring

71 changes.

The project modernized its build infrastructure by migrating from Gulp to Webpack and refactoring core modules to use ES modules and Custom Elements V1. This period introduced a comprehensive unit testing suite, expanded AR and WebXR capabilities, and established a new primitives system for declarative entity definitions.

2017–2023 — WebXR and spatial UI expansion

29 changes.

This period focused on expanding A-Frame's capabilities for WebXR, mixed reality, and spatial user interfaces through a series of new showcase examples and components. The work included implementing hand-tracking interactions, AR lighting and meshing, and reusable spatial UI widgets, alongside comprehensive performance benchmarks and test coverage for these emerging features.

2024–2025 — Showcase and boilerplate expansion

5 changes.

This period focused on expanding the project's example library with new showcase demos and boilerplate templates. Key additions included VR drawing tools for the Logitech MX Ink, a WebGPU galaxy renderer, and post-processing bloom effects, alongside a new importmap configuration guide for ES module management.

Features

Add Real World Meshing coffee-spawning demo

A new mixed-reality example has been added to the examples/mixed-reality/real-world-meshing directory. This demo allows users to spawn coffee cup models in AR by pinching over surfaces labeled as 'table' using WebXR Mesh and Plane detection. The implementation includes custom A-Frame components (coffee-spawner, hide-model-parts) to handle interaction logic and model rendering, demonstrating how to integrate real-world meshing features with hand-tracking controls.

examples/mixed-reality/real-world-meshing · high confidence

Add Spatial UI example with hand-tracking support

The examples/showcase/spatial-ui location now includes a new Spatial UI demonstration that showcases Apple-inspired spatial design widgets (windows, modals, tiles, and buttons) within an A-Frame scene. This example integrates hand-tracking capabilities by including hand-tracking-controls components for both left and right hands, allowing users to interact with the spatial interface using hand gestures.

examples/showcase/spatial-ui · high confidence

Add comic book VR showcase example

A new interactive VR example has been added to the showcase directory, demonstrating how to display and navigate comic book pages using the WebXR layers API. The example includes a custom 'page-controls' component that allows users to pan, zoom, and turn pages using Meta Touch Controller inputs (thumbstick, triggers, and buttons), featuring comics like 'Blackbird' and 'The Weather Man'.

examples/showcase/comicbook · high confidence

Add composite example showcasing embedded scene composition

A new composite example has been added to the showcase directory, demonstrating how to compose multiple assets within an A-Frame scene. The example loads a GLTF sculpture model and two images (a sky background and a foreground image) using the asset management system, illustrating basic scene layout and asset referencing for users embedding or building composite experiences.

examples/showcase/composite · high confidence

Add laser-based input UI example

A new example showcasing an immersive UI pattern that uses laser pointer input (via the laser-controls component) with mouse and keyboard fallbacks. The demo features a poster menu where clicking a movie poster highlights it and displays an info panel with the title and description, while clicking the background resets the selection.

examples/showcase/ui · high confidence

Add rotating cubes performance benchmark example

A new performance benchmark example has been added to the examples/performance/cubes directory, allowing users to compare the performance of different rotation update strategies in A-Frame. The example includes a main entry point that spawns thousands of cubes and several components (rotate-obj3d, rotate-get-obj3d, rotate-obj3d-set, rotate-get-set, rotate-get-settext) that demonstrate various methods for updating object rotation, such as direct object3D manipulation versus attribute get/set cycles.

examples/performance/cubes · high confidence

Add shopping showcase example

A new shopping showcase example has been added to the examples directory, demonstrating a 3D product display scene. The example loads a GLB model of a male figure, applies animations to rotate the model and move UI elements like price tags and goggles, and uses curved images for background text. It also includes lighting setup with directional and ambient lights, and utilizes the new 'delay' attribute for animations instead of the deprecated 'begin' attribute.

(repo-wide) · high confidence

Add watch-style hand menu example

Introduces a new mixed-reality example demonstrating a hand-attached menu system that can be positioned on either the wrist or the palm. The implementation includes A-Frame components for managing the menu UI, handling collision-based hover states with a system to resolve conflicts when multiple buttons are hovered, and logic to spawn 3D objects via pinch gestures. The example also features a wrist-mounted watch model with a live time display and provides a reference for building robust hand-tracking interfaces in VR/AR.

examples/mixed-reality/watch · high confidence

Added 360° image panorama example with text overlay

The boilerplate examples now include a new 360° image panorama demo that displays a sky texture with an overlaid text label indicating the location (Puy de Sancy, France). This example demonstrates how to use the a-sky component for immersive backgrounds and the a-text component for positioning text within the 3D scene.

examples/boilerplate/panorama · high confidence

Added animation performance examples using raw property and setAttribute

Two new performance examples have been added to demonstrate animation techniques in A-Frame. The 'animation-raw' example shows how to animate properties using raw object3D access (e.g., \object3D.rotation.z\) and direct property manipulation, while the 'animation-set-attribute' example demonstrates animating via the \setAttribute\ API. Both examples generate a grid of spinning fans and bouncing balls to benchmark animation performance, utilizing \THREE.MathUtils.degToRad\ for angle conversions.

examples/performance/animation-raw, examples/performance/animation-set-attribute · high confidence

Added documentation primitive generator for mesh attributes

A new HTML-based script has been added to the documentation primitives tooling that automatically generates Markdown tables for mesh primitive attributes. This tool iterates through available A-Frame geometries and the mesh mixin mappings to compile a list of attributes, their corresponding component mappings, and default values, outputting the formatted tables to the console for inclusion in documentation.

scripts/docs-primitives · high confidence

Added entity-count performance example

A new example page has been added at examples/performance/entity-count to demonstrate performance characteristics when rendering a large number of entities. The page loads the A-Frame library from dist/aframe-master.js and programmatically creates 4,000 cube entities using a shared mixin, allowing users to visualize and benchmark scene complexity.

examples/animation/pivots, examples/performance/entity-count, examples/showcase/spheres-and-fog · high confidence

Added setAttribute performance benchmark example

A new performance test example has been added to demonstrate the speed of updating component attributes via setAttribute. The example registers a dummy component with multiple schema properties and a test component that performs 100,000 attribute updates, logging the average time per update to the console to help measure rendering performance.

examples/performance/set-attribute · high confidence

Added vendor utilities for device orientation and screen wake lock

The vendor directory now includes a new DeviceOrientationControls module that tracks device orientation and screen orientation to update the camera pose, and a wakelock utility that prevents the screen from sleeping on Android and iOS devices. These additions support mobile-specific features like magic window tracking and ensure the display remains active during use.

vendor · high confidence

Introduction of dedicated systems for core rendering and scene management

A-Frame now organizes core functionality into dedicated systems, including \camera\, \geometry\, \gltf-model\, \light\, \material\, \obb-collider\, \renderer\, \shadow\, \tracked-controls\, and \webxr\. The \camera\ system manages active camera selection and initialization, while the \light\ system handles default lighting setup and removal upon user-defined lights. The \renderer\ system centralizes configuration for tone mapping, color management, and refresh rates. The \material\ system introduces texture source caching, and the \geometry\ system implements geometry caching to optimize memory usage. The \gltf-model\ system configures loaders for Draco, KTX2, and Meshopt compression. The \shadow\ system manages shadow map settings, and the \webxr\ system handles session configuration and feature requests. These changes provide a more modular and maintainable architecture for scene rendering and interaction.

src/systems · high confidence

Introduction of new A-Frame primitives and automated mesh registration

This change introduces a suite of new declarative primitives for the \src/extras/primitives/primitives\ location, including \a-camera\, \a-cursor\, \a-curvedimage\, \a-gltf-model\, \a-image\, \a-light\, \a-link\, \a-obj-model\, \a-sky\, \a-sound\, \a-text\, \a-video\, and \a-videosphere\. These primitives provide default component configurations and attribute mappings for common 3D and interaction elements, such as setting a default user height of 1.6m for the camera or enabling visual aspects for links by default. Additionally, an automated registration system (\meshPrimitives.js\) is added to dynamically generate primitives for all available geometry types, reducing manual boilerplate for mesh-based entities.

src/extras/primitives/primitives · high confidence

Introduction of the Primitives system for declarative entity definitions

A new primitives system has been added to \src/extras/primitives\, allowing developers to define custom HTML elements (like \\<a-box\>\ or \\<a-sphere\>\) that automatically map flat HTML attributes to inner component properties. This system introduces a more familiar syntax for newcomers by aliasing generic entities into specific shapes and behaviors, handling attribute-to-component mapping, and supporting mixins for extensibility. The implementation includes a registry for primitives, logic to resolve mapping collisions with existing components, and default component configurations, effectively simplifying the creation of complex A-Frame entities through declarative markup.

src/extras/primitives · high confidence

New 'Unfold' animation example added

A new example demonstrating nested board animations has been added at examples/animation/unfold. The scene features a series of nested boxes that unfold sequentially using the animation component's delay attribute, along with a directional light and a shadow image to illustrate the effect.

examples/animation/unfold · high confidence

New A-Frame Model Viewer example with AR/VR support and custom components

Adds a new showcase example at examples/showcase/model-viewer that demonstrates a cross-device 3D model viewer with Augmented Reality and Virtual Reality capabilities. The example introduces several new A-Frame components: 'model-viewer' for managing the 3D scene, camera rig, and user interactions (including URL-based model uploading); 'animation-mixer' for playing glTF animations; 'ar-shadows' for rendering realistic shadows in AR mode; and 'background-gradient' for a dynamic skybox. The implementation includes specific WebXR feature requests (hit-test, light-estimation) and handles VR controller inputs, providing a complete reference for building immersive 3D experiences with A-Frame.

examples/showcase/model-viewer · high confidence

New A-Frame example components and UI enhancements

This update introduces several new A-Frame components for the examples directory: 'center-model' automatically centers GLTF models within their entity, 'hide-on-play' and 'play-on-click' manage video visibility and user-gesture-based playback initiation, and 'info-message' provides a toggleable, styled information panel with configurable dimensions. Additionally, a 'remix-dropdown' component is added to allow users to open examples directly in CodeSandbox or Krabbel, while the legacy 'vr-cube' component has been removed.

examples/js · high confidence

New Curved Images showcase example

Added a new example page demonstrating the use of the \<a-curvedimage\> component to render curved UI mockups within an A-Frame scene, including configuration for radius, theta-length, and positioning alongside a custom camera setup.

examples/showcase/curved-mockups · high confidence

New Hello World boilerplate example with background and shadows

A new boilerplate example has been added at examples/boilerplate/hello-world, providing a minimal starting point for A-Frame applications. This example demonstrates the use of the background component to set a scene color (\#ECECEC) and applies the shadow attribute to all primitive entities (box, sphere, cylinder, plane) to enable default shadow casting, reflecting recent core changes to default lighting behavior.

examples/boilerplate/hello-world · high confidence

New In-VR Performance Demo with Controller Support and FPS Counter

A new performance demonstration has been added to the examples/performance/in-vr directory, featuring a custom controller component that abstracts input handling for Daydream, GearVR, Meta Touch, and Vive controllers by automatically attaching raycasters and cursors upon connection. The demo also includes a stats-in-vr component that displays a real-time, color-coded FPS counter (green for \>=89, orange for \>=85, red for \<80) to help users monitor rendering performance in VR.

examples/performance/in-vr · high confidence

New Mixed Reality Anchor example with persistent world-locked painting

Added a new example in examples/mixed-reality/anchor that demonstrates the WebXR Anchors Module. The demo features a painting entity that users can pinch and grab using hand-tracking; when released, the painting remains anchored to the real-world coordinate and persists across page reloads. The example includes components for managing the anchor lifecycle (anchor-grabbed-entity), switching between different painting textures (painting, painting-changer), and a UI button to cycle through artworks.

examples/mixed-reality/anchor · high confidence

New Painter showcase example for Logitech MX Ink integration

Added a new interactive example in the showcase directory that demonstrates drawing in VR using the Logitech MX Ink tracked pen. The example includes an HTML scene with A-Frame environment and brush components, along with custom JavaScript modules for stroke geometry and brush systems to handle input and rendering.

examples/showcase/painter · high confidence

New Warp Animation Example Added

A new example page demonstrating staggered scale animations has been added at examples/animation/warps. The demo uses the A-Frame animation component to create a 'warp' effect with multiple colored cylinders, utilizing the 'delay' attribute for sequencing and setting specific light intensities for the scene.

examples/animation/warps · high confidence

New WebGPU Galaxy showcase example

Added a new interactive example in the WebGPU showcase directory that renders an animated galaxy using the WebGPU renderer and Three.js Shader Language (TSL). The example demonstrates a custom A-Frame component that creates an instanced mesh with a sprite node material, allowing users to adjust particle size and colors via a debug GUI, and includes a credit message for the source inspiration.

examples/showcase/webgpu · high confidence

New WebXR AR lighting example with shadow and hit-test support

Added a new boilerplate example for WebXR AR lighting that demonstrates environment lighting estimation, shadow casting, and AR hit-test integration. The example includes a custom 'ar-shadow-helper' component to manage shadow visibility during hit-test interactions and uses the updated aframe-environment-component (1.5.x) for background lighting. It also features a DOM overlay for user feedback during surface scanning and selection.

examples/boilerplate/webxr-ar-lighting · high confidence

New anchored component for WebXR spatial anchors

The new \anchored\ component allows entities to remain fixed in real-world space using the WebXR Anchors Module. It supports both temporary anchors and persistent anchors (saved across sessions via localStorage), automatically requesting the 'anchors' optional feature in the WebXR session and updating the entity's position and orientation in the tick loop based on the anchor's pose.

src/components · high confidence

New animation examples demonstrating scene composition and plane reveals

Added two new example pages: 'A-Frame Logo' and 'Plane Reveals'. The A-Frame Logo example showcases a complex scene with animated 3D geometry, camera movement, and background components, while the Plane Reveals example demonstrates various animation techniques on planes using pivot, position, and scale properties.

examples/animation/aframe-logo · high confidence

New brush component with multi-controller support and pressure sensitivity

The painter showcase now includes a new \brush\ component that enables drawing in VR with support for both Meta Touch controllers and the Logitech MX Ink pen. This component handles touch and button events to manage stroke creation and termination, applies pressure sensitivity via a configurable multiplier, and adjusts pointer positioning offsets specific to each controller type to ensure accurate drawing placement.

examples/showcase/painter/components · high confidence

New generic logo animation example

Added a new example demonstrating a generic logo composed of animated elements, including a scaling and rotating box with frame edges, pulsing cylinders, and an animated image. The example uses the \animation\ component with the \delay\ attribute (replacing the older \begin\ attribute) and includes specific camera and lighting configurations to showcase the animations.

examples/animation/generic-logo, examples/showcase/anime-UI, examples/showcase/hand-tracking-grab-controls · high confidence

New geometry components and registration API

This release introduces a comprehensive set of new 3D geometry components—including box, circle, cone, cylinder, dodecahedron, icosahedron, octahedron, plane, ring, sphere, tetrahedron, torus, torus knot, and triangle—alongside a new \registerGeometry\ API for defining them. Users can now create these shapes by simply adding the corresponding component to an entity, with schemas exposing parameters like dimensions, segments, and radii to control the geometry's appearance and detail level.

src/geometries · high confidence

New hand-tracking interactive example with custom UI components

The hand-tracking showcase now includes a complete interactive demo featuring custom A-Frame components for a toggleable button, pinchable objects, a slider, and an event manager. Users can interact with 3D geometry (box, sphere, torus) and toggle dark/light modes using hand tracking gestures, demonstrating the experimental WebXR hand input API with a disclaimer about browser support.

examples/showcase/hand-tracking · high confidence

New importmap boilerplate example using ES module bundles

Added a new boilerplate example at examples/boilerplate/importmap that demonstrates how to use importmaps to load A-Frame and Three.js as ES modules. This example specifically shows how to avoid multiple instances of Three.js by mapping 'three' to a local minified module bundle and using 'three/addons/' for addons like TeapotGeometry. It also demonstrates integration with aframe-extras controls and includes a sample scene with a teapot component and movement controls.

examples/boilerplate/importmap · high confidence

New pivot component for entity rotation control

A new 'pivot' component has been added to the extras components library, allowing users to set a pivot point for an entity's rotation. When applied, the component wraps the entity's object3D in an outer group and offsets the inner geometry's position to maintain the world position while enabling rotation around the specified pivot coordinates defined in the component's vec3 schema.

src/extras/components · high confidence

New post-processing bloom effect example

A new showcase example demonstrates a bloom post-processing effect in A-Frame. It introduces a \bloom\ component that wraps the renderer with Three.js post-processing passes (EffectComposer, RenderPass, UnrealBloomPass, OutputPass) and supports toggling the effect on and off via an \enabled\ property. An accompanying \effect-controls\ component allows users to toggle the bloom effect using controller inputs (pinch or button press) in VR, while the example HTML wires these components together with a sample scene and model.

examples/showcase/post-processing · high confidence

New primitive shape examples added to the documentation

The examples/primitives directory now includes dedicated HTML pages demonstrating the default sizes and various configurations for A-Frame primitive entities, including boxes, cones, cylinders, planes, rings, and tori. Additionally, new examples for images and 3D models (glTF and OBJ) have been added to showcase texture mapping, asset loading, and model rendering capabilities within the scene.

examples/primitives · high confidence

New scene components for AR hit-test, background, pooling, and real-world meshing

This update introduces several new scene-level components to enhance AR capabilities and scene management. The new \ar-hit-test\ component enables WebXR hit-testing and anchor creation for placing objects in the real world, while \real-world-meshing\ detects and renders 3D planes and meshes from the user's environment. A \background\ component allows setting scene colors and transparency without geometry, and a \pool\ component helps optimize performance by reusing entity instances. Additionally, \reflection\ adds dynamic lighting estimation via WebXR light probes, and \device-orientation-permission-ui\ provides a customizable dialog for requesting sensor permissions.

src/components/scene · high confidence

New spatial UI components for A-Frame

Added a suite of new A-Frame components to the spatial-ui library, including spatial-button, spatial-close-button, spatial-window, spatial-modal, spatial-hero-image, and spatial-modal-image, along with supporting geometry utilities. These components provide reusable, stylized UI elements with features like rounded corners, glass-like transmission materials, hover effects, and focus states, enabling developers to easily build immersive spatial interfaces.

examples/js/spatial-ui · high confidence

New tracked-controls showcase components and shaders

The tracked-controls example now includes new A-Frame components for augmented reality and interaction: \aabb-collider\ for axis-aligned bounding box collision detection, \grab\ for handling controller grip events and object movement, \ar-controls\ for managing AR session select events, and \ground\ for loading a shadow-receiving ground model. Additionally, a \skyGradient\ shader component has been added to render a customizable skybox with top and bottom color uniforms.

examples/showcase/tracked-controls/components · high confidence

New tracked-controls showcase example with interactive VR hands

A new example at examples/showcase/tracked-controls demonstrates VR interaction using hand-controls with low-poly models, allowing users to grab and manipulate cubes via raycasting and collision detection. The scene includes a ground model loaded from a CDN, custom shaders for the sky, and specific lighting adjustments, providing a complete interactive VR experience for developers to reference.

examples/showcase/tracked-controls · high confidence

Behavioural changes

3D model example updated to use glTF format

The 3D model boilerplate example now loads a glTF model (tree2.glb) instead of the previous Collada format, utilizing the \<a-gltf-model\> component and \<a-asset-item\> with arraybuffer response type for proper asset handling.

examples/boilerplate/3d-model · high confidence

5 commits (1 fix) modifying examples/showcase/anime-UI/models

A change to existing behaviour in examples/showcase/anime-UI/models — 5 commits (1 fix), 1 file.

examples/assets/models, examples/showcase/anime-UI/models · medium confidence · unverified

AR Hello World example updated to use modern shadow and lighting defaults

The AR Hello World example has been updated to align with recent A-Frame and Three.js changes. It now uses the 'pcf' shadow type (with a fallback warning if unsupported) instead of the deprecated 'pcfsoft', and directional lights are configured to automatically follow their shadow cameras to prevent shadow detachment. Additionally, the example sets explicit renderer exposure and tone mapping settings (ACESFilmic) and includes a custom 'follow-shadow' component to ensure the ground plane correctly tracks object positions for accurate shadow casting.

examples/boilerplate/ar-hello-world · high confidence

Build system migration from Gulp to Webpack

The project has replaced the Gulp-based build pipeline with a Webpack configuration, introducing new build scripts (webpack.common.cjs, webpack.config.cjs, webpack.prod.config.cjs, webpack.module.config.cjs) to generate UMD and ES module bundles. This change also enforces stricter linting standards via a new .eslintrc.json, restricting the core source code to ES5 syntax (with specific exceptions for ES6 classes and ES8 async/await) and enabling rules for indentation and unused variables to improve code quality.

(repo-wide) · high confidence

Centralize A-Frame configuration constants and keyboard mappings

The application now exposes key configuration values and mappings through dedicated constant modules. Users benefit from a standardized default camera height of 1.6 units and right-handed controller support, while the CDN root is configurable via the global \window.AFRAME\_CDN\_ROOT\ variable. Additionally, a mapping for standard keyboard codes (WASD/Arrow keys) is provided to support consistent input handling across different keyboard layouts.

src/constants · high confidence

Core modules refactored to ES modules and Custom Elements V1

The core A-Frame modules (a-assets, a-entity, a-mixin, a-node, component, etc.) have been rewritten to use native ES module imports/exports and the Custom Elements V1 API. This change introduces a new initialization lifecycle that defers component initialization until the document reaches the 'interactive' ready state (via the \aframeready\ event), ensuring that the timeout mechanism and loading screens appear correctly before heavy assets like images finish loading. It also replaces the legacy \require()\ system with \import\ statements, standardizes component attribute handling through \attributeChangedCallback\ and \MutationObserver\, and enforces that \\<a-assets\>\ must be a child of \\<a-scene\>\.

src/core · high confidence

The Link Traversal demo now supports a 'peek' interaction model, allowing users to preview linked experiences in 360 degrees without fully traversing to them. This is implemented via new \link-controls\, \tooltip\, and \camera-position\ components that handle raycasting, visual feedback, and camera positioning. The interaction model is adapted for various input devices, including Vive, Meta Touch, Daydream, and GearVR controllers, with specific button mappings (e.g., X button for peek on Meta Touch) and corresponding on-screen tooltips to guide the user.

examples/showcase/link-traversal/js · high confidence

Material shaders now support fog, tone mapping, and environment maps

The flat, standard, and phong material shaders have been updated to support fog rendering, tone mapping, and environment map integration. Users can now enable fog on flat and phong materials, and all three material types respect the scene's tone mapping and color space settings. The standard and phong materials also support environment maps (including spherical environment maps) for reflections, with the phong material falling back to the scene's environment if no specific map is provided. Additionally, the standard material now supports metalness and roughness maps, while the phong material supports normal, displacement, ambient occlusion, and bump maps.

src/shaders · high confidence

New documentation linting and release automation scripts

The project introduces several new scripts to improve documentation quality and release workflows. A new \docsLint.js\ script validates Markdown documentation by checking for broken inline and reference links, verifying anchor headings, and running prose checks. The \preghpages.js\ script automates the preparation of the gh-pages deployment by copying necessary assets and replacing local build paths with CDN URLs for the specific release version. Additionally, \release.js\ handles the build process with version-specific output filenames and updates version references in documentation, while \testOnlyCheck.js\ acts as a pre-push hook to prevent committing tests with \test.only\ or \suite.only\. Finally, \updateVersionLog.js\ automatically updates the version string in the source code with the current version, date, and commit hash.

scripts · high confidence

New examples index page and removal of legacy cube demo

The examples directory now features a new index.html page that organizes demos into sections for Showcases, Boilerplates, Mixed Reality, Documentation examples, and Tests, replacing the previous flat structure. This update also removes the legacy cube.html demo, which relied on the deprecated vr-markup library and vendor scripts, in favor of the modern, organized listing.

examples · high confidence

New modular scene architecture with early renderer and loading screen initialization

The scene core has been restructured into distinct modules (a-scene, loadingScreen, metaTags, postMessage, scenes, wakelock) to improve initialization timing and code organization. The renderer and loading screen are now set up at the 'interactive' document state, ensuring the loading screen is visible during asset loading, while systems initialization is deferred until the 'complete' state. This change introduces a configurable loading screen with customizable colors and a title element, injects mobile-specific meta tags for better viewport handling, initializes a wake lock on mobile devices during VR sessions, and provides a postMessage API for controlling VR entry/exit from iframes.

src/core/scene · high confidence

Redesigned Enter VR/AR UI and consolidated fullscreen styling

The visual design of the Enter VR and Enter AR buttons and their associated modals has been updated, including new SVG icons, adjusted positioning, and improved typography. The CSS file has been renamed from aframe-core.css to aframe.css, and fullscreen behavior is now managed via a consolidated .a-fullscreen class on the html element, ensuring the canvas and scene fill the viewport correctly in immersive modes.

src/style · high confidence

Refactored and consolidated core utility modules

The utility layer has been reorganized into dedicated modules (coordinates, device, entity, material, src-loader, etc.) to improve maintainability and performance. Key changes include: coordinates parsing and stringification are now handled by a dedicated module with optimized regex and caching; device detection is centralized in device.js with explicit WebXR session support checks and updated mobile/VR browser heuristics; entity property access uses a cached split utility to reduce string parsing overhead; material updates leverage a src-loader that validates image sources via HEAD requests and caches texture sources to avoid redundant loads; and tracked-controls logic is consolidated to handle WebXR controller matching with handedness and index fallbacks. Deprecated utilities (isCoordinate, checkHeadsetConnected) now emit warnings and delegate to the new locations.

src/utils · high confidence

Removal of VR markup CSS styles

The dedicated CSS file for VR markup (vr-markup.css) has been removed. This eliminates the global styles that previously forced the HTML and body elements to fill the viewport with hidden overflow, and removed the absolute positioning rules for the .vr-canvas class.

style · high confidence

Removal of bundled vendor libraries

The bundled vendor copies of three.js (r72dev), VRControls, VREffect, dat.gui, and document-register-element have been removed from the lib/vendor directory. This reduces the application's footprint by eliminating these third-party dependencies from the local source tree, likely shifting their management to a package manager or external build process.

lib/vendor · high confidence

Restores ground model loading in tracked-controls example

The tracked-controls example now correctly loads the ground model by importing the newly added LegacyJSONLoader. This vendor file implements the deprecated THREE.JSONLoader, ensuring the example functions correctly despite the loader's removal from the latest version of THREE.

examples/showcase/tracked-controls/vendor · high confidence

The link-traversal showcase has been rewritten to use the new \<a-link\> primitive and a mouse-based cursor (rayOrigin: mouse) instead of legacy models and controllers. The example now loads the aframe-environment-component at version 1.5.x and includes a note that immersive navigation is experimental and may require browser flags.

examples/showcase/link-traversal · high confidence

Unified THREE export with extended loaders and caching

The library now exports a consolidated THREE object that wraps the standard 'three' package and explicitly attaches several specialized loaders and utilities (DRACOLoader, GLTFLoader, KTX2Loader, OBJLoader, MTLLoader, OBB, BufferGeometryUtils, LightProbeGenerator) along with custom DeviceOrientationControls. Additionally, in-memory asset caching is enabled by default via THREE.Cache.enabled = true, ensuring consistent availability of these extended features across the application.

src/lib · high confidence

Updated arms example to use 'delay' attribute and updated script path

The arms example has been updated to replace the deprecated 'begin' attribute with 'delay' for animation timing, aligning with current A-Frame animation component standards. Additionally, the example now loads the library from the specific 'dist/aframe-master.js' path instead of a generic or previous location, ensuring correct script resolution for this demo.

examples/animation/arms · high confidence

Updated master CDN URLs to use jsDelivr

The master distribution builds (aframe-master.min.js) are now served via the jsDelivr CDN instead of the deprecated rawgit service. This ensures that users loading the library from the CDN will continue to have reliable access to the latest development builds without broken links.

dist · high confidence

Wikipedia showcase example updated to use A-Frame master build and mobile detection fix

The Wikipedia showcase example now loads the A-Frame library from the local dist/aframe-master.js path instead of a remote CDN, and the mobile detection logic has been corrected to use the updated AFRAME.utils.device.isMobile() API, ensuring proper redirection to the mobile version on handheld devices.

examples/showcase/wikipedia · high confidence

Fixes

360 Video boilerplate updated for modern browser compatibility

The 360 Video example has been updated to ensure reliable playback across browsers and mobile devices. The video element now includes the \playsinline\ and \webkit-playsinline\ attributes to support iOS playback, and the \autoplay\ attribute has been removed to comply with modern browser policies that require user interaction. Playback is now triggered by a click or tap, facilitated by the \play-on-click\ component, with a text overlay instructing the user to interact to start the video.

examples/boilerplate/360-video · high confidence

Shader precision lowered on mobile to fix Adreno 300 series and improve performance

On mobile devices without native VR support, the shader precision is now set to mediump. This change resolves rendering issues on Adreno 300 series GPUs and improves overall performance.

src · high confidence

Test coverage

Add dummy test assets for a-assets tests; Add model rendering test page for glTF and OBJ assets; Added A-Frame pool entity example; Added Node.js integration tests; Added animation-color test example; Added canvas-texture example demonstrating dynamic HTML5 canvas textures; Added core unit tests for A-Frame components and systems; Added cursor interaction tests for mouse button handling; Added embedded test page for A-Frame scenes; Added fog effect test example; Added geometry component test page; Added glTF model examples and helper components; Added glTF test assets for box model validation; Added iframe integration test for VR entry; Added laser-controls test example with interactive box grid; Added physical material testing example; Added raycaster integration tests; Added shader test example; Added shader test examples for noise and sky effects; Added shadow rendering test example; Added test components for raycaster interaction scenarios; Added test coverage for core primitives and mesh registration; Added test coverage for core rendering systems; Added test coverage for primitives and mixin interactions; Added test examples for geometry primitives and pivot component; Added test examples for video playback and videosphere components; Added test for embedded cursor interaction; Added test page for A-Frame mixins; Added test pages for animation, cylinders, opacity, and towers; Added test suite for compositor layer interaction; Added tests for the pivot component; Added text component test scenarios; Added unit tests for a-scene WebXR and meta-tag initialization; Added unit tests for core A-Frame components; Added unit tests for flat, phong, and standard material shaders; Added unit tests for scene components; Added unit tests for utility functions; New unit test infrastructure and CSP compliance verification.

Dependencies

A-Frame v1.8.0 release with updated build tooling and dependencies

This update releases A-Frame version 1.8.0, introducing a modernized build pipeline that switches from Gulp to Webpack (v5.95.0) for generating distribution bundles, including a new ES module build. The core 3D rendering engine is upgraded to super-three v0.185.0, and the stats component now utilizes the stats-gl library (v3.6.0). Development tooling has also been updated, including the test runner to Karma v6.4.0 and the linter to standardx v7.0.0.

(dependencies) · high confidence

Housekeeping

Add README for the crate 3D model asset

A README file has been added to the crate model example directory, providing attribution to the creator (Tyro Smith) and licensing information (free for personal and commercial use), along with the original source link.

examples/assets/models/crate · high confidence

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

How this codebase got here

Score

  • CAI 67 → 70 (+2.8)
  • Rubric changed (rubric-2026.09.11 → rubric-2026.09.18) — scores are not directly comparable.

Lenses

  • Code Health 100 → 100 (+0.0)
  • Architecture 99 → 99 (+0.3)
  • Maturity 66 → 66 (+0.0)
  • Readiness 58 → 61 (+3.4)
  • Security 70 → 79 (+8.4)

Resolved (6)

  • Dependency hygiene PARTLY measured — npm pinning read, dependency currency not (no pnpm-resolved versions to grade)
  • Documentation: no project overview (README.md)
  • High CVE: [GHSA redacted] (package-lock.json)
  • High CVE: [GHSA redacted] (package-lock.json)
  • High CVE: [GHSA redacted] (package-lock.json)
  • High CVE: [GHSA redacted] (package-lock.json)

New (9)

  • High CVE: [GHSA redacted] (package-lock.json)
  • High CVE: [GHSA redacted] (package-lock.json)
  • High CVE: [GHSA redacted] (package-lock.json)
  • High CVE: [GHSA redacted] (package-lock.json)
  • Outdated (npm): debug
  • Outdated (npm): deep-assign
  • Outdated (npm): stats-gl
  • Outdated (npm): three
  • Outdated (npm): three-bmfont-text

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

Survey your own repository

aframevr/aframe was measured the same way every project in this corpus was: the same rubric, at a pinned commit, with the result published in full. Point a surveyor at a repository you know and see whether you agree with it.

About this page

  • The score is its most recent published measurement, taken on 1 October 2026 at a pinned commit. It is not a live figure and does not change until the project is measured again.
  • Measured at commit 022bcc5f6eef09ff60d3f2110604c78cae0cd5b1 — the exact code this score is about.
  • Scored under rubric-2026.09.18 — the same rubric and the same method as every other entry in this index.
  • Measured by watchdog.canine.dev using codehealth-analyzer preprod-e569280dd5e2.