From 883cd1181dc58690724c8385aab17cf5db846a56 Mon Sep 17 00:00:00 2001 From: Paul G Cooper Date: Thu, 16 May 2024 15:07:48 +0100 Subject: [PATCH 1/2] Adding an introduction with basic overview of the API --- ...-introduction-to-web-neural-network-api.md | 65 +++++++++++++++++++ 1 file changed, 65 insertions(+) create mode 100644 _posts/2024-05-16-introduction-to-web-neural-network-api.md diff --git a/_posts/2024-05-16-introduction-to-web-neural-network-api.md b/_posts/2024-05-16-introduction-to-web-neural-network-api.md new file mode 100644 index 0000000..becb08d --- /dev/null +++ b/_posts/2024-05-16-introduction-to-web-neural-network-api.md @@ -0,0 +1,65 @@ +--- +layout: post +title: 'Introduction to Web Neural Network API (WebNN)' +date: 2024-05-16 14:55:22 +0100 +author: Paul Cooper +avatar: https://avatars.githubusercontent.com/u/722868?s=200&v=4 +categories: get-started +--- + +## Introduction to Web Neural Network API (WebNN) + +The Web Neural Network API (WebNN) brings accelerated machine learning capabilities directly to web applications. With WebNN, developers can harness the power of neural networks within the browser environment, enabling a wide range of AI-driven use cases without relying on external servers or plugins. + +### What is WebNN? + +WebNN is a JavaScript API that provides a high-level interface for executing neural network inference tasks efficiently on various hardware accelerators, such as CPUs, GPUs, and dedicated AI chips (sometimes called NPUs or TPUs). By utilizing hardware acceleration, WebNN enables faster and more power-efficient execution of machine learning models, making it ideal for real-time applications and scenarios where latency is critical. + +### Programming Model + +WebNN follows a simple programming model, allowing developers to perform inference tasks with minimal complexity. The API is focused on defining the operations and infrastructure necessary to execute machine learning models, rather than handling higher-level functionalities such as model loading, parsing, or management. WebNN is designed to be agnostic to model formats and leaves the responsibility of loading and parsing models to other libraries (such as ONNX.js or Tensorflow.js) or the web application itself. + +At a high level WebNN essentially has 2 steps to run a model: + +* Model Construction: In WebNN the first step is to construct the model using the MLGraphBuilder API. Once the model has been constructed it can be built into an executable graph. + +* Model Execution: Once the executable graph has been constructed, data is input and the graph executes inference tasks to obtain predictions or classifications. WebNN provides methods for selecting backends (either explicitly or by characteristics) that then process the input data and return output results from the model. + +WebNN leverages hardware accelerators to accelerate the execution of models. Since WebNN is hardware and model agnostic it can use any of the available hardware resources (whether CPU, GPU, NPU, TPU, etc), maximizing performance and minimizing latency, enabling smooth and responsive user experiences. + +### Sample Code + +Let's take a look at example pseudo-code that demonstrates how to perform inference using WebNN. In this example, we will show the basic API for model construction and execution. More details of model construction are covered in other tutorials. + +```js +/* Create a context and MLGraphBuilder */ +const context = await navigator.ml.createContext(/* execution parameters */); +const builder = new MLGraphBuilder(context); + +/* Construct the model */ +// WebNN supports a core set of ML operators - a full list can be found at +// https://www.w3.org/TR/webnn/#api-mlgraphbuilder + + +/* Build executable graph */ +const graph = await builder.build({'output': output}); + +/* Arrange input and output buffers */ +const inputBuffer = new Float32Array(TENSOR_SIZE); +const outputBuffer = new Float32Array(TENSOR_SIZE); + +const inputs = {'input': inputBuffer}; + +const outputs = {'output': outputBuffer}; + +/* Execute the compiled graph with the specified inputs. */ +const results = await context.compute(graph, inputs, outputs); + +console.log('Output values: ' + results.outputs.output); +``` + +This is a basic pseudo-code example of how to use WebNN API to construct a model and execute it. In a real-world scenario, you would replace the placeholders (/* Construct the model */, /* Arrange input and output buffers */, etc.) with actual model construction, input data, and execution parameters specific to your application. + +### Conclusion + +WebNN opens up exciting possibilities for integrating machine learning capabilities into web applications, enabling developers to create innovative experiences powered by AI directly in the browser. With its simple programming model and support for hardware acceleration, WebNN empowers developers to build responsive and efficient AI-driven solutions that run seamlessly on a wide range of devices. \ No newline at end of file From bb095eff54089512965d3c3e4a2969e4665d569d Mon Sep 17 00:00:00 2001 From: Paul G Cooper Date: Fri, 17 May 2024 08:36:57 +0100 Subject: [PATCH 2/2] markup changes for jekyll --- _posts/2024-05-16-introduction-to-web-neural-network-api.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/_posts/2024-05-16-introduction-to-web-neural-network-api.md b/_posts/2024-05-16-introduction-to-web-neural-network-api.md index becb08d..7f311c0 100644 --- a/_posts/2024-05-16-introduction-to-web-neural-network-api.md +++ b/_posts/2024-05-16-introduction-to-web-neural-network-api.md @@ -7,14 +7,14 @@ avatar: https://avatars.githubusercontent.com/u/722868?s=200&v=4 categories: get-started --- -## Introduction to Web Neural Network API (WebNN) - The Web Neural Network API (WebNN) brings accelerated machine learning capabilities directly to web applications. With WebNN, developers can harness the power of neural networks within the browser environment, enabling a wide range of AI-driven use cases without relying on external servers or plugins. ### What is WebNN? WebNN is a JavaScript API that provides a high-level interface for executing neural network inference tasks efficiently on various hardware accelerators, such as CPUs, GPUs, and dedicated AI chips (sometimes called NPUs or TPUs). By utilizing hardware acceleration, WebNN enables faster and more power-efficient execution of machine learning models, making it ideal for real-time applications and scenarios where latency is critical. + + ### Programming Model WebNN follows a simple programming model, allowing developers to perform inference tasks with minimal complexity. The API is focused on defining the operations and infrastructure necessary to execute machine learning models, rather than handling higher-level functionalities such as model loading, parsing, or management. WebNN is designed to be agnostic to model formats and leaves the responsibility of loading and parsing models to other libraries (such as ONNX.js or Tensorflow.js) or the web application itself.