Emscripten - C programs to browser

--- ---

C programs and libraries to Browser

How nice it would be if I can call my own created C programs especially the computational intensive C programs from my Mozilla or Google Browser ( :-) in fact I don’t have anything that much computational intensive), But still . I would also be amazed if I can port some of the C libraries or C++ Games to browser.

Emscripten and Webassembly(wasm) together make this happen

I was following web-assembly and Rust for a few months now. Since Rust has lot of safety features, I did not think of exploring more on porting C or C++ programs to browser.

Emscripten is an Open Source LLVM to JavaScript compiler. Using Emscripten you can:
Compile C and C++ code into JavaScript
Compile any other code that can be translated into LLVM bitcode into JavaScript.
Compile the C/C++ runtimes of other languages into JavaScript, and then run code in those other languages in an indirect way (this has been done for Python and Lua)!

WebAssembly (often shortened to Wasm) is an open standard that defines a portable binary code format for executable programs, and a corresponding textual assembly language, as well as interfaces for facilitating interactions between such programs and their host environment.

Emscripten Installation

Emcripten is not that complex to install,there is good documentation in the site - Emscripten
You might need to install python2.7 and cmake etc as a prior requisite.We just need to follow the instructions. My Linux machine helped me to install everything with apt-get insall command.
You might come across some installation errors, but just search those errors in google, there will be solution to fix it.

C program to wasm

I wrote a simple C program called emccwasm.c

#include<stdio.h>
#include<stdlib.h>
#include<string.h>
#include<stdint.h>
int main(){
        int a = 1;
        printf("%d",a);
        //string function to put a space in the screen
        puts(" ");
        printf("First C program compiled to browser. a=%d",a);
        return 1;
}

In command line, you might need to use below command to compile if you are using Linux machine.
emcc -s NO_EXIT_RUNTIME=1 -s FORCE_FILESYSTEM=1 -s EXPORTED_FUNCTIONS=[’_main’] -o emccwasm.html emccwasm.c
Emscripten FAQ might help you understand these options and resolve the errors you might encounter quickly.
The above command generated 3 files for me , they are emccwasm.html , emccwasm.js and emccwasm.wasm

Emscripten generated Files.

Emcripten created a compiled webassembly file which is emccwasm.wasm as mentioned earlier.Filename will be same as the C program file name. To know more about webassembly , following documentation link helps - https://webassembly.org/
In a nutshell “WebAssembly (abbreviated Wasm) is a binary instruction format for a stack-based virtual machine. Wasm is designed as a portable target for compilation of high-level languages like C/C++/Rust, enabling deployment on the web for client and server application”
The .js and .html files are glue files created for web. The html file can be rendered to the browser and Javascript file initialize webassembly and rest of the glue work

http server

You might need to install http server to void below error . The following documentation can be used for installation -
https://github.com/thecoshman/http
Note: if you have installed Cargo in your machine, the server installation will be very easy.
"**Failed to execute ‘compile’ on ‘WebAssembly’: Incorrect response MIME type. Expected ‘application/wasm’.
**
We can run the server simply by below command:


http

Emscripten files in localhost

Once the http server is up, the files will be served in the browser in the link: http://localhost:8000/emccwasm.html
Note: the port might vary .
If everything goes well, you should be getting a screen similar to below.

Accessing exported functions.

When we compiled the C program we used EXPORT_FUNCTIONS option with _main. That means the _main function should be available in Module.
ie , we can invoke main function by Module._main()

മലയാളത്തില്‍ Pointers പഠിക്കാം programming basics-PART6

മലയാളത്തിൽ python ,C, javascript programming basicsl - PART2

മല‍യാളത്തിൽ python C javascript programming tutorials.

Programming tutorials.

A bit research on String type in Rust

How did the String Type in Rust define?

There are two type of string types in Rust. Once is &str and other one is “String”.

String is heap allocated, grow able and not null termiated type.
&str is a slice(&[u8] ) that always points to a UTF8 valid sequence.
learn more about type usage here String types

But we are trying to focus on “String” type and how do we search Rust source code to see how this type is implemented.

String type - Heap allocation

Heap allocated memory implies that there will be pointer behind the definition of this type.

Let’s see,

We can get the rust source from below link.

https://doc.rust-lang.org/std/string/struct.String.html

click on the src button, as highlighted in the link.

it will directly take you to the surprising fact that String is simply a vector ( vec ).
String is a Vec<u8>

We know that Vec is also a heap allocated memory. In order to find how “vec” is defined in the source ,we need to search keyword “Vec” in the source code.

click on “src”

Interestingly, you will see the code.

pub struct Vec<T> {
    buf: RawVec<T>,
    len: usize,
}

I haven’t heard about RawVec earlier, but this is coming from : crate::raw_vec::RawVec;

raw-vec is implemeted for handling contiguous heap allocations.

Rawvec is implemented as below using a Unique pointer.

As guessed , we come to know that String type is actually using a pointer.

But what is unique pointer?
It comes from use core::ptr::Unique;

Unique is wapper around a raw non nullable ‘*mut T’.
interesting …

NonZero is wrapper type for raw pointers and integers that never becomes zero or null .

FFI tricks in Rust programming Language

How to do a trick on your Rust compiler to allow external (Foreign Language - FFI) functions

Rust is cool programming language which you can easily plugin to other languages ( Foreign Languages) .

Some of the FFI (Foreign language Interface) methods to call rust programs from C programming and Python programming languages are explained here.

Rust - Two things you should know for allowing Foreign language to call

#[no_mangle]
You might see lot of libraries using #[no_mangle] procedural macro.
The #[no_mangle] inform the Rust compiler that this is foreign language function and not to do anything weird with the symbols of this function when compiled because this will called from from other languages. This is needed if you plan on doing any FFI. Not doing so means you won’t be able to reference it in other languages.

extern

The extern keyword is used in two places in Rust. One is in conjunction with the crate keyword to make your Rust code aware of other Rust crates in your project, i.e. extern crate lazy static. The other use is in foreign function interfaces (FFI).

read more extern

how to create a shared object ie .so file from your Rust program ?

We can create a library in Rust using command below command

We are required to update the Cargo.toml

[dependencies]
[lib]
name = "callc"
crate-type = ["staticlib", "cdylib"]

cdylib is important crate type to specifiy in the Cargo.toml.
--crate-type=cdylib, #[crate_type = "cdylib"] - A dynamic system library will be produced. This is used when compiling a dynamic library to be loaded from another language. This output type will create *.so files on Linux, *.dylib files on macOS, and *.dll files on Windows.

Read more on this here linkage

Cargo new callc

//lib.rs
#[no_mangle]
pub extern fn hello(){
  println!("hello world inside rust ");
}
          

as we discussed earlier , since we use #[no_mangle], we can directly go ahead and compile it.
cargo build --release

How to check the generate .so file ?

A file with extension “.so” will generated in you target->release library.

run the below command to verify the function in the shared object.
$nm -D ‘filename.so’ | grep ‘function_name’

Our external function name is available in the shared object file created.

Create a C program for calling the shared object ( .so file)

create C program to call the hello function in your ‘src’ folder.

hello.c

#include<stdio.h>
#include "hello.h" /*header file to be included

/* the main C program to call the hello function
/* hello function is resides in the .so ( shared object) file

int main(void){
   hello();
}

Below header file needs to be created in your ‘src’ folder

hello.h

/*the header include file should have the function declaration.

void hello();

We should link the .so file while compiling the c program. The below command will link and compile the program.

While compiling the C program, link the .so file the ‘release’ folder.

gcc -o hello hello.c -L. -Isrc /home/naveen/rustprojects/callc/target/release/libcallc.so

Your C program should get compiled and 'hello’e executable should be generated.

How do you call a Rust program from Python.

We are going to use the crate pyo3 for creating python modules.

create the projectfolder using cargo
cargo projectname --lib

Your Cargo.toml file should be updated as below in library and dependency sections.

[lib]
name = "string_sum"
crate_type = ["cdylib"]

[dependencies.pyo3]
 version = "0.7.0"
 features = ["extension-module"]

update the lib.rs with the below code:

use pyo3::prelude::*;
use pyo3::wrap_pyfunction;

#[pyfunction]
///format the 2 numbers as string
fn sum_as_string(x:usize,y:usize) -> PyResult<String>{
    Ok((x+y).to_string())
}

#[pymodule]
fn string_sum(py:Python,m:&PyModule) -> PyResult<()>{
    m.add_wrapped(wrap_pyfunction!(sum_as_string))?;
    Ok(())
}

You can build the Rust program using Cargo build --release

This will create .so object in your cargo release folder. You might need to rename the file libstring_sum.so to string_sum.so

Now you can start import the module to the python interpreter and starting using the function string_sum

You might need to use python3 or 3+ interpreters for pyo3 to work.
As screenshot shows below , you can import the functions defined in the Rust module and use them in python.

One of powerful usage of Enum in Rust - Part1

Rust programming - Enum inside Struct

You might have come across this scenario in programming where you want to restrict a field type to restricted custom types.

Especially when you are working with APIs, the some of the field types can be one of the multiple custom types. You don’t want to accept the types other than defined custom types. enum can help you in these scenarios.
,eg event types can be ‘pullevent’, 'pushevent", ‘keypress’,‘mouseevvent’ etc

Example progarm

#[derive(Debug)]
///enum defined for vechicle type field
enum Oneoftwo{
    Car(String),
    Bus(String),
   
}
///struct defined for vehicle.
///Here we are using the defined enum as a type for a field in the struct
struct Vehicle{
    type1:Oneoftwo,
    price:i32,
}
///implementation for the vechile to create new instances
impl Vehicle {
    fn new(type1:Oneoftwo,price:i32) -> Vehicle{
        Vehicle{
            type1,
            price,
        }
    }
}

///main program to demostrate how to use enum inside a struct
fn main() {
    ///creating instances of the struct object
    let honda = Vehicle::new(Oneoftwo::Car("honda".to_string()),4000);
    let tata = Vehicle::new(Oneoftwo::Bus("Tata".to_string()),10000);
     
    println!("{:?},{:?}",honda.type1,honda.price);
    println!("{:?},{:?}",tata.type1,tata.price);
}

output:
Car("honda"),4000
Bus("Tata"),10000