pictie, my c++-to-webassembly workbench

3 June 2019 10:10 AM (igalia | c++ | webassembly | emscripten | finalizers | weak-refs | javascript | webidl | embind | sicp)

Hello, interwebs! Today I'd like to share a little skunkworks project with y'all: Pictie, a workbench for WebAssembly C++ integration on the web.

loading pictie...

wtf just happened????!?

So! If everything went well, above you have some colors and a prompt that accepts Javascript expressions to evaluate. If the result of evaluating a JS expression is a painter, we paint it onto a canvas.

But allow me to back up a bit. These days everyone is talking about WebAssembly, and I think with good reason: just as many of the world's programs run on JavaScript today, tomorrow much of it will also be in languages compiled to WebAssembly. JavaScript isn't going anywhere, of course; it's around for the long term. It's the "also" aspect of WebAssembly that's interesting, that it appears to be a computing substrate that is compatible with JS and which can extend the range of the kinds of programs that can be written for the web.

And yet, it's early days. What are programs of the future going to look like? What elements of the web platform will be needed when we have systems composed of WebAssembly components combined with JavaScript components, combined with the browser? Is it all going to work? Are there missing pieces? What's the status of the toolchain? What's the developer experience? What's the user experience?

When you look at the current set of applications targetting WebAssembly in the browser, mostly it's games. While compelling, games don't provide a whole lot of insight into the shape of the future web platform, inasmuch as there doesn't have to be much JavaScript interaction when you have an already-working C++ game compiled to WebAssembly. (Indeed, much of the incidental interactions with JS that are currently necessary -- bouncing through JS in order to call WebGL -- people are actively working on removing all of that overhead, so that WebAssembly can call platform facilities (WebGL, etc) directly. But I digress!)

For WebAssembly to really succeed in the browser, there should also be incremental stories -- what does it look like when you start to add WebAssembly modules to a system that is currently written mostly in JavaScript?

To find out the answers to these questions and to evaluate potential platform modifications, I needed a small, standalone test case. So... I wrote one? It seemed like a good idea at the time.

pictie is a test bed

Pictie is a simple, standalone C++ graphics package implementing an algebra of painters. It was created not to be a great graphics package but rather to be a test-bed for compiling C++ libraries to WebAssembly. You can read more about it on its github page.

Structurally, pictie is a modern C++ library with a functional-style interface, smart pointers, reference types, lambdas, and all the rest. We use emscripten to compile it to WebAssembly; you can see more information on how that's done in the repository, or check the README.

Pictie is inspired by Peter Henderson's "Functional Geometry" (1982, 2002). "Functional Geometry" inspired the Picture language from the well-known Structure and Interpretation of Computer Programs computer science textbook.

prototype in action

So far it's been surprising how much stuff just works. There's still lots to do, but just getting a C++ library on the web is pretty easy! I advise you to take a look to see the details.

If you are thinking of dipping your toe into the WebAssembly water, maybe take a look also at Pictie when you're doing your back-of-the-envelope calculations. You can use it or a prototype like it to determine the effects of different compilation options on compile time, load time, throughput, and network trafic. You can check if the different binding strategies are appropriate for your C++ idioms; Pictie currently uses embind (source), but I would like to compare to WebIDL as well. You might also use it if you're considering what shape your C++ library should have to have a minimal overhead in a WebAssembly context.

I use Pictie as a test-bed when working on the web platform; the weakref proposal which adds finalization, leak detection, and working on the binding layers around Emscripten. Eventually I'll be able to use it in other contexts as well, with the WebIDL bindings proposal, typed objects, and GC.

prototype the web forward

As the browser and adjacent environments have come to dominate programming in practice, we lost a bit of the delightful variety from computing. JS is a great language, but it shouldn't be the only medium for programs. WebAssembly is part of this future world, waiting in potentia, where applications for the web can be written in any of a number of languages. But, this future world will only arrive if it "works" -- if all of the various pieces, from standards to browsers to toolchains to virtual machines, only if all of these pieces fit together in some kind of sensible way. Now is the early phase of annealing, when the platform as a whole is actively searching for its new low-entropy state. We're going to need a lot of prototypes to get from here to there. In that spirit, may your prototypes be numerous and soon replaced. Happy annealing!

66 responses

  1. Dewalt D55146 Air Compressor says:

    Kroger Feedback: At Kroger Stores, there is always something unique and new for their customers.

  2. hotel di bandung says:

    Thanks for this information

  3. sohbet says:

    So far it's been surprising how much stuff just works. There's still lots to do, but just getting a C++ library on the web is pretty easy! I advise you to take a look to see the details.

  4. link kisalt says:

    e, but it shouldn't be the only medium for programs. WebAssembly is pa

  5. gamcore says:

    ur toe into the WebAssembly water, maybe take a look also at Pictie when yo

  6. sohbetci says:

    To find out the answers to these questions and to evaluate potential platform modifications, I needed a small, standalone test case.

  7. civodul says:

    Regarding bindings to JS, the original Hop ( had a rather good story for interfacing Scheme code with JS in the browser. You could interact with JS objects and Scheme objects in the same way, seamlessly; the "Code Reuse" section at explains the approach. Of course interfacing C++ with JS is inherently more difficult than interfacing two dynamic languages.

  8. Geek squad support says:

    Geek squad support provides the best troubleshooting solutions regarding your technical issues, if you need the best service for the hardware devices then we are here to give you the
    best services for your devices. Geek Squad tech support is a 24/7 helpline provider.

  9. Gclub says:

    i love this post

  10. Gclub-royal1688 says:

    thank you for information

  11. Ajay Gorecha says:

    Great, you have a lot of spam comments here. if you want I can offer you a free spam filter for your blog. Just contact me!

  12. Eagles Game Online says:

    Here is a complete guide to watch Philadelphia Eagles NFL Live online, including team line-ups, kick off time, TV channel, live news and more updates.

  13. High speed internet services says:

    I am happy to see the internet services in my local area.

  14. says:

    Pictie, yes will definitely try it! Thanks for the info.

  15. Click here says:

    Thanks for the information on this. I really enjoy the write-up.

  16. buy here says:

    Pictie is the best. Tried and tested

  17. check us out says:

    This is necessary for graphics stuff. So glad this is invented.

  18. Glen Owens says:

    Thanks for sharing this WebAssembly C++ integration. click here

  19. Take this says:

    Another great article. Thanks for sharing this!

  20. adamschule85 says:

    Hmm, actually looks useful. droid gamers

  21. Kara says:

    This article is great! Everything is helpful. Thanks so much!| click this

  22. Smith Alfred says:

    Thanks for sharing this fantastic blog, really very informative. Your writing skill is very good, you must keep writing this type of blogs. Geek Squad Tech Support

  23. Linda says:

    Nice work. Maybe you can try a different pattern next time.

  24. says:

    Thanks for sharing this project!

  25. netlix app for PC says:

    These are public broadcasts tagged with #webassembly. You can interact with them if ... pictie, my c++-to-webassembly workbench --

  26. Contact us says:

    Another great article I found! Thank you for sharing this!

  27. Visit us says:

    Thanks for posting this!

  28. says:

    Good post. Nice sharing. Thanks for sharing such useful info. I hope you continuing....

  29. Schedule a Service says:

    Impressive! Thanks for sharing this project!

  30. says:

    Wow! I love your post! Very detailed project. Thanks a lot!

  31. geek squad chat says:

    Other than facing issues with your daily driver equipment, there are tons of accessories that shall meet up with issues at times. Opening a Geek Squad Chat with the support executives shall help you protect any kind of secondary devices like keyboards, monitors, remote controls and docking stations from facing multiple performances related issues in a day

  32. iCloud login says:

    little skunkworks project with y'all: Pictie, a workbench for WebAssembly C++ integration on the web.

  33. Smith Alfred says:

    If you are an owner of a smart home then you are living a beautiful and comfortable life. But this comfort can be spoiled anytime if any of your smart devices are damaged. So you should have an arrangement in case of any mishappening. Geek Squad helpline is always here to help you.

  34. Lisa Ashley says:

    Are you getting frustrated from your Alexa? Is it not working? No need to worry about that! Alexa Helpline is here to help you. We will make your Alexa working again.

  35. Roadside Assistance says:

    Pictie sound amazing. Thank you I would never have heard of it otherwise. I usually don't have time to read stuff like this but Pictie sounds like it could be exactly what I need to get something done. Love you for sharing!

  36. NZ Homeware says:

    Decorate your bathroom by installing stylish accessories that match your home’s decor! NZHomeware provide you widest range of elegant, long lasting, beautiful and luxury products for your bathroom. You can get that much stylish bathroom by upgrading the latest design accessories.

  37. Best CCTv security cams for office says:

    The web platform is getting a new low-level binary compile format that will do a better job at being a compiler target than JavaScript. ... A new language: WebAssembly code defines an AST

  38. my homework done says: is the best solution that wants my homework done and get homework done online. we have well-experienced assignment experts that offer assignment help at any time.

  39. RMRIMS Jobs says:

    Thanks for sharing this.

  40. GarageBand says:

    A Masters is an advanced academic degree that takes place at postgraduate, or 'second-cycle', level, building on existing undergraduate qualifications or professional experience. By completing a Masters you'll gain higher-level skills and a more specialized understanding of your subject area or profession.

  41. Lisa Ashley says:

    Are you fed up with your Alexa device because it is not listening to your commands? If yes, you have reached the right place. Alexa Helpline is the best option for you. Here you will get your Alexa device repaired in a short span of time.

  42. Download for PC says:

    One of the biggest advantages of C++ is the feature of object-oriented programming which includes concepts like classes, inheritance, polymorphism, data abstraction, and encapsulation that allow code reusability and makes a program even more reliable.

  43. casual encounters says:

    To be totally honest I never thought that this is so simple. Thanks for sharing amazing information

  44. says:

    Acabo de hacer un blog tranquilo, informando que es una pieza de trabajo buena y de calidad. Si tiene problemas con el servicio al cliente de Shein, active Netflix y actualice el mapa de TomTom.

  45. Discount Agent says:

    wow great

  46. eat Sleep Burn Reviews says:

    Not many people know that getting a proper night's sleep can actually help you to lose weight. Believe it or not, getting the right amount of deep ...

  47. PIR Motion Sensors says:

    Nice article. I think it is useful and unique article. I love this kind of article and this kind of blog. I have enjoyed it very much. Thanks for your website.

  48. online jigsaw puzzles says:

    The article is very easy to understand, detailed and meticulous! I had a lot of harvest after watching this article from you! I find it interesting, your article gave me a new perspective! I have read many other articles on the same topic, but your article convinced me!

  49. Download Instagram for Mac says:

    All Instagram users are aware that when it comes to the desktop version of this photo-sharing network there are many limitations. Well, Instagram was actually designed to post your everyday life pictures and hence in the desktop version, the users will find that there are limitations when it comes to sharing photos or sending Instagram chat on pc.

  50. Jack says:

    Useful article. Thank you

  51. Geek Squad Online Support says:


  52. jhazi kuti malana says:

    the algorthm is right. i hope people will understand it.thanks for sharing this.

  53. Jazmine Cusonom says:

    a confusing algorithm to tell you the truth.

  54. Ensure Home Inspections says:

    but in the end it has to work i guess

  55. legit assignment writing service uk says:

    C++ is like an ancient language but still in demand due to its parental features! Every programmer should know about the language so that he can relate with the new programming languages.

  56. TV Repair Near Me says:

    If you are facing problems wit TV, and you are searching TV Repair Near Me, our team of experts are there to assist you. Contact for TV Repair 24/7.

  57. David Felay says:

    No fuss post! Thanks

  58. soft makeup service in Lahore says:

    Amazing Post. Thanks for sharing

  59. Printer Support says:

    Thank you for sharing excellent information. Your website is so cool

  60. electrician Rochester ny says:

    When you look at the current set of applications targetting WebAssembly in the browser, mostly it's games.

  61. Kingston Deck Builder says:

    Great Blog! It's pretty interesting! ~ Kingston Deck Builder

  62. St. Catharines Carpet Cleaning says:

    Nice article. It's a little complicated for people who don't know much deeper about math. But all in all interesting. St.Catharines Carpet Cleaners have professional employees who are regularly trained to finish tasks on time. Besides finishing their tasks on time, our professionals ensure that they provide the highest quality-oriented services to our customers to meet their expectations and to keep them happy. Visit our site at or call us at (365) 652-3240

  63. sexkontakte bremen says:

    This is very interesting information that should be shared a lot more

  64. big dairy farms in Lahore says:

    Holistic Foods is a company that provides milk and meat products in Lahore. We have a wider range of dairy products for our valuable costumers. Holistic Foods is the best dairy farm in Lahore .

  65. Assignment Help says:

    I am glad to read your blog is really great and cool post, It's very interesting to get info from you. Your shared article is really perfect than others.

  66. AC Repair Near Me says:

    If you are finding AC Repair Near Me on web, contact our experts and get instant solutions for all the problems related to Air Conditioning.

Leave a Reply