Stacks

Run Atlas Headless in CI for Three.js Projects in 2026

Updated 8 min read

To run an Atlas session non-interactively in a CI pipeline for a Three.js project and retrieve machine-readable output, you invoke `atlas run` with the `--format json` flag, ensuring your `package.json` depends on `three` and pre-approving necessary tools like `bash` and `edit` for automated fixes, then integrating with `vitest` and `prettier`.

How to Configure Atlas for Headless Three.js CI Automation

Running Atlas headless in your Three.js CI pipeline in 2026 requires a few key configurations to ensure automated code improvements. You'll start by invoking `atlas run` with the `--format json` flag to get machine-readable output, and explicitly setting the model using the `provider/model` format. This setup allows your pipeline to parse events and react to Atlas's suggestions.

To integrate Atlas into your Three.js CI workflow, begin by ensuring your project's `package.json` file lists `three` as a dependency. This allows Atlas to correctly index your scene graph setup, render loop, materials, and any inlined GLSL shader strings using its tree-sitter based AST declarations. When executing Atlas in a non-interactive CI environment, use the `atlas run` command. The default mode sends a single prompt, streams events to standard output, and exits once the session goes idle. For pipeline steps that need to programmatically consume Atlas's output, pass the `--format json` flag. This streams raw event data, which can be parsed by subsequent CI jobs. For example, a typical invocation might look like `atlas run --format json --model github/copilot-gpt4-turbo "Add dispose paths to my Three.js scene components."`. It is crucial to specify the model explicitly in the `provider/model` format, as headless runs reject other forms. This initial setup is the foundation for automating Three.js specific tasks like memory leak prevention and performance optimization.

Automating Three.js GPU Memory Disposal with Atlas in CI

Preventing GPU memory leaks in Three.js scenes is critical, and Atlas can automate this in CI by adding dispose paths. In 2026, Atlas uses its `edit` tool to modify your code, ensuring geometries, materials, and textures are properly released when a scene unmounts. This process significantly reduces the risk of resource exhaustion.

Three.js applications, especially those with dynamic scene graphs, often suffer from GPU memory leaks if geometries, materials, and textures are not explicitly disposed of. Atlas excels at identifying these patterns and can automatically insert the necessary cleanup code. In a headless CI run, you can prompt Atlas to "Add a dispose path for geometries, materials, and textures so unmounting a scene stops leaking GPU memory." Atlas will then use its `edit` tool to modify relevant files, such as `src/components/MyThreeScene.js` or `src/utils/sceneHelpers.js`, to include calls like `geometry.dispose()` and `material.dispose()`. Before any changes are written, Atlas computes a unified diff, which can be surfaced for review or automatically approved based on your CI configuration. Since headless runs have no interactive user to answer prompts, you must pre-approve the `edit` tool in your Atlas permission configuration. This ensures that Atlas can proceed with its suggested fixes without interruption, making your Three.js applications more robust and performant.

Optimizing Three.js Render Loops and Allocations with Atlas

Optimizing Three.js render loops by moving per-frame object allocations out of `requestAnimationFrame` is a key performance improvement Atlas can automate. In 2026, Atlas identifies these patterns and uses its `edit` tool to refactor code, for example, by reusing `Vector3` instances. This prevents unnecessary garbage collection overhead, improving frame rates.

Frequent object allocations within the `requestAnimationFrame` loop in Three.js can lead to significant performance bottlenecks due to garbage collection overhead. Atlas is designed to detect these inefficiencies and propose refactorings. You can instruct Atlas with a prompt like "Move per-frame object allocations out of the requestAnimationFrame loop into reusable Vector3 instances." Atlas will then analyze your Three.js code, such as a file like `src/renderers/MyRenderer.js` or `src/animations/CharacterAnimation.js`, to find instances where new `THREE.Vector3()` or similar objects are created on every frame. It will then use the `edit` tool to refactor these allocations, moving them to a scope outside the loop and reusing them, for example, by declaring `const _tempVector = new THREE.Vector3();` once and then calling `_tempVector.copy(someOtherVector);` within the loop. After applying these changes, Atlas can be configured to run `vitest` behind a permission prompt to verify that the optimizations haven't introduced regressions. This ensures that performance gains are validated automatically within your CI pipeline.

Ensuring Code Quality and Safety with Atlas in Three.js Pipelines

Ensuring code quality and safety when Atlas makes changes to your Three.js codebase in CI is paramount. Atlas provides robust mechanisms, including permission-gated tool calls and unified diffs, to maintain control. In 2026, you pre-approve tools like `bash` and `edit` and can have Atlas run `prettier` on its generated diffs for consistent formatting.

Atlas prioritizes safety and verifiability, even in headless CI environments. Every tool call, including `bash` for running commands like `npm install` or `vitest`, and `edit` for modifying Three.js source files, is permission-gated. In a headless setup, you must pre-approve the tools the job needs through your Atlas permission configuration. This prevents Atlas from executing unauthorized actions. For instance, to allow Atlas to run your test suite, you would configure permissions for `bash` to execute `npm run vitest`. After Atlas makes any code modifications, it computes a unified diff for every file edit. This diff can be captured from the `--format json` output and presented for human review in your CI system, or automatically applied if your pipeline is configured for full automation. Furthermore, you can instruct Atlas to "Have Atlas run vitest behind a permission prompt, then prettier the diff." This ensures that any changes made to files like `src/scene.js` or `src/materials/customMaterial.js` adhere to your project's formatting standards, which `prettier` enforces, maintaining a clean and consistent Three.js codebase.

Resuming and Iterating on Headless Three.js Atlas Sessions

For complex Three.js refactorings or debugging failed CI runs, Atlas allows you to resume or fork prior headless sessions. In 2026, you can use `--continue`, `--session`, or `--fork` with `atlas run` to pick up exactly where a previous pipeline step left off, saving significant time and resources. This is invaluable for iterative development.

Sometimes, a headless Atlas session in your Three.js CI pipeline might not complete its task in a single run, or you might need to iterate on a complex refactoring. Atlas provides robust mechanisms for resuming or forking prior sessions. If a pipeline step needs to build on an earlier run, you can use the `--continue` flag with `atlas run` to pick up the last active session. Alternatively, if you have a specific session ID, you can use `--session <session-id>` to resume that exact state. For scenarios where you want to experiment with a different approach based on a previous session without altering its history, the `--fork` flag creates a new session from the specified point. This is particularly useful when Atlas is working on intricate Three.js scene graph optimizations or complex shader refactorings in files like `src/shaders/vertexShader.glsl` or `src/geometries/customGeometry.js`. These capabilities ensure that your CI pipeline can handle multi-step Atlas operations efficiently and that developers can easily debug or extend automated changes.

Step by step

  1. 01Ensure your Three.js project's `package.json` includes `three` as a dependency; if not, run `npm install three`.
  2. 02Configure Atlas permissions to pre-approve tools like `bash`, `read`, `edit`, and `todowrite` for non-interactive execution in your CI environment.
  3. 03Invoke Atlas headless to automate GPU memory leak fixes: `atlas run --format json --model github/copilot-gpt4-turbo "Add a dispose path for geometries, materials, and textures in my Three.js scene components so unmounting stops leaking GPU memory."`
  4. 04Execute Atlas headless to optimize render loop performance: `atlas run --format json --model github/copilot-gpt4-turbo "Move per-frame object allocations out of the requestAnimationFrame loop into reusable Vector3 instances in my Three.js code."`
  5. 05After Atlas edits, instruct it to validate changes by running your `vitest` suite: `atlas run --format json --model github/copilot-gpt4-turbo --command "bash npm run vitest"`.
  6. 06Have Atlas apply formatting standards to your Three.js code: `atlas run --format json --model github/copilot-gpt4-turbo --command "bash npm run prettier -- --write src/**/*.js"`.
  7. 07Parse the streamed JSON output from `atlas run` in a subsequent CI step to extract unified diffs, session IDs, or event logs for automated review or application.

Frequently asked questions

How do I prevent Three.js memory leaks in CI automatically?
You can prevent Three.js memory leaks automatically in CI by running Atlas headless with a prompt like "Add a dispose path for geometries, materials, and textures," which will use its `edit` tool to insert necessary cleanup calls.
Can Atlas run `vitest` on my Three.js project in a CI pipeline?
Yes, Atlas can run `vitest` on your Three.js project in a CI pipeline. You would use `atlas run --command "bash npm run vitest"` after pre-approving the `bash` tool in your Atlas permissions.
How does Atlas ensure code quality for Three.js changes in CI?
Atlas ensures code quality for Three.js changes in CI through permission-gated tool calls, unified diffs for every edit, and the ability to run formatters like `prettier` on its generated code.
What output format does Atlas provide for CI integration with Three.js?
For CI integration with Three.js, Atlas provides a machine-readable JSON event stream when you invoke `atlas run` with the `--format json` flag, allowing pipeline steps to parse and react to its output.
How do I optimize Three.js `requestAnimationFrame` loops with Atlas in CI?
Optimize Three.js `requestAnimationFrame` loops with Atlas in CI by prompting it to "Move per-frame object allocations out of the requestAnimationFrame loop into reusable Vector3 instances," which Atlas will refactor using its `edit` tool.
Can I resume a failed Atlas Three.js CI session?
Yes, you can resume a failed Atlas Three.js CI session using `atlas run --continue` to pick up the last active session, or `atlas run --session <session-id>` to resume a specific prior run.
What Three.js specific files does Atlas understand for code indexing?
Atlas understands Three.js specific files by indexing your `package.json` dependencies, scene graph setup, render loop, materials, and any inlined GLSL shader strings using its tree-sitter based AST declarations.

Try Atlas in your terminal

The terminal-native AI coding agent. Free core, single binary.

Install Atlas

Related guides

Run Atlas Headless in CI with Atlas (2026 Workflow)

How to run Atlas headless in CI in 2026: atlas run sends one prompt and exits when the session goes idle, with --format json, --command, and --continue for pipeline steps.

Atlas for Three.js: Terminal-Native AI Coding for Scenes, Materials, and Disposal in 2026

Atlas is a terminal-native AI coding agent for Three.js in 2026, where geometry, material, and texture disposal is the difference between a demo and a leak.

Trace a runtime bug from a stack trace in Three.js with Atlas in 2026

Pinpoint Three.js runtime bugs from production stack traces using Atlas in 2026. Go from a file:line error to a fix and regression test, all without attaching a debugger.

Automate GitHub Issue and Pull Request Triage in Three.js with Atlas in 2026

Streamline Three.js project maintenance in 2026. Atlas automates GitHub issue and pull request triage, ensuring safe, trusted responses for your Three.js codebase.

Run the Three.js Test Suite and Triage Failures with Atlas in 2026

For Three.js developers in 2026, Atlas transforms overwhelming vitest output into a prioritized list of distinct root causes, streamlining debugging and ensuring robust scenes.

Rename a symbol across the repo in Three.js with Atlas in 2026

Refactor Three.js code with Atlas in 2026. Rename functions, classes, or constants across your entire repository, ensuring all references are updated, including those missed by `grep` alone. Atlas uses `lsp`, `grep`

Onboard to an Unfamiliar Three.js Codebase with Atlas in 2026

Quickly build a mental model of any Three.js repository in 2026 using Atlas. Leverage semantic search, file globbing, and read-only exploration to understand scene graphs, materials, and render loops without reading

Extract a Shared Helper from Duplicated Code in Three.js with Atlas in 2026

Refactor your Three.js codebase in 2026 by extracting duplicated logic into a single, tested helper using Atlas. Prevent GPU memory leaks and improve performance.

Browse this resource hub