Different ways to terminate a WebAssembly process from inside a web worker

Question

Different ways to terminate a WebAssembly process from inside a web worker

In my web application, I have a wasm process (compiled from c++) that processes data. The code for this process is as follows:

std::vector<JSONObject> data
for (size_t i = 0; i < data.size(); i++)
{
    process_data(data[i]);

    if (i % 1000 == 0) {
        bool is_cancelled = check_if_cancelled();
        if (is_cancelled) {
            break;
        }
    }

}

This code essentially simulates running/processing a query like a SQL query interface:

https://i.sstatic.net/WKPws.png

Queries may take minutes to complete and the user has the option to cancel their query at any time. The cancellation process happens in the normal javascript/web application, not within the service Worker where the wasm is running.

My concern is how to notify the wasm process when the user cancels their query so it can exit properly. Terminating the worker with worker.terminate() is not an option because we need to keep all loaded data for that worker. It needs to remain active so another query can be executed.

How can we effectively communicate between the javascript and worker/wasm/c++ application to know when to exit gracefully?

Additionally, let's assume a standard query takes 60s to execute and processes 500MB of data using cpp/wasm in-browser.

Update: After some research and feedback, here are some potential solutions along with their feasibility:

Using two workers - one to store data and another to process it. However, transferring large amounts of data would be time-consuming and inefficient.
Utilizing Emterpreter and emscripten_sleep_with_yield, but this significantly impacts performance.
Running a second worker while displaying only the most recent data on UI, potentially causing memory errors.
Sending API calls to a server to track query status, but it involves frequent network requests adding unnecessary overhead.
Implementing an incremental-parsing approach by rewriting parsing functions, which could be labor-intensive.
Storing status in IndexedDB, allocating memory in WASM, and processing data in C++, which seems promising but requires further exploration.
[Any other suggestions?]

For the bounty, I'm seeking answers to these questions:

Are the six proposed solutions valid?
Are there better alternatives worth considering?
Can someone demonstrate a basic example of #6, assuming it works universally across browsers?

javascript c++web-worker emscripten webassembly

Answer 1

Answer №1

To optimize performance in Chrome, consider utilizing shared memory for storing data and setting a flag to halt processes when necessary. However, this solution is complex and only supported on the Chrome browser. It also relies on the structure of your queries and whether there are checkpoints to check the halt flag.

Alternatively, calling the C++ function multiple times, once for each query, and checking for a halt signal after each call may be a better approach. Breaking down the query into stages through multiple function calls could also be beneficial depending on your specific scenario.

Unfortunately, there is no direct way to send a signal to a WebAssembly execution like Linux kill. As a result, you'll need to wait for the operation to complete before being able to cancel effectively.

If user experience is a priority, consider using two workers to handle tasks. While this will increase memory usage, it allows for more immediate cancellations by switching to the second worker to process subsequent queries while the first handles cancellation requests.

Answer 2

To optimize performance in Chrome, consider utilizing shared memory for storing data and setting a flag to halt processes when necessary. However, this solution is complex and only supported on the Chrome browser. It also relies on the structure of your queries and whether there are checkpoints to check the halt flag.

Alternatively, calling the C++ function multiple times, once for each query, and checking for a halt signal after each call may be a better approach. Breaking down the query into stages through multiple function calls could also be beneficial depending on your specific scenario.

Unfortunately, there is no direct way to send a signal to a WebAssembly execution like Linux kill. As a result, you'll need to wait for the operation to complete before being able to cancel effectively.

If user experience is a priority, consider using two workers to handle tasks. While this will increase memory usage, it allows for more immediate cancellations by switching to the second worker to process subsequent queries while the first handles cancellation requests.

Answer 3

Answer №2

Thread Sharing

When a worker and a C++ function share the same thread, the worker will be blocked until the C++ loop is complete, unable to handle any incoming messages. To reduce blocking time, it may be more efficient to initialize one iteration at a time from the main application.

The process would resemble:

main.js  ->  worker.js  ->  C++ function  ->  worker.js  ->  main.js

Breaking Down the Loop

In this scenario, a variable in C++ is set to 0, incrementing with each loop iteration and stored in memory. The C++ function executes one loop iteration, increments the variable for tracking, and then halts.

int x;
x = 0;

std::vector<JSONObject> data
for (size_t i = x; i < data.size(); i++)
{
    process_data(data[i]);

    x++
    break;
}

Subsequently, a message can be sent to the web worker, alerting main.js that the thread is unblocked.

Cancelling Operations

Main.js receives confirmation that the web worker’s thread is free and can determine whether to instruct the web worker to repeat the C++ function, maintaining the loop counter in memory.

let continueOperation = true

worker.expensiveThreadBlockingFunction()

worker.onmessage = function(e) {
    if (continueOperation) {
        worker.expensiveThreadBlockingFunction()
    } {
        return false
    }
}

Resuming Operations

If all is proceeding smoothly and operation cancellation has not occurred, the loop should progress uninterrupted. Ensure distinct messaging indicating loop completion or continuation to prevent undue worker thread blockage.

Answer 4

Thread Sharing

When a worker and a C++ function share the same thread, the worker will be blocked until the C++ loop is complete, unable to handle any incoming messages. To reduce blocking time, it may be more efficient to initialize one iteration at a time from the main application.

The process would resemble:

main.js  ->  worker.js  ->  C++ function  ->  worker.js  ->  main.js

Breaking Down the Loop

In this scenario, a variable in C++ is set to 0, incrementing with each loop iteration and stored in memory. The C++ function executes one loop iteration, increments the variable for tracking, and then halts.

int x;
x = 0;

std::vector<JSONObject> data
for (size_t i = x; i < data.size(); i++)
{
    process_data(data[i]);

    x++
    break;
}

Subsequently, a message can be sent to the web worker, alerting main.js that the thread is unblocked.

Cancelling Operations

Main.js receives confirmation that the web worker’s thread is free and can determine whether to instruct the web worker to repeat the C++ function, maintaining the loop counter in memory.

let continueOperation = true

worker.expensiveThreadBlockingFunction()

worker.onmessage = function(e) {
    if (continueOperation) {
        worker.expensiveThreadBlockingFunction()
    } {
        return false
    }
}

Resuming Operations

If all is proceeding smoothly and operation cancellation has not occurred, the loop should progress uninterrupted. Ensure distinct messaging indicating loop completion or continuation to prevent undue worker thread blockage.

Different ways to terminate a WebAssembly process from inside a web worker

Answer №1

Answer №2

Thread Sharing

Breaking Down the Loop

Cancelling Operations

Resuming Operations

Similar questions

Is there a way to determine if a value exists within an array of objects?

Top techniques for creating a popup window with React

Guide to displaying or hiding elements based on the number of selected checkboxes

Can a callback in an ES6 class constructor ensure that the promise is either resolved or rejected?

Error in SO Embed Snippet Fiddle due to Bootstrap 4 JS Issue

Issue with jQuery AJAX call: When submitting an HTML form, control is not being returned to the calling

Error: npm encountered a socket timeout issue

Validation of Ajax using the JQuery Form Validation Plugin

Efficiently transform unprocessed data into a hexadecimal string using c++

Utilizing v-model for dynamic binding within a v-for iteration

RShiny encountering issues while trying to load external HTML file along with CSS file

haphazardly showcase circular shapes within a confined space

"You are unable to modify headers once they have been sent to the client, and an unhandled promise has been

What steps can be taken to provide accurate information in the absence of ImageData?

Unable to modify the selector to "Remove preview files" on click in PHP and JavaScript

Incorporating a navigation bar into my Jade template

Arranging a collection of nested vectors

Insert analytics code post-button click permission granted in Next.js/React

Using GLFW within a class can result in an argument of type `<C++ class method>` being incompatible with a parameter of type `GLFWwindowsizefun`

A guide on incorporating `executeScript` in Rselenium for emulating the activation of hotkeys