Automated CI/CD Checks for Web glTF Assets

Publishing 3D content to the web requires a robust deployment pipeline to guarantee fast load times, broad device compatibility, and visual integrity. Integrating automated Continuous Integration and Continuous Deployment (CI/CD) checks for glTF and GLB files ensures that incoming 3D assets adhere to strict technical budgets, rendering standards, and security protocols before reaching production environments.

1. Specification Validation

The primary step in any glTF pipeline is verifying adherence to the Khronos Group glTF 2.0 specification. Using the official, open-source glTF-Validator tool in a headless environment detects syntax errors, corrupted accessors, missing buffer views, and broken node hierarchies. Any critical error reported by this tool should fail the build immediately, as non-compliant files frequently crash client-side WebGL and WebGPU runtimes.

2. File Size and Asset Budget Limits

Web delivery demands strict performance budgets to avoid high bounce rates and excessive bandwidth consumption. CI/CD pipelines should enforce automated file size thresholds:

  • Total File Size: Reject assets exceeding an agreed-upon limit (e.g., under 5 MB for standard e-commerce models).
  • Draw Calls: Limit the number of unique meshes and primitives to keep draw calls low on mobile devices.
  • Polygon Count: Enforce upper limits on triangle and vertex counts per asset or level-of-detail (LOD) tier.

3. Texture Audits and Compression

Textures typically account for the vast majority of a glTF file's memory footprint. Automated checks should inspect and transform texture assets through the following rules:

  • Resolution Caps: Ensure no texture exceeds baseline dimensions (e.g., 2048x2048 or 4096x4096) and conforms to power-of-two dimensions where required.
  • Modern Compression Formats: Verify textures are compressed using KTX2 with Basis Universal (KHR_texture_basisu). Uncompressed PNG or JPEG textures should trigger automated conversion or build warnings.
  • Channel Packing: Validate that PBR workflow textures (metallic, roughness, and occlusion) are packed into a single texture map to reduce memory fetches.

4. Geometry Optimization and Extension Verification

Running optimization engines like gltfpack or @gltf-transform within CI ensures models are stream-ready:

  • Meshopt and Draco Compression: Check that geometry compression (KHR_meshopt_compression or KHR_draco_mesh_compression) is applied.
  • Allowed Extensions: Maintain an allowlist of approved glTF extensions (e.g., KHR_materials_unlit, KHR_materials_transmission). Assets containing unsupported, deprecated, or experimental extensions should be flagged or rejected.

5. Rigging and Animation Audits

For animated assets, excessive bones and over-sampled keyframes can quickly degrade CPU performance. CI checks should:

  • Count bones and reject models exceeding common GPU skinning limits (often 64 to 256 bones).
  • Check the duration and sampling rate of animation tracks.
  • Verify morph targets do not exceed WebGL uniform limits.

6. Security and URI Sanitization

Standalone glTF files can reference external resources like image files or binary buffers via URIs. Automated checks must prevent security vulnerabilities by:

  • Ensuring all referenced asset paths are relative and contained within the expected directory hierarchy.
  • Blocking absolute URLs, non-HTTPS protocols, or path traversal patterns (e.g., ../).
  • Disallowing unexpected external file formats embedded within custom extras or metadata.

7. Headless Visual Regression Testing

Functional tests alone cannot catch inverted normals, missing UV mappings, or broken shaders. A complete CI/CD workflow uses headless browsers (such as Puppeteer or Playwright) with standard web 3D engines (Three.js, Babylon.js, or <model-viewer>) to render the asset from fixed camera angles. The resulting frames are compared against baseline "golden" images using perceptual diff tools to detect unwanted visual regressions automatically.