debuff

السجل الرسمي أدوات المطورين

Let coding agents play, test and tune your 2D web game: live state, explained errors, replays, fuzz.

التثبيت

أضف هذا إلى إعدادات MCP في عميلك (Claude Desktop: claude_desktop_config.json، وCursor: ‏.cursor/mcp.json، ويستخدم VS Code وغيره الصيغة نفسها «mcpServers»).

NPM package @debuffjp/mcp
Claude Code
claude mcp add debuff -- npx -y @debuffjp/mcp@0.19.0
إعداد JSON (Claude Desktop وCursor وVS Code)
{
    "mcpServers": {
        "debuff": {
            "command": "npx",
            "args": [
                "-y",
                "@debuffjp/mcp@0.19.0"
            ]
        }
    }
}

التوثيق

مأخوذ من ملف README للمشروع على GitHub ويُحدَّث أسبوعيًا. تفتح الروابط على GitHub.

المحتويات
  1. Try it
  2. Why not just canvas and JavaScript?
  3. Packages
  4. CLI
  5. Repository layout
  6. Community
  7. License

more room for play.

debuff is an open-source toolkit for 2D browser games that handles the basics for you (the game loop, controls, sound, levels, testing, shipping) so you get to that game sooner and spend your time on what makes it yours.

  • The groundwork, done. Start from a running game in under a minute. Crisp pixels on every screen, keyboard, touch and gamepad, sound that plays, levels from Tiled or LDtk, and a build you can put anywhere on the web, game portals like Poki and CrazyGames included (publishing guide).
  • Tune it until it feels right. Speeds, timings and other feel values become live sliders in the dev panel, with undo.
  • When something breaks, it tells you. Errors say whose bug it is and point at the line. Replays and scenario tests bring a bug back exactly, so you can fix it and move on.
  • Room to grow. Small (the starter ships at about 19 kB) and fast: its renderer, spryte, draws moving sprites 2-4x faster than the most popular 2D web renderer, at an eighth of its size: 800,000 at 60 fps on our test laptop, against 200,000 (benchmarks, run them yourself), so the engine doesn't hold your idea back.
  • Agents help if you want them, you decide. Coding agents can play the game you have open, read what's happening and check their changes. Creative calls stay with you.

Status: 0.9, early development. APIs will change, and feedback from real games shapes them.

Try it

You need Node.js 22 or newer.

npm create debuff@latest my-game
cd my-game
npm install
npm run dev

Open the URL it prints, then press </kbd> in the game for the dev panel. Editsrc/main.tsand the game reloads. The first command asks which template you want. Base templates are starting points for your own game:basic(the minimal starter),topdown(a tile world seen from above),isometric(a 2:1 grid),sidescroller(run and jump) andpointclick(rooms, hotspots and an inventory), all but the first with pixel art drawn in [tenten](https://github.com/debuffjp/tenten). Examples are finished small games to learn from:platformer,mossfell(a top-down adventure) andsquish(a match-3 that plays well on phones). Skip the question with-- --template <id>. pnpm, Yarn and Bun work too (pnpm create debuff`, and so on).

New projects include a .mcp.json, so a coding agent like Claude Code can play and inspect the game you have open, and draw its pixel art with tenten. See the agent guide.

Working on debuff itself? Clone the repo, then run npm install and npm run build. cd templates/platformer && npx debuff dev runs a template against your local packages, and the repo's .mcp.json points the MCP server at it. See CONTRIBUTING.

Why not just canvas and JavaScript?

Raw canvas + JSdebuff
Sprites at 60 fps~5,000~100,000 one call each, ~800,000 in bulk (spryte: WebGL2 with a Canvas 2D fallback)
Small game, shippedwhat you write~19 kB brotli for the starter, everything included
A crash in updatethe loop dies silentlystops, says whose bug it is, links the source line
Tuning feeledit, reload, replaysliders while you play, with undo and copy back to code
AI agentsread code and guessplay your game: state, frames and errors, and you see what they did

More in Why debuff. Agents can start from llms.txt.

Packages

PackageWhat it does
@debuffjp/coreGame loop, fixed-step clock, seeded RNG, scenes, camera, sprites, params, storage, frame stats
@debuffjp/inputKeyboard and pointer/touch with per-step edges and programmatic input
@debuffjp/assetsManifest-driven loader with preload groups and actionable errors
@debuffjp/audioWeb Audio buses, autoplay unlock, parametric synth
@debuffjp/tilemapTilemaps: culled batched rendering, tile collision, Tiled and LDtk import
@debuffjp/uiScreen transitions, menus and framed panels
@debuffjp/juiceTweens, easing, pooled particles, trails, squash-and-stretch
@debuffjp/devDev panel (perf, tune, state, explained errors, replays, rewind) and window.__DEBUFF_DEV__, stripped from production
@debuffjp/clidebuff dev · build · assets · test · scenario · fuzz · inspect · report
myakuFrame profiler for any web game: finds the hitches players feel and says why in plain words. Standalone; debuff dev runs it for you
plonkjsGame music made in code: songs as text, synthesized live with Web Audio, under 4 kB brotli. Standalone; plays through audio.bus("music")
keikoFast, deterministic logic tests for any web game: the real game in Node, no browser. Standalone; debuff integrates it
create-debuffnpm create debuff scaffolder
@debuffjp/mcpMCP server: agents inspect, build, test and play your game

CLI

debuff create [dir]     scaffold from a template
debuff dev              dev server, hot reload, asset manifest watching
debuff build            production build + size report (fails on dev leaks)
debuff assets           regenerate manifest, list unused assets
debuff test             logic tests (keiko): the real game in Node, no browser, in milliseconds
debuff scenario         run scenarios/*.json headless, compare captures
debuff fuzz             random playtesting; crashes come back as replay files
debuff inspect          JSON project summary for agents
debuff report           size report for an existing dist/

Every command accepts --json for machine-readable output where applicable.

Repository layout

packages/    browser runtime libraries (@debuffjp/*)
tooling/     Node-side tools (CLI, scaffolder)
templates/   starter templates; built and scenario-tested in CI
docs/        architecture, roadmap, decisions (docs/adr)

Community

License

MIT

الأسئلة الشائعة

ما هو debuff؟

Let coding agents play, test and tune your 2D web game: live state, explained errors, replays, fuzz.

كيف أثبّت debuff؟

يعمل على جهازك. في Claude Code: claude mcp add debuff -- npx -y @debuffjp/mcp@0.19.0. وفي العملاء الآخرين، الصق إعداد JSON من هذه الصفحة في إعدادات MCP الخاصة بهم.

هل يحتاج debuff إلى مفتاح API؟

لا يذكر إدراجه في السجل أي مفتاح أو سر إلزامي. قد تتطلب بعض الميزات حسابًا لدى الخدمة التي يتصل بها.

هل debuff مفتوح المصدر؟

نعم. شيفرته متاحة على GitHub بترخيص MIT.

من يصون debuff؟

ينشره debuffjp. يدرجه AI.tn لكنه لا يصونه ولا يوصي به.

من سجل MCP الرسمي. الإدراج ليس توصية: راجع شيفرة الخادم وصلاحياته قبل منحه الوصول إلى بياناتك.