TensorFlow.js是通过WebGL加速、基于浏览器的机器学习js框架。通过tensorflow.js,我们可以在浏览器中开发机器学习、运行现有的模型或者重新训练现有的模型。

一、安装

     有两种方法可以在你的项目中引入tensorflow.js。一种是通过script标签引入,另外一种就是通过npm进行安装。

(1)通过script标签,如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>tensorflow</title>
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@0.9.0"></script>
</head>
<body>
    <script>
        console.log(tf);
    </script>
</body>
</html>

  即直接引入tensorflow.js文件,然后我们在浏览器中打开console控制台,就可以看到tf是一个tensorflow.js暴露出来的对象,其包含了很多属性和方法。

 

(2)npm安装,即通过npm install @tensorflow/tfjs,然后在入口文件中使用 import * as tf from '@tensorflow/tfjs' 即可。

  

  注意:tensorflow是用ES7的写法,所以,如果要在浏览器环境下运行,就必须使用babel转换为浏览器可以执行的代码。

 

 

二、核心概念

(1)Tensors(张量)

  Tensorflow.js中数据的主要表现形式就是tensor(张量):由 一组数值  形成 一维或多维数组。一个Tensor实例有一个shape属性来定义这一组数值如何组成张量(比如在数组的每个维度的数量各自有多少)。而最主要的Tensor实例的构造函数就是 tf.tensor 函数,如下所示:

const shape = [2, 3]; // 2行,3列
const a = tf.tensor([1.0, 2.0, 3.0, 10.0, 20.0, 30.0], shape);
a.print();
console.log(Object.prototype.toString.call(a));

const b = tf.tensor([[1.0, 2.0, 3.0], [10.0, 20.0, 30.0]]);
b.print();
  1. 我们制定了shape为2行3列,那么调用tf.tensor构造函数来构造张量时,就需要在第一个参数中传入 2 * 3 = 6个数字的数组,接着通过a.print()在控制台打印出来,是一个二维数组。
  2. 为了确定张量a的类型,我们可以使用JavaScript的Object.prototype.toString.call()方法来查看。 实际上张量虽然表现为一维或多维数组,但他本质上是一个对象。
  3. 张量的形状也可以直接被传入数组来直接构造,即张量b就是通过传入一个二维数组构造得到的张量。

       TensorFlow.js之安装与核心概念_操作符

 

  

    然后,对于构建低维度的张量,我们推荐使用下面的函数来增强代码的可读性:tf.scalar(零维), tf.tensor1d(一维), tf.tensor2d(二维), tf.tensor3d(三维)、tf.tensor4d(四维)以及 tf.ones(值全是1)或者tf.zeros(值全是0) ,如下所示:

    const a = tf.scalar(3.14);
    a.print(); // 输出零维张量

    const b = tf.tensor2d([[2, 3, 4], [5, 6, 7]]);
    b.print(); // 输出二维张量

    const c = tf.zeros([2, 3]);
    c.print(); // 输出2行3列的值全是0的张量

    const d = tf.ones([3, 5]);
    d.print(); // 输出3行5列的值全是1的张量

  如下所示:

TensorFlow.js之安装与核心概念_操作符_02

  在TensorFlow.js中,张量tensors是不可变(immutable)的;一旦被创建,你就无法改变他们的值,除了使用操作符产生新的tensors张量。

  

 

(2)Variables(变量)

  Variables变量是通过张量进行初始化得到的。不像Tensor的值不可变,变量的值是可变的。你可以使用变量的assign方法分配一个新的tensor到这个变量上,这是变量就会改变

    const initialValues = tf.zeros([5]);
    const biases = tf.variable(initialValues);
    biases.print();
    console.log(Object.prototype.toString.call(biases));

    const updatedValues = tf.tensor1d([0, 1, 0, 1, 0]);
    biases.assign(updatedValues);
    biases.print();

  如上所示,首先使用tf.zeros得到一个张量,然后利用这个张量初始化得到一个变量,接着我们就可以打印这个变量,并且通Object.prototype.toString.call(biases)方法可以判断变量也是一个对象,接着,我们再生成一个张量,然后变量调用assign方法传入这个张量,就可以得到一个新的变量了,如下

  TensorFlow.js之安装与核心概念_机器学习_03

  于是我们可以得出这样一个结论:变量由张量生成,且张量不可变而变量可变。

 

 

(3)Operations操作

  张量可以用来存储数据,而operation可以用来操作数据。 TensorFlow.js为线性代数计算和机器学习提供了一系列有用的操作符,可以用来处理张量。因为张量是不可变的,所以这些操作符不会改变这些张量的值,而是会返回一个新的张量。 就像JavaScript中的字符串一样,无论你怎么操作,这些字符串本身不会改变,而只会返回一个新的值。

  比如下面这个一元操作符 square 操作符用来求平方:

    const a = tf.tensor2d([[1.0, 2.0], [3.0, 4.0]]);
    const a_squared = a.square();
    a_squared.print();
    a.print();

  如上所示,我们通过tf.tensor2d创建了一个2行2列的张量a,然后使用square操作得到了a_square,下面是控制台中的结果:

       TensorFlow.js之安装与核心概念_机器学习_04

 

  下面是一个add、sub、mul的二元操作符示例:

    const a = tf.tensor2d([[5.0, 6.0], [7.0, 8.0]]);
    const b = tf.tensor2d([[1.0, 2.0], [3.0, 4.0]]);

    const a_plus_b = a.add(b);
    a_plus_b.print();

    const a_sub_b = a.sub(b);
    a_sub_b.print();

    const a_mul_b = a.mul(b);
    a_mul_b.print();

   如下所示,我们就可以得到add、sub、mul的结果:

      TensorFlow.js之安装与核心概念_scala_05

       

            另外,在TensorFlow.js中也是支持链式操作的,如下所示:

    const a = tf.tensor2d([[2.0, 2.0], [2.0, 2.0]]);
    const b = tf.tensor2d([[3.0, 3.0], [3.0, 3.0]]);
    const c = tf.tensor2d([[5.0, 5.0], [5.0, 5.0]]);
    const res = a.add(b).square().sub(c);
    res.print();

    即首先得到a.add(b)的结果然后再sub(减)c,这样的链式操作得到res,结果如下:

          TensorFlow.js之安装与核心概念_2d_06

 

   

(4)模型(Models)和层(Layers)

  从概念上来说,一个模型一个给定一些输入将会产生特定的输出的函数。从前面黑体字可以看出,一个模型就是一个函数,只是它完成了特定的任务。

  在TensorFlow.js中有两种方式来创建模型,一种是通过操作(ops)来直接完成模型本身所做的工作,另外一种就是通过高级API tf.model来创建一个模型,显然第二种是更容易的。

  我们先看第一种创建模型的方法:

   function predict (input) {
        // y = a*x^2 + b*x + c
        return tf.tidy(() => {
            const x = tf.scalar(input);

            const ax2 = a.mul(x.square());
            const bx = b.mul(x);
            const y = ax2.add(bx).add(c);
            
            return y;
        });
    }

    // 定义常量
    const a = tf.scalar(2);
    const b = tf.scalar(4);
    const c = tf.scalar(8);

    // 对于2预测输出
    const result = predict(2);
    result.print(); // Tensor 24

  如上所示,我们定义的predict函数就是一个模型,对于给定的输入,我们就可以得到预测的输出。注意:所有的数字都需要经过tf.scalar()张量处理。

  

  而第二种创建模型的方法就是用 TensorFlow.js 中的 tf.model 方法(这里的model并不是真正可以调用的方法,而是一个总称,比如实际上可以调用的是tf.sequential模型),这在深度学习中是非常流行的概念。 下面的代码就创建了 tf.sequential 模型:

    const model = tf.sequential();
    model.add(
        tf.layers.simpleRNN({
            units: 20,
            recurrentInitializer: 'GlorotNormal',
            inputShape: [80, 4]
        })
    );

    const optimizer = tf.train.sgd(LEARNING_RATE);
    model.compile({optimizer, loss: 'categoricalCrossentropy'});
    model.fit({x: data, y: labels});

  注意:这段代码有错,日后解决。 这里大概就是在表达tf创建模型有给定的模型供我们使用,而第一种方法是我们完全自己去写的模型。

 

 

(5)内存管理: dispose和tf.tidy

  因为TensorFlow.js使用了GPU来加速数学运算,因此当tensorflow处理张量和变量时就有必要来管理GPU内存。而主要的两个管理内存的方法就是: dispose 和 tf.tidy。

   dispose

       我们可以使用对 张量 或者 变量 在运算之后使用dispose来清理以及释放它的GPU内存。如下所示:

    const x = tf.tensor2d([[0.0, 2.0], [4.0, 6.0]]);
    const x_squared = x.square();

    x.dispose();
    x_squared.dispose();

 

  tf.tidy

   当我们做了大量了Tensor操作时,再使用 dispose 处理起来会非常不方便。所以TensorFlow.js提供了另外一个函数:tf.tidy,这个函数和JavaScript中作用域都扮演了同样的角色,只不过这个函数是为tensors服务的。

    tf.tidy 执行了一个函数并且清理了中间创建的tensor,以此加速了GPU内存,但是它不会清理其内部函数最终的返回值,所以只是起到了GPU加速目的,而不会影响tensor计算,如下:

   const average = tf.tidy(() => {
        // tf.tidy会清除所有的tensor产生的内存使得GPU加速
        // 尽管下面是一个简单操作,但是还是会产生很多中间张量,
        // 所以将这些数学运算放在tidy函数中是最佳实践
        const y = tf.tensor1d([1.0, 2.0, 3.0, 4.0]);
        const z = tf.ones([4]);

        return y.sub(z).square().mean();
    });

    average.print(); // Tensor 3.5

    这样,我们就可以使用最大效率的GPU加速了。其中,mean()函数是求取平均值的操作,如下所示:

    const average = tf.tensor1d([1, 2, 3, 4, 5]).mean();
    average.print(); // Tensor 3

  因此, tf.tidy可以帮助阻止程序内存泄露。下面是两个我们需要额外注意的点:

  1. 传入tf.tidy内的函数必须是同步的且不能Promise,我们建议对于更新UI的代码以及http请求的代码都放在tf.tidy之外。
  2. tf.tidy 不会清理变量 Variable。 因为变量往往会持续整个机器学习模型的生命周期,所以,即使它们在tf.tidy函数中创建TensorFlow.js也不会清理它们,然而,是可以通过dispose来手动清理的。

 

  

  

    到这里,tensorflow.js的安装和核心概念就结束了,后面会有更多关于tensorflow的文章。