Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.

Rhai Playground

This is an attempt to make a playground for the Rhai scripting language using WebAssembly.

The master branch is automatically built and deployed here. A known-good build is published on

Embedding the Rhai Playground (work in progress)

It is still a work-in-progress, but it is possible to embed the playground for use on another web page.

View demo on CodePen

iframe.rhaiPlayground {
    width: 100%;
    height: 400px;
    border: 0;

<pre><code class="language-rhai">fn hello_rhai(msg) {
    print("Hello world! " + msg);
hello_rhai("Embed the Rhai Playground to run Rhai code!");

const ORIGIN = "";
const PATH = "/playground/stable/";
let nextPlaygroundIdx = 0;
function loadPlayground(el) {
    const id = "" + nextPlaygroundIdx++;
    const iframe = document.createElement("iframe"); =;
    iframe.className = el.className;
    iframe.src = ORIGIN + PATH + "#embed-" + id;
    const code = el.innerText;
    const onMessage = ev => {
        if (
   === "rhai-playground" &&
   === "embed-loaded" &&
   === id
        ) {
                    to: "rhai-playground",
                    req: "embed-init",
            // window.removeEventListener("message", onMessage);
    window.addEventListener("message", onMessage);

document.querySelectorAll("code.language-rhai").forEach(el => {

How to install

npm install

How to run in debug mode

# Builds the project and opens it in a new browser tab. Auto-reloads when the project changes.
npm start

How to build in release mode

# Builds the project and places it into the `dist` folder.
npm run build

How to run unit tests

# Runs tests in Firefox
npm test -- --firefox

# Runs tests in Chrome
npm test -- --chrome

# Runs tests in Safari
npm test -- --safari

What does each file do?

  • Cargo.toml contains the standard Rust metadata. You put your Rust dependencies in here. You must change this file with your details (name, description, version, authors, categories)

  • package.json contains the standard npm metadata. You put your JavaScript dependencies in here. You must change this file with your details (author, name, version)

  • webpack.config.js contains the Webpack configuration. You shouldn't need to change this, unless you have very special needs.

  • The js folder contains your JavaScript code (index.js is used to hook everything into Webpack, you don't need to change it).

  • The src folder contains your Rust code.

  • The static folder contains any files that you want copied as-is into the final build. It contains an index.html file which loads the index.js file.

  • The tests folder contains your Rust unit tests.


A Rhai scripting playground that runs Rhai scripts using WebAssembly in a web browser.








No releases published


No packages published