GithubHelp home page GithubHelp logo

daneelsan / minimal-zig-wasm-canvas Goto Github PK

View Code? Open in Web Editor NEW
82.0 82.0 8.0 285 KB

A minimal example showing how HTML5's canvas, wasm memory and zig can interact.

Zig 50.75% HTML 7.79% JavaScript 41.46%
html5-canvas javascript wasm webassembly zig

minimal-zig-wasm-canvas's People

Contributors

daneelsan avatar mgord9518 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

minimal-zig-wasm-canvas's Issues

Why manually setting `global-base`?

In build.zig it sets the global-base to 6560.

// https://github.com/ziglang/zig/issues/8633
lib.global_base = 6560;

As far as I know, setting global-base is used to reserve part of the memory.

For example, in tic80's (a fantasy console) example zig project's build.zig, they do this:

// all the memory below 96kb is reserved for TIC and memory mapped I/O
// so our own usage must start above the 96kb mark
lib.global_base = 96 * 1024;

https://github.com/joshgoebel/TIC-80/blob/main/templates/zig/build.zig

That makes sense, we dont want the stack or the heap to touch those first 96 * 1024 bytes because thats were the tic runtime will put all the runtime necessary information.

But in this project, there is no such thing, so I feel like global-base should be set to 0? What am I missing?

'__memory_base' is not a Number

When building with recent versions of Zig, the build first fails with wasm-ld: --global-base may not be used with -shared/-pie. After removing the line that sets global base in build.zig, the build appears to succeed except it will fail to run in browsers (tested with Firefox and Chromium).

In the Firefox console, '__memory_base' is not a Number is the error given, Chromium gives a similar error. It appears that this can be partially remedied by setting some values in the script.js file, which I will add below:

var importObject = {
    env: {
        consoleLog: (arg) => console.log(arg), // Useful for debugging on zig's side

        memory: memory,

        __memory_base: 0,

        // TODO: where to start stack pointer?
        __stack_pointer: new WebAssembly.Global({
            value: "i32",
            mutable: true
        }, 0),

        __indirect_function_table: new WebAssembly.Table({
            initial: 0,
            maximum: 0,
            element: 'anyfunc'
        }),

        __table_base: 0,
    },
};

Setting these values in the importObject section appear to make this specific example now work, although it seems incredibly hacky and doesn't function correctly with a more complex personal project of mine, so it probably shouldn't just be accepted as a solution without further investigation.

What changed in Zig to change this behavior? It appears that if this project is not rebuilt after cloning, it will run as intended, so whatever now has to be manually set in the js file was once in the wasm binary itself.

Cannot build with 2 pages

Hi,

With the proposed WASM memory settings (128 KBytes), wasm-ld can't build the binaries:

zig build checkerboard -Drelease=true --verbose
/usr/local/Cellar/zig/0.10.0/bin/zig build-lib /projects/git/minimal-zig-wasm-canvas/checkerboard.zig -OReleaseSmall --cache-dir /projects/git/minimal-zig-wasm-canvas/zig-cache --global-cache-dir /.cache/zig --name checkerboard -dynamic --import-memory --initial-memory=131072 --max-memory=131072 --global-base=6560 -target wasm32-freestanding-musl -mcpu generic --enable-cache 
LLD Link... wasm-ld: error: initial memory too small, 1055392 bytes needed

So I had to set 17 pages.

zig build checkerboard -Drelease=true --verbose
/usr/local/Cellar/zig/0.10.0/bin/zig build-lib /projects/git/minimal-zig-wasm-canvas/checkerboard.zig -OReleaseSmall --cache-dir /projects/git/minimal-zig-wasm-canvas/zig-cache --global-cache-dir /.cache/zig --name checkerboard -dynamic --import-memory --initial-memory=1114112 --max-memory=1114112 --global-base=6560 -target wasm32-freestanding-musl -mcpu generic --enable-cache

How did you do to make it fit in 2 pages?

Note: I'm using Zig 0.10.0 on MacOS

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.