aframevr/aframe
69.5
Adequate · 1 October 2026
4.9k
lines of production code
JavaScript
primary language
2
measurements over time
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
Enhanced link traversal interaction with peek mode and controller-specific tooltips
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
Rewritten link-traversal example with mouse cursor and new link component
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.