Welcome to Manning India!

We are pleased to be able to offer regional eBook pricing for Indian residents.
All eBook prices are discounted 40% or more!
WebAssembly in Action
With examples using C++ and Emscripten
Gerard Gallant
  • November 2019
  • ISBN 9781617295744
  • 448 pages
  • printed in black & white

This step-by-step practical guide demystifies the complex ecosystem of technologies around WebAssembly.

Daniel Budden, Envato

WebAssembly in Action introduces the WebAssembly stack and walks you through the process of writing and running browser-based applications. Expert developer Gerard Gallant gives you a firm foundation of the structure of a module, HTML basics, JavaScript Promises, and the WebAssembly JavaScript API.

Table of Contents detailed table of contents

Part 1: First Steps

1 Meet WebAssembly

1.1 What is WebAssembly?

1.2 What problems does it solve?

1.2.1 Performance improvements

1.2.2 asm.js, the forerunner to WebAssembly

1.2.3 Faster startup times compared with JavaScript

1.2.4 Ability to use languages other than JavaScript in the browser

1.2.5 Opportunity for code reuse

1.3 How does it work?

1.3.1 Overview of how compilers work

1.3.2 Loading, compiling, and instantiating a module

1.4 Structure of a WebAssembly module

1.4.1 Preamble

1.4.2 Known sections

1.4.3 Custom sections

1.5 WebAssembly Text Format

1.6 How is WebAssembly secure?

1.7 What languages can I use to create a WebAssembly module?

1.8 Where can I use my module?

1.9 Summary

2 A look inside WebAssembly modules

2.1 Known sections

2.2 Custom sections

2.3 Summary

3 Creating your first WebAssembly module

3.1 The Emscripten toolkit

3.2 WebAssembly modules

3.2.1 When would you not use a WebAssembly module?

3.3 Emscripten output options

3.4 Compiling C or C++ with Emscripten and using the HTML template

3.5 JavaScript plumbing code

3.5.1 Compiling C or C++ with Emscripten generated JavaScript

3.5.2 Creating a basic HTML webpage for use in browsers

3.6 Only the WebAssembly file

3.6.1 Compiling C or C++ as a side module with Emscripten

3.6.2 Loading and instantiating in a browser

3.7 Feature detection: How to test if WebAssembly is available

3.8 Exercises

3.9 Summary

Part 2: Working with Modules

4 Reusing your C++ codebase

4.1 Using C or C++ to create a module with Emscripten plumbing

4.1.1 Making the C++ modifications

4.1.2 Compiling the code into a WebAssembly module

4.1.3 Creating the webpage

4.1.4 Creating the JavaScript that will interact with the module

4.1.5 Viewing the results

4.2 Using C or C++ to create a module without Emscripten

4.2.1 Making the C++ modifications

4.2.2 Compiling the code into a WebAssembly module

4.2.3 Creating the JavaScript that will interact with the module

4.2.4 Viewing the results

4.3 Exercises

4.4 Summary

5 Creating a WebAssembly module that calls into JavaScript

5.1 Using C or C++ to create a module with Emscripten plumbing

5.1.1 Adjusting the C++ code

5.1.2 Creating the JavaScript that you want included in Emscripten’s generated JavaScript file

5.1.3 Compiling the code into a WebAssembly module

5.1.4 Adjusting the JavaScript code of the webpage

5.1.5 Viewing the results

5.2 Using C or C++ to create a module without Emscripten plumbing

5.2.1 Making the C++ modifications

5.2.2 Compiling the code into a WebAssembly module

5.2.3 Adjusting the JavaScript that will interact with the module

5.2.4 Viewing the results

5.3 Exercises

5.4 Summary

6 Creating a WebAssembly module that talks to JavaScript using function pointers

6.1 Using C or C++ to create a module with Emscripten plumbing

6.1.1 Using a function pointer given to the module by JavaScript

6.1.2 Adjusting the C++ code

6.1.3 Compiling the code into a WebAssembly module

6.1.4 Adjusting the JavaScript code of the webpage

6.1.5 Viewing the results

6.2 Using C or C++ to create a module without Emscripten plumbing

6.2.1 Using function pointers given to the module by JavaScript

6.2.2 Making the C++ modifications

6.2.3 Compiling the code into a WebAssembly module

6.2.4 Adjusting the JavaScript that will interact with the module

6.2.5 Viewing the results

6.3 Exercises

6.4 Summary

Part 3: Advanced Topics

7 Dynamic linking: the basics

7.1 Dynamic linking: pros and cons

7.2 Dynamic linking options

7.2.1 Side modules and main modules

7.2.2 Dynamic linking: dlopen

7.2.3 Dynamic linking: dynamicLibraries

7.2.4 Dynamic linking: WebAssembly JavaScript API

7.3 Dynamic linking review

7.4 Exercises

7.5 Summary

8 Dynamic linking: the implementation

8.1 Creating the WebAssembly modules

8.1.1 Split the logic in the validate.cpp file into two files

8.1.2 Create a new C++ file for the Place Order form’s logic

8.1.3 Use Emscripten to generate the WebAssembly side modules

8.1.4 Define a JavaScript function to handle an issue with the validation

8.1.5 Use Emscripten to generate the WebAssembly main module

8.1.6 Adjusting the webpage

8.1.7 Adjusting the JavaScript of your webpage

8.1.8 Viewing the results

8.2 Exercises

8.3 Summary

9 Threading: web workers and pthreads

9.1 Benefits of web workers

9.2 Considerations for using web workers

9.3 Pre-fetch a WebAssembly module using a web worker

9.3.1 Adjusting the calculate primes logic

9.3.2 Use Emscripten to generate the WebAssembly files

9.3.3 Copying files to the correct location

9.3.4 Creating the HTML file for the webpage

9.3.5 Creating the JavaScript file for the webpage

9.3.6 Creating the web worker’s JavaScript file

9.3.7 Viewing the results

9.4 Using pthreads

9.4.1 Adjusting the calculate primes logic to create and use four pthreads

9.4.2 Using Emscripten to generate the WebAssembly files

9.4.3 Viewing the results

9.5 Exercises

9.6 Summary

10 WebAssembly modules in Node.js

10.1 Revisiting what you know

10.2 Server-side validation

10.3 Working with Emscripten-built modules

10.3.1 Loading a WebAssembly module

10.3.2 Calling functions in the WebAssembly module

10.3.3 Calling into the JavaScript

10.3.4 Calling JavaScript function pointers

10.4 Using the WebAssembly JavaScript API

10.4.1 Loading and instantiating a WebAssembly module

10.4.2 Calling functions in the WebAssembly module

10.4.3 The WebAssembly module calling into the JavaScript

10.4.4 The WebAssembly module calling JavaScript function pointers

10.5 Exercises

10.6 Summary

Part 4: Debugging and Tools

11 WebAssembly text format

11.1 Creating the game’s core logic using WebAssembly text format

11.1.1 The module’s sections

11.1.2 Comments

11.1.3 Function signatures

11.1.4 The module node

11.1.5 The import nodes

11.1.6 The global nodes

11.1.7 The export nodes

11.1.8 The start node

11.1.9 The code nodes

11.1.10 The type nodes

11.1.11 The data node

11.2 Generate a WebAssembly module from the text format

11.3 The Emscripten-generated module

11.3.1 Create the C++ file

11.3.2 Generate a WebAssembly module

11.4 Create the HTML and JavaScript files

11.4.1 Modify the HTML file

11.4.2 Create the JavaScript file

11.5 Viewing the results

11.6 Exercises

11.7 Summary

12 Debugging

12.1 Extending the game

12.2 Adjust the HTML

12.3 Display the number of tries

12.3.1 generateCards JavaScript function

12.3.2 Adjust the text format

12.3.3 Generate the Wasm file

12.3.4 Test the changes

12.4 Increment the number of tries

12.4.1 The updateTriesTotal JavaScript function

12.4.2 Adjust the text format

12.4.3 Generate the Wasm file

12.4.4 Test the changes

12.5 Update the summary screen

12.5.1 The levelComplete JavaScript function

12.5.2 Adjust the text format

12.5.3 Generate the Wasm file

12.5.4 Test the changes

12.6 Exercises

12.7 Where do you go from here?

12.8 Summary

13 Testing—​and then what?

13.1 Installing the JavaScript testing framework

13.1.1 The Package.json file

13.1.2 Install Mocha and Chai

13.2 Writing the tests

13.2.1 Write the tests

13.2.2 Running the tests from the command line

13.2.3 An HTML page that loads your tests

13.2.4 Running the tests from a browser

13.2.5 Make the tests pass

13.3 Exercises

13.4 Where do you go from here?

13.5 Summary

Appendixes

Appendix A: A Installation & tool setup

A.1 Python

A.1.1 Running a local web server

A.1.2 The WebAssembly Media Type

A.2 Emscripten

A.2.1 Downloading the Emscripten SDK

A.2.2 If you’re using Windows

A.2.3 If you’re using a Mac or Linux

A.2.4 Working around installation issues

A.3 Node.js

A.4 WebAssembly Binary Toolkit

A.5 Bootstrap

Appendix B: B ccall, cwrap, and direct function calls

B.1 ccall

B.1.1 Building a simple WebAssembly module

B.1.2 Building the webpage that will talk to the WebAssembly module

B.2 cwrap

B.2.1 Adjusting the JavaScript code to use cwrap

B.3 Direct function calls

B.4 Passing an array to a module

Appendix C: C Emscripten macros

C.1 emscripten_run_script macros

C.2 EM_JS

C.2.1 No parameter values

C.2.2 Passing parameter values

C.2.3 Passing pointers as parameters

C.2.4 Returning a string pointer

C.3 EM_ASM

C.3.1 EM_ASM

C.3.2 EM_ASM_

C.3.3 Passing pointers as parameters

C.3.4 EM_ASM_INT and EM_ASM_DOUBLE

C.3.5 Returning a string pointer

Appendix D: D Exercise solutions

D.1 Chapter 3

D.1.1 Exercise 1

D.1.2 Exercise 2

D.2 Chapter 4

D.2.1 Exercise 1

D.2.2 Exercise 2

D.3 Chapter 5

D.3.1 Exercise 1

D.3.2 Exercise 2

D.4 Chapter 6

D.4.1 Exercise 1

D.4.2 Exercise 2

D.5 Chapter 7

D.5.1 Exercise 1

D.5.2 Exercise 2

D.6 Chapter 8

D.6.1 Exercise 1

D.6.2 Exercise 2

D.7 Chapter 9

D.7.1 Exercise 1

D.7.2 Exercise 2

D.8 Chapter 10

D.8.1 Exercise 1:

D.8.2 Exercise 2:

D.8.3 Exercise 3

D.9 Chapter 11

D.9.1 Exercise 1

D.9.2 Exercise 2

D.10 Chapter 12

D.10.1 Exercise 1

D.10.2 Exercise 2

D.11 Chapter 13

D.11.1 Exercise 1

D.11.2 Exercise 2

Appendix E: E Text format extras

E.1 Control flow statements

E.1.1 If statements

E.1.2 Loops

E.2 Function pointers

E.2.1 Test the code

About the Technology

Write high-performance browser-based applications without relying only on JavaScript! By compiling to the WebAssembly binary format, your C, C++, or Rust code runs at near-native speed in the browser. WebAssembly delivers greater speed, opportunities to reuse existing code, and access to newer and faster libraries. Plus, you can easily interact with JavaScript when you need to.

About the book

WebAssembly in Action teaches you how to write and run high-performance browser-based applications using C++ and other languages supported by WebAssembly. In it, you’ll learn to create native WebAssembly modules, interact with JavaScript components, and maximize performance with web workers and pthreads. And you’ll love how the clearly organized sections make it a breeze to find the important details about every function, feature, and technique.

What's inside

  • Dynamic linking of multiple modules at runtime
  • Communicating between modules and JavaScript
  • Debugging with WebAssembly Text Format
  • Threading with web workers and pthreads

About the reader

Written for developers with a basic understanding of C/C++, JavaScript, and HTML.

About the author

Gerard Gallant is a Microsoft Certified Professional and a Senior Software Developer at Dovico Software. He blogs regularly on Blogger.com and DZone.com.


combo $49.99 pBook + eBook + liveBook
eBook $39.99 pdf + ePub + kindle + liveBook
Prices displayed in rupees will be charged in USD when you check out.

placing your order...

Don't refresh or navigate away from the page.

FREE domestic shipping on three or more pBooks