Iffe - Javascript Inlining for Emscripten

I personally find it quite difficult to work with multiple languages at once. Even though creating binding layers between C++ and Javascript in Emscripten is much easier than between something like C# and Java, it is still really fiddly and I find myself making too many mistakes. To solve this, I created Iffe. The original idea is pretty similar to how you can inline ASM in C and C++ or how the Flash C++ compiler can inline AS3.

Having this flexibility in Emscripten is great because it allows us to integrate Javascript libraries directly with our software quickly whilst allowing us to keep all our code in a single codebase rather than separating out the JS bits from the C/C++ bits.

The following example demonstrates how Iffe works for the developer. In this example, it simply creates some variables in C++ which are then modified by JS whilst being output using the JS alert box and the C++ cout.

#include <iostream>

int main(int argc, char* argv[])
{
  std::string name = "Thomas";
  int age = 26;
  bool male = true;
  float height = 5.11f;

  std::cout << "C++ - Name: " << name << " Age: " << age << " Male: " << male << " Height: " << height << std::endl;

// Any code between these preprocessor defines is javascript and can access the DOM, talk to JS APIs etc...
// directly without requiring specific bindings or wrappers.
#IFFE_JS_INLINE name=string age=int male=bool height=float
  alert("Javascript - Name: " + name + " Age: " + age + " Male: " + male + " Height: " + height);

  name = "Jenny";
  age = age + 15;
  male = false;
  height = 6.3;
#END

  std::cout << "C++ - Name: " << name << " Age: " << age << " Male: " << male << " Height: " << height << std::endl;

  return 0;
}

You can download an early version of the software here.

Download

tar -xf em_iffe-0.1.1.tar.gz
cd em_iffe
// Change the em++ path in Makefile
make

Then simply open the newly generated index.html in a web browser.

If you like this software and want to know more, then feel free to contact me.