https://github.com/twiddlingbits/twr-wasm

twr-wasm: easily run C/C++ code in a web browser using Web Assembly, with examples
https://github.com/twiddlingbits/twr-wasm

c cpp crt emscripten libcxx wasm web-development webassembly webassembly-cpp webassembly-demo webassembly-examples webassembly-tutorial

Last synced: about 2 months ago
JSON representation

twr-wasm: easily run C/C++ code in a web browser using Web Assembly, with examples

• Host: GitHub
• URL: https://github.com/twiddlingbits/twr-wasm
• Owner: twiddlingbits
• License: mit
• Created: 2024-02-03T14:07:36.000Z (8 months ago)
• Default Branch: main
• Last Pushed: 2024-08-02T10:37:12.000Z (about 2 months ago)
• Last Synced: 2024-08-02T12:09:38.500Z (about 2 months ago)
• Topics: c, cpp, crt, emscripten, libcxx, wasm, web-development, webassembly, webassembly-cpp, webassembly-demo, webassembly-examples, webassembly-tutorial
• Language: C++
• Homepage: https://twiddlingbits.dev/
• Size: 33.8 MB
• Stars: 11
• Watchers: 4
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: readme.md
  • License: LICENSE

Awesome Lists containing this project

• Awesome-WebAssembly-Applications - [twr-wasm

README

        
# Easier C/C++ WebAssembly

**Version 2.3.1**

twr-wasm is a simple, lightweight and easy to use library for building C/C++ WebAssembly code directly with clang. It solves some common use cases with less work than the more feature rich emscripten. 

twr-wasm is easy to understand, and has some great features. You can call blocking functions. You can input and print streaming character i/o to a `
` tag, use a `` element as an ANSI terminal, and use 2D drawing apis (that are compatible with JavaScript Canvas APIs) to draw to a `` element. 


twr-wasm allows you to run C/C++ code in a web browser. Legacy code, libraries, full applications, or single functions can be integrated with JavaScript and TypeScript.

twr-wasm is designed to be used with the standard llvm clang compiler and tools.

twr-wasm was previously named tiny-wasm-runtime.

## Live WebAssembly Examples and Source

| Name | View Live Link | Source Link |

| --------- | ------------ | ----------- |

| Bouncing Balls (C++) | [View bouncing balls](https://twiddlingbits.dev/examples/dist/balls/index.html) | [Source for balls](https://github.com/twiddlingbits/twr-wasm/tree/main/examples/balls) |

| Maze Gen/Solve (Win32 C Port) | [View live maze](https://twiddlingbits.dev/examples/dist/maze/index.html) | [Source for maze](https://github.com/twiddlingbits/twr-wasm/tree/main/examples/maze) |

| Input/Output with `
` | [View square demo](https://twiddlingbits.dev/examples/dist/stdio-div/index.html) | [Source](https://github.com/twiddlingbits/twr-wasm/tree/main/examples/stdio-div) |

|Mini-Terminal (hello world using ``)|[View demo](https://twiddlingbits.dev/examples/dist/stdio-canvas/index.html) |[Source](https://github.com/twiddlingbits/twr-wasm/tree/main/examples/stdio-canvas) |

|CLI using libc++ and ``)| [View console](https://twiddlingbits.dev/examples/dist/tests-user/index.html) | [Source](https://github.com/twiddlingbits/twr-wasm/tree/main/examples/tests-user) |


## Full Documentation

The full documentation can be [found here](https://twiddlingbits.dev/docsite/)

## Key Features

   - compile and link C/C++ for use with WebAssembly using clang directly

   - standard C library, libc++. and purpose built APIs available from C/C++

   - TypeScrpt/JavaScript classes to load Wasm modules and call C/C++ functions

   - localization support, UTF-8, and windows-1252 support

   - in C/C++, print and get characters to/from `
` tags in your HTML page

   - in C/C++, print and get characters to/from a `` based "terminal"

   - in C/C++ use 2D drawing API compatible with JavaScript Canvas

   - in C/C++, use the "blocking loop" pattern and integrate with Javascript's asynchronous event loop


## Installation

`npm install twr-wasm`. 

For details see https://twiddlingbits.dev/docsite/gettingstarted/installation/

## Hello World

Here is the simplest twr-wasm example.

C code:

~~~

#include 

void hello() {

   printf("hello world\n");

}

~~~

index.html:

~~~

   Hello World

   


   

      import {twrWasmModule} from "twr-wasm";

      

      const mod = new twrWasmModule();

      await mod.loadWasm("./helloworld.wasm");

      await mod.callC(["hello"]);

   

~~~

## Simple \
 i/o

I/O can be directed to or from a \
 or a \ tag.  Here is a simple example using a \
 for stdio input and output.


 


~~~

#include 

#include 

#include "twr-crt.h"

void stdio_div() {

   char inbuf[64];

   int i;

   printf("Square Calculator\n");

   while (1) {

      printf("Enter an integer: ");

      twr_gets(inbuf);

      i=atoi(inbuf);

      printf("%d squared is %d\n\n",i,i*i);

   }

}

~~~

With an index.html like the following.  This time we are using twrWasmModuleAsync which integrates blocking C code into Javascript.  twrWasmModuleAsync can also be used to receive key input from a \
 or \ tag. 


~~~

   stdio-div example

   
Loading... 




   

      import {twrWasmModuleAsync} from "twr-wasm";

      let amod;

      try {

         amod = new twrWasmModuleAsync();

         document.getElementById("twr_iodiv").innerHTML ="<br>";

         document.getElementById("twr_iodiv").addEventListener("keydown",(ev)=>{amod.keyDownDiv(ev)});

         await amod.loadWasm("./stdio-div.wasm");

         await amod.callC(["stdio_div"]);

}

catch(ex) {

   amod.divLog("unexpected exception");

   throw ex;

}

~~~

## Full Documentation

The full documentation can be [found here](https://twiddlingbits.dev/)