Press "Enter" to skip to content

Deep Learning in the Browser


$22.99 U.S.
ISBN 978-1-939902-54-2.
200 pages
Published August 2018

Deep Learning in the Browser

By: Xavier Bourry, Kai Sasaki, Christoph Körner, Reiichiro Nakano

Xavier Bourry<br />Cofounder and CTO,<br />StartupJeeliz<br />specializing in deep learning
Xavier Bourry
Cofounder and CTO,
specializing in deep learning
Kai Sasaki<br /> Apache Hivemall Committer<br />Software Engineer
Kai Sasaki
Apache Hivemall Committer
Software Engineer
Christoph Körner<br />Big Data Tech Lead, <br />T-Mobile Austria
Christoph Körner
Big Data Tech Lead,
T-Mobile Austria
Reiichiro Nakano<br />Software Engineer,<br />Infostellar
Reiichiro Nakano
Software Engineer,

This book is at the crossroads of web development and deep learning. Both technologies are beginning to meet, and this honeymoon will produce new fantastic applications that you cannot even imagine yet.

In this book you will see how to concretely use the main JavaScript deep learning frameworks and web programming in the browser with the capture of inputs and the WebGL implementation. Deep learning in the browser is currently at an embryonic stage, but this is the best time to bet on it before it becomes a giant, and this book will get you in on the action.

Are you ready to embark on the adventure?

Table of Contents

CHAPTER 1: Preface
CHAPTER 2: Introduction to Deep Learning 11
The Math behind Deep Neural Networks 11
The Perceptron – Gated Linear Regression 12
The Multi-Layer Perceptron 15
Convolution and Pooling 16
Activation Functions 18
Training Deep Neural Networks 23
The Importance of the Loss Function 23
Regularization 24
The Back-Propagation Algorithm 25
Optimization Methods 25
CHAPTER 3: Neural Network Architectures 27
Convolutional Neural Network (CNN) 27
AlexNet 28
GoogLeNet 29
ResNet 31
SqueezeNet 33
Recurrent Neural Network (RNN) 35
GRU 38
Deep Reinforcement Learning 39
DQN 41
Summary 42
CHAPTER 4: Deep Learning Frameworks for JavaScript 45
TensorFlow.js 45
The TensorFlow.js playground 46
The XOR Problem 46
Solving XOR 47
The network architecture 51
Tensors 52
Operations 54
Training 56
The TensorFlow.js Ecosystem 59
WebDNN 63
Keras.js 65
Summary 66
CHAPTER 5: JavaScript Fundamentals for Deep Learning 67
TypedArrays in JavaScript 68
ArrayBuffer 69
DataView 70
Concurrency in JavaScript 72
The JavaScript event loop 72
Creating an asynchronous function with Promise 74
Using the new async/await syntax 75
Multi-threading using WebWorkers 77
A processing loop for deep learning applications 78
Loading resource on CPU/GPU 79
Fetch API 80
Label Encoding 82
One-hot Encoding 82
Summary 83
CHAPTER 6: GPU acceleration with WebGL 85
Introduction to WebGL 86
The WebGL workflow 88
Fragment shader rendering 90
General purpose computing with WebGL 96
Debugging WebGL 97
Render to texture 98
Precision matters 102
Optimizations 104
Beware of floating-point specials 105
From CPU to GPU and vice versa 109
Texture and Shaders for Matrix Computation 110
Standard matrix addition 111
Standard matrix multiplication 111
Activation function application 112
Mastering WGLMatrix 113
Application to handwritten digit recognition 114
Data encoding 114
Memory optimization 114
Feedforward 116
The first attempt 116
Improving the performance 117
Summary 118
CHAPTER 7: Extracting data from the browser 121
Loading Image Data 122
Extracting Pixels from an Image 122
Loading remote Resources 124
Fetching Binary Blobs 125
Rendering Pixel Data to the Screen 127
Displaying Images 127
Rendering Pixel Data to Canvas 128
Table of Contents
Interpolating Image Data 130
Drawing Shapes to Canvas 132
Accessing Camera, Microphone and Speakers 133
Capturing Images from the Webcam 134
Recording Audio from the Microphone 135
Loading, Decoding and Playing Sounds 137
Utility Tools in Deep Learning Frameworks 138
TensorFlow.js 138
Keras.JS 140
WebDNN 140
Summary 141
CHAPTER 8: Recipes for Advanced Data Manipulation 143
Deserializing Protobuf 144
Parsing Caffe Model parameters 145
Parsing Tensorflow Graphs 146
A note on floating point precision 147
Drawing Charts with Chart.js 148
Exploring different Chart Types 150
Configuring Datasets 152
Updating Values 153
Overview of options and configurations 155
Drawing Sketches using Canvas 158
Drawing on Canvas 158
Extracting Pen Strokes 161
Compute a Spectogram from the microphone 163
Detecting and Tracking Faces 165
Tracking faces with Jeeliz FaceFilter 165
Tracking Faces with Tracking.js 166
Native Support for Face Detection in Chrome 168
Summary 169
CHAPTER 9: Building Applications with TensorFlow.js 171
Gesture classification using TensorFlow.js 171
Table of Contents
The Algorithm 172
Setting up your TensorFlow.js project 174
Instantiating the KNN Image Classifier 175
The TensorFlow.js processing loop 176
Wrap-up 179
Text Generation using TensorFlow.js 179
The algorithm 179
The Keras model 180
Converting a Keras Model into a TensorFlow.js Model 180
Setting up our project 181
Importing a Keras Model in TensorFlow.js 181
The TensorFlow.js processing loop 182
Constructing the model input 184
Performing a prediction 186
Sampling our model output 187
Wrap-up 188
Denoising images using TensorFlow.js 189
The algorithm 189
Converting a Keras Model into a TensorFlow.js Model 191
Setting up our project 192
Initialization 192
The application flow 193
Loading a test digit 194
Updating the noise 196
Generating the distorted image 197
Denoising the image 198
The initialization function 199
Wrap-up 199
Summary 200