tensorflow.js

Why the Browser and Machine Learning are a perfect match

MCubed, London, October 2018

Oliver Zeigermann / @DJCordhose

http://bit.ly/mcubed-tensorflow-js

https://js.tensorflow.org/

Wait, but why?

Python is predominant in the area of Machine Learning

  • Has a large and mature set of libs
  • Is reasonably fast
  • Uses bindings to C/C++ or Fortran for speed and reuse

(I) Educate

Everyone can be educated, they just need a browser and internet

Concepts are much easier to grok when you can play around with them

Experiment to explore how machine learning works

Built using deeplearn.js (predecessor of tensorflow.js)

https://teachablemachine.withgoogle.com/

Tensorflow Playground

Where it all started - Playing with Neural Networks without any installation

http://playground.tensorflow.org

Generating Celebreties - From Keras to tensorflow.js

Trained for two weeks on a single high-end GPU on CelebA-HQ data set (images of celebreties)

https://alantian.net/ganshowcase/
https://github.com/alantian/ganshowcase
https://twitter.com/alanyttian/status/988242167998148608

(II) Develop

Most obvious reason: JavaScript is the language you are most comfortable with

You just happen to develop for the browser

You are intrigued by how JavaScript development works

Combination with interactive visualizations and other browser features (like audio and video)

Core Concepts

It's all about asynchronous matrix operations


    const a = tf.tensor1d([1, 2, 3]);
    const b = tf.scalar(2);
    
    // a is not modified, result is a new tensor
    const result = a.add(b);
                    

    const data = await result.data(); 
    console.log(data); // Float32Array([3, 4, 5]

Minimal Example
https://github.com/tensorflow/tfjs
https://js.tensorflow.org/tutorials/core-concepts.html

High Level Layer API

If you have ever seen Keras, you will feel right at home


    const model = tf.sequential();
              

    model.add(tf.layers.dense({units: 10}));
              

    model.add(tf.layers.conv2d({
      inputShape: [28, 28, 1],
      kernelSize: 5,
      filters: 8,
      activation: 'relu'
    }));

(III) Deploy

JavaScript might be the only language around

because all you have is a browser

  • you on your mobile phone
  • AI in browser based game
  • use any GPU

Scenario: Train using beefey machine using raw TensorFlow, deploy to browser

Using the fully trained modell in JavaScript


    const model = await tf.loadModel('model.json');
            

    // max speed, age, thousand kilometers per year
    const example = tf.tensor([[150, 45, 10]]);
    const prediction = model.predict(example);
                    

    const value = await prediction.data();
    // softmax 
    // # 0: red
    // # 1: green
    // # 2: yellow        
    console.log(value);
    // [0.0937359631061554, 
    //  0.7274655699729919, 
    //  0.17879831790924072]

https://djcordhose.github.io/ai/js/tensorflow-sandbox/load_model.html

(IV) Apps powered by AI

AI-powered browser apps using ready made models

Wrapping Up

tensorflow.js browser apps

  • can make use of any GPU (not only CUDA)
  • have highest reach due to zero installation
  • can be easily integrated into existing Web Apps
  • allow for best visualization
  • are ideal for interactive learning

Why the Browser and Machine Learning are a perfect match, MCubed 2018
Oliver Zeigermann / @DJCordhose

http://bit.ly/mcubed-tensorflow-js