Scratch Blocks 2.0: A Blockly Library That Skips Code Generation

What Scratch Blocks Solves and Who It Serves

Scratch Blocks is a library for building creative computing interfaces. It targets developers who want to create block-based programming environments that resemble the Scratch editor, with its colorful, puzzle-piece blocks. The library is designed to work alongside the Scratch Virtual Machine (VM), which handles the actual execution of the scripts. This means you can build a front-end interface without writing your own execution engine. The primary audience is educators, researchers, and developers working on visual programming tools for children or novice programmers. The README states that the library allows for rapid design and development of visual programming interfaces when paired with the VM. It is not a general-purpose block editor; it is specifically shaped around the Scratch model of creative computing.

The Shift from Fork to Dependency in Version 2.0

Version 2.0 changes the project's architecture in a fundamental way. Previously, Scratch Blocks was a fork of Blockly, meaning it maintained its own copy of the Blockly codebase and diverged from it. Now it depends on Blockly as a library, similar to how a typical npm package depends on a third-party module. The README announces this change and notes that the project updated from an unspecified older version of Blockly to version 12. This is a significant maintenance improvement because it reduces the burden of tracking upstream changes. However, it also introduces a new risk: the library's behavior is now tied to a specific Blockly version, and if Blockly moves faster, Scratch Blocks may lag behind. The README acknowledges that there will likely be bumps in the road as they work toward a user-facing release, which signals that the transition is not yet fully polished.

How It Works: No Code Generators, Only the Scratch VM

The core mechanism of Scratch Blocks is that it does not use code generators. In Blockly, code generators translate blocks into executable code like JavaScript or Python. Scratch Blocks skips that step entirely. Instead, it leverages the Scratch VM to create highly dynamic, interactive programming environments. The VM interprets the block structure directly, which allows for real-time feedback and manipulation, such as changing values or adding blocks while a script is running. This design is a deliberate departure from Blockly's typical workflow. The README explains that Scratch Blocks is written in TypeScript and bundled with webpack, just like Blockly, but the execution model is different. For developers, this means you must integrate the Scratch VM to run anything. You cannot use Scratch Blocks alone to produce standalone code; it only provides the visual editing interface.

Getting Started: Commands and Configuration

The README provides a straightforward development setup. To install dependencies, you run `npm ci`, which installs the exact versions from the lockfile. Then `npm run build` compiles the project. For testing, unit tests run in jsdom and require no additional setup; you invoke them with `npm run test:unit`. Browser tests run in Chromium via Playwright. After `npm ci`, you must install the browser once with `npx playwright install chromium`. Then you can run `npm run test:browser`. To run all tests, use `npm test`. For debugging a failing browser test, the README suggests `npm run test:browser -- --browser.headless=false` to show the browser window, or `PWDEBUG=1 npm run test:browser` to pause on startup and open devtools. These commands are specific to the project's tooling, and they give you a clear path to verify changes locally.

A Genuine Limitation: No Code Generation and Blockly Version Lock

The most obvious limitation is the absence of code generators. If your project needs to export user scripts as executable code in a traditional language, Scratch Blocks is the wrong tool. The README explicitly states that it does not use code generators, so you cannot expect to produce JavaScript or Python from blocks. Another limitation is the dependency on a specific Blockly version. The project tracks Blockly 12, and while that brings bug fixes, it also means you are tied to that version's APIs. If Blockly 13 or later introduces breaking changes, Scratch Blocks will not adopt them until the maintainers update the dependency. This could cause compatibility issues if you rely on newer Blockly features. The README's warning about bumps in the road suggests that the 2.0 release is still maturing, so production use may require patience.

Alternative: Use Blockly Directly with Code Generators

If you need code generation, the direct alternative is to use Blockly itself, which is the underlying library that Scratch Blocks builds upon. Blockly includes built-in code generators for JavaScript, Python, PHP, Lua, and Dart. The approach differs in that Blockly is a general-purpose block editor, not tailored to the Scratch aesthetic or the Scratch VM. With Blockly, you define your own block definitions and generator functions, and you control the execution output. Scratch Blocks, by contrast, offloads execution to the Scratch VM, which is optimized for the Scratch runtime. If your goal is to create a tool that produces standalone code, Blockly gives you that capability out of the box. If your goal is to create a Scratch-like environment, Scratch Blocks is the more direct path, but it comes with the constraint of no code generation.

Maintenance and Upgrade Costs

The project uses semantic release to manage version bumps, which means releases follow semver and depend on commit messages following the conventional-changelog specification. This is a maintenance benefit because it automates versioning and reduces the chance of breaking changes for dependent projects. However, it also imposes a discipline on contributors: commit messages must be formatted correctly, or the release process may fail. The README suggests using the commitizen CLI to make commits in the required format, with `npm install -g commitizen@latest cz-conventional-changelog@latest` and then `git cz`. The recent release history shows active development, with multiple releases in April 2026, indicating that the project is being maintained. The license is Apache-2.0, which is permissive and allows commercial use, modification, and distribution, provided you include the license notice. You should verify the exact license terms for your use case, but the permissive nature is a positive for adoption.

Editorial conclusion

Adopt Scratch Blocks 2.0 if you are building a visual programming environment that targets the Scratch ecosystem, especially if you plan to use the Scratch VM for execution. Do not use it if you need code generation to produce JavaScript, Python, or other languages, because the library deliberately omits that feature. Before adopting, verify that your desired Blockly version matches the one Scratch Blocks depends on, since the project tracks Blockly 12 and may lag behind future releases. Check the issues list for known problems and confirm that your build tooling supports webpack and TypeScript, as those are the project's core dependencies.

Official sources

1. Official documentation
2. Official README
3. Project repository
4. Release notes