mcpField
T
threejs-lite

threejs-lite

github.com/farworld-labsDevelopment63 installs
Repository

About threejs-lite

A skill for building browser-based 3D games with Three.js, aimed at keeping rendering simple and mobile performance stable. It provides a workflow, guardrails, and references for Remix integration.

Key features

  1. 01Single-file starter workflow
  2. 02Simple scene and gameplay loop
  3. 03Low draw-call guidance
  4. 04Mobile performance patterns
  5. 05Remix SDK hooks and validation

Use cases

  1. 01Prototyping a lightweight 3D browser game
  2. 02Building a game with predictable rendering costs
  3. 03Preparing a single-file HTML upload for Remix
  4. 04Checking required Remix gameplay hooks

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/farworld-labs/remix-skills --skill threejs-lite

After installing, type/threejs-litein Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

assets/
starter-single-file.html
references/
sdk-integration.md
threejs-mobile-patterns.md

Details

From the project README

Three.js Lite

Use this skill when a user wants a 3D browser game with minimal rendering complexity and stable mobile performance.

Workflow

  1. Start from assets/starter-single-file.html.
  2. Implement one camera, one scene, one gameplay loop.
  3. Add player input and terminal condition before adding visual polish.
  4. Keep geometry/material count small and predictable.
  5. If targeting Remix, apply hooks in references/sdk-integration.md.
  6. Validate required hooks (gameOver, onPlayAgain, onToggleMute) before handoff.

Guardrails

  • Keep draw calls low and avoid postprocessing by default.
  • Prefer simple MeshBasicMaterial/MeshStandardMaterial setups.
  • Avoid dynamic shadows on first pass.
  • For Remix uploads, output single-file HTML with inline JS/CSS unless user asks otherwise.
  • For Remix uploads, include <script src="https://cdn.jsdelivr.net/npm/@remix-gg/sdk@latest/dist/index.min.js"></script> in HTML <head>.
  • Treat 3D as optional style; gameplay clarity is higher priority than visual complexity.

References

  • references/threejs-mobile-patterns.md for scene setup, controls, and perf budgets.
  • references/sdk-integration.md for SDK hooks required by Remix validation.

Comments

Markdown supported