Обучение TensorFlow.js в Node.js Codelab

1. Введение

В этой лаборатории кода вы узнаете, как создать веб-сервер Node.js для обучения и классификации типов бейсбольных полей на стороне сервера с помощью TensorFlow.js , мощной и гибкой библиотеки машинного обучения для JavaScript. Вы создадите веб-приложение для обучения модели прогнозированию типа наклона на основе данных датчика угла наклона и вызову прогнозирования с помощью веб-клиента. Полностью рабочая версия этой Codelab присутствует в репозитории tfjs-examples на GitHub.

Что вы узнаете

  • Как установить и настроить пакет npm tensorflow.js для использования с Node.js.
  • Как получить доступ к данным обучения и тестирования в среде Node.js.
  • Как обучить модель с помощью TensorFlow.js на сервере Node.js.
  • Как развернуть обученную модель для вывода в клиент-серверном приложении.

Итак, давайте начнем!

2. Требования

Для завершения этой Codelab вам понадобится:

  1. Последняя версия Chrome или другой современный браузер.
  2. Текстовый редактор и командный терминал, работающий локально на вашем компьютере.
  3. Знание HTML, CSS, JavaScript и инструментов разработчика Chrome (или инструментов разработчика предпочитаемого вами браузера).
  4. Концептуальное понимание нейронных сетей высокого уровня. Если вам нужно введение или повышение квалификации, рассмотрите возможность просмотра этого видео от 3blue1brown или этого видео о глубоком обучении в Javascript от Аши Кришнана .

3. Настройте приложение Node.js.

Установите Node.js и npm. Информацию о поддерживаемых платформах и зависимостях можно найти в руководстве по установке tfjs-node .

Создайте каталог с именем ./baseball для нашего приложения Node.js. Скопируйте связанные package.json и webpack.config.js в этот каталог, чтобы настроить зависимости пакета npm (включая пакет @tensorflow/tfjs-node npm). Затем запустите npm install, чтобы установить зависимости.

$ cd baseball
$ ls
package.json  webpack.config.js
$ npm install
...
$ ls
node_modules  package.json  package-lock.json  webpack.config.js

Теперь вы готовы написать код и обучить модель!

4. Настройте данные обучения и тестирования.

Вы будете использовать данные обучения и тестирования в виде файлов CSV по ссылкам ниже. Загрузите и изучите данные в этих файлах:

Pitch_type_training_data.csv

Pitch_type_test_data.csv

Давайте посмотрим на некоторые примеры данных обучения:

vx0,vy0,vz0,ax,ay,az,start_speed,left_handed_pitcher,pitch_code
7.69914900671662,-132.225686405648,-6.58357157666866,-22.5082591074995,28.3119270826735,-16.5850095967027,91.1,0,0
6.68052308575228,-134.215511616881,-6.35565979491619,-19.6602769147989,26.7031848314466,-14.3430602022656,92.4,0,0
2.56546504690782,-135.398673977074,-2.91657310799559,-14.7849950586111,27.8083916890792,-21.5737737390901,93.1,0,0

Существует восемь входных функций, описывающих данные датчика шага:

  • скорость мяча (vx0, vy0, vz0)
  • ускорение мяча (ax, ay, az)
  • стартовая скорость шага
  • кувшин левша или нет

и одна выходная метка:

  • Pitch_code, обозначающий один из семи типов подачи: Fastball (2-seam), Fastball (4-seam), Fastball (sinker), Fastball (cutter), Slider, Changeup, Curveball

Цель состоит в том, чтобы построить модель, которая способна предсказать тип шага на основе данных датчика шага.

Перед созданием модели необходимо подготовить обучающие и тестовые данные. Создайте файл Pitch_type.js в каталоге Baseball/ и скопируйте в него следующий код. Этот код загружает данные обучения и тестирования с помощью API tf.data.csv . Он также нормализует данные (что всегда рекомендуется) с использованием шкалы нормализации мин-макс.

const tf = require('@tensorflow/tfjs');

// util function to normalize a value between a given range.
function normalize(value, min, max) {
  if (min === undefined || max === undefined) {
    return value;
  }
  return (value - min) / (max - min);
}

// data can be loaded from URLs or local file paths when running in Node.js.
const TRAIN_DATA_PATH =
'https://storage.googleapis.com/mlb-pitch-data/pitch_type_training_data.csv';
const TEST_DATA_PATH =    'https://storage.googleapis.com/mlb-pitch-data/pitch_type_test_data.csv';

// Constants from training data
const VX0_MIN = -18.885;
const VX0_MAX = 18.065;
const VY0_MIN = -152.463;
const VY0_MAX = -86.374;
const VZ0_MIN = -15.5146078412997;
const VZ0_MAX = 9.974;
const AX_MIN = -48.0287647107959;
const AX_MAX = 30.592;
const AY_MIN = 9.397;
const AY_MAX = 49.18;
const AZ_MIN = -49.339;
const AZ_MAX = 2.95522851438373;
const START_SPEED_MIN = 59;
const START_SPEED_MAX = 104.4;

const NUM_PITCH_CLASSES = 7;
const TRAINING_DATA_LENGTH = 7000;
const TEST_DATA_LENGTH = 700;

// Converts a row from the CSV into features and labels.
// Each feature field is normalized within training data constants
const csvTransform =
    ({xs, ys}) => {
      const values = [
        normalize(xs.vx0, VX0_MIN, VX0_MAX),
        normalize(xs.vy0, VY0_MIN, VY0_MAX),
        normalize(xs.vz0, VZ0_MIN, VZ0_MAX), normalize(xs.ax, AX_MIN, AX_MAX),
        normalize(xs.ay, AY_MIN, AY_MAX), normalize(xs.az, AZ_MIN, AZ_MAX),
        normalize(xs.start_speed, START_SPEED_MIN, START_SPEED_MAX),
        xs.left_handed_pitcher
      ];
      return {xs: values, ys: ys.pitch_code};
    }

const trainingData =
    tf.data.csv(TRAIN_DATA_PATH, {columnConfigs: {pitch_code: {isLabel: true}}})
        .map(csvTransform)
        .shuffle(TRAINING_DATA_LENGTH)
        .batch(100);

// Load all training data in one batch to use for evaluation
const trainingValidationData =
    tf.data.csv(TRAIN_DATA_PATH, {columnConfigs: {pitch_code: {isLabel: true}}})
        .map(csvTransform)
        .batch(TRAINING_DATA_LENGTH);

// Load all test data in one batch to use for evaluation
const testValidationData =
    tf.data.csv(TEST_DATA_PATH, {columnConfigs: {pitch_code: {isLabel: true}}})
        .map(csvTransform)
        .batch(TEST_DATA_LENGTH);

5. Создайте модель для классификации типов шага.

Теперь вы готовы построить модель. Используйте API tf.layers для подключения входов (форма значений датчика шага [8]) к 3 скрытым полностью связанным слоям, состоящим из блоков активации ReLU, за которыми следует один выходной слой softmax, состоящий из 7 блоков, каждый из которых представляет один из выходных модулей. типы шага.

Обучите модель с помощью оптимизатора Адама и функции потерь sparseCategoricalCrossentropy. Дополнительные сведения об этих вариантах см. в руководстве по моделям обучения .

Добавьте следующий код в конец Pitch_type.js:

const model = tf.sequential();
model.add(tf.layers.dense({units: 250, activation: 'relu', inputShape: [8]}));
model.add(tf.layers.dense({units: 175, activation: 'relu'}));
model.add(tf.layers.dense({units: 150, activation: 'relu'}));
model.add(tf.layers.dense({units: NUM_PITCH_CLASSES, activation: 'softmax'}));

model.compile({
  optimizer: tf.train.adam(),
  loss: 'sparseCategoricalCrossentropy',
  metrics: ['accuracy']
});

Запустите обучение из основного кода сервера, который вы напишете позже.

Чтобы завершить работу над модулем Pitch_type.js, давайте напишем функцию для оценки набора проверочных и тестовых данных, прогнозирования типа шага для одной выборки и вычисления показателей точности. Добавьте этот код в конец Pitch_type.js:

// Returns pitch class evaluation percentages for training data
// with an option to include test data
async function evaluate(useTestData) {
  let results = {};
  await trainingValidationData.forEachAsync(pitchTypeBatch => {
    const values = model.predict(pitchTypeBatch.xs).dataSync();
    const classSize = TRAINING_DATA_LENGTH / NUM_PITCH_CLASSES;
    for (let i = 0; i < NUM_PITCH_CLASSES; i++) {
      results[pitchFromClassNum(i)] = {
        training: calcPitchClassEval(i, classSize, values)
      };
    }
  });

  if (useTestData) {
    await testValidationData.forEachAsync(pitchTypeBatch => {
      const values = model.predict(pitchTypeBatch.xs).dataSync();
      const classSize = TEST_DATA_LENGTH / NUM_PITCH_CLASSES;
      for (let i = 0; i < NUM_PITCH_CLASSES; i++) {
        results[pitchFromClassNum(i)].validation =
            calcPitchClassEval(i, classSize, values);
      }
    });
  }
  return results;
}

async function predictSample(sample) {
  let result = model.predict(tf.tensor(sample, [1,sample.length])).arraySync();
  var maxValue = 0;
  var predictedPitch = 7;
  for (var i = 0; i < NUM_PITCH_CLASSES; i++) {
    if (result[0][i] > maxValue) {
      predictedPitch = i;
      maxValue = result[0][i];
    }
  }
  return pitchFromClassNum(predictedPitch);
}

// Determines accuracy evaluation for a given pitch class by index
function calcPitchClassEval(pitchIndex, classSize, values) {
  // Output has 7 different class values for each pitch, offset based on
  // which pitch class (ordered by i)
  let index = (pitchIndex * classSize * NUM_PITCH_CLASSES) + pitchIndex;
  let total = 0;
  for (let i = 0; i < classSize; i++) {
    total += values[index];
    index += NUM_PITCH_CLASSES;
  }
  return total / classSize;
}

// Returns the string value for Baseball pitch labels
function pitchFromClassNum(classNum) {
  switch (classNum) {
    case 0:
      return 'Fastball (2-seam)';
    case 1:
      return 'Fastball (4-seam)';
    case 2:
      return 'Fastball (sinker)';
    case 3:
      return 'Fastball (cutter)';
    case 4:
      return 'Slider';
    case 5:
      return 'Changeup';
    case 6:
      return 'Curveball';
    default:
      return 'Unknown';
  }
}

module.exports = {
  evaluate,
  model,
  pitchFromClassNum,
  predictSample,
  testValidationData,
  trainingData,
  TEST_DATA_LENGTH
}

6. Обучить модель на сервере

Напишите код сервера для обучения и оценки модели в новом файле с именем server.js. Сначала создайте HTTP-сервер и откройте двунаправленное соединение сокетов с помощью API-интерфейса Socket.io. Затем выполните обучение модели с помощью API model.fitDataset и оцените точность модели с помощью метода pitch_type.evaluate() который вы написали ранее. Обучите и оцените 10 итераций, выводя метрики на консоль.

Скопируйте приведенный ниже код в server.js:

require('@tensorflow/tfjs-node');

const http = require('http');
const socketio = require('socket.io');
const pitch_type = require('./pitch_type');

const TIMEOUT_BETWEEN_EPOCHS_MS = 500;
const PORT = 8001;

// util function to sleep for a given ms
function sleep(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

// Main function to start server, perform model training, and emit stats via the socket connection
async function run() {
  const port = process.env.PORT || PORT;
  const server = http.createServer();
  const io = socketio(server);

  server.listen(port, () => {
    console.log(`  > Running socket on port: ${port}`);
  });

  io.on('connection', (socket) => {
    socket.on('predictSample', async (sample) => {
      io.emit('predictResult', await pitch_type.predictSample(sample));
    });
  });

  let numTrainingIterations = 10;
  for (var i = 0; i < numTrainingIterations; i++) {
    console.log(`Training iteration : ${i+1} / ${numTrainingIterations}`);
    await pitch_type.model.fitDataset(pitch_type.trainingData, {epochs: 1});
    console.log('accuracyPerClass', await pitch_type.evaluate(true));
    await sleep(TIMEOUT_BETWEEN_EPOCHS_MS);
  }

  io.emit('trainingComplete', true);
}

run();

На этом этапе вы готовы запустить и протестировать сервер! Вы должны увидеть что-то вроде этого: сервер обучает одну эпоху в каждой итерации (вы также можете использовать API model.fitDataset для обучения нескольких эпох одним вызовом). Если на этом этапе вы обнаружите какие-либо ошибки, проверьте установку узла и npm.

$ npm run start-server
...
  > Running socket on port: 8001
Epoch 1 / 1
eta=0.0 ========================================================================================================>
2432ms 34741us/step - acc=0.429 loss=1.49

Введите Ctrl-C, чтобы остановить работающий сервер. Мы запустим его снова на следующем этапе.

7. Создайте страницу клиента и отобразите код.

Теперь, когда сервер готов, следующим шагом будет написание клиентского кода, который запускается в браузере. Создайте простую страницу для вызова прогнозирования модели на сервере и отображения результата. При этом используется сокет.io для связи клиент/сервер.

Сначала создайте index.html в папке baseball/:

<!doctype html>
<html>
  <head>
    <title>Pitch Training Accuracy</title>
  </head>
  <body>
    <h3 id="waiting-msg">Waiting for server...</h3>
    <p>
    <span style="font-size:16px" id="trainingStatus"></span>
    <p>
    <div id="predictContainer" style="font-size:16px;display:none">
      Sensor data: <span id="predictSample"></span>
      <button style="font-size:18px;padding:5px;margin-right:10px" id="predict-button">Predict Pitch</button><p>
      Predicted Pitch Type: <span style="font-weight:bold" id="predictResult"></span>
    </div>
    <script src="dist/bundle.js"></script>
    <style>
      html,
      body {
        font-family: Roboto, sans-serif;
        color: #5f6368;
      }
      body {
        background-color: rgb(248, 249, 250);
      }
    </style>
  </body>
</html>

Затем создайте новый файл client.js в папке baseball/ с приведенным ниже кодом:

import io from 'socket.io-client';
const predictContainer = document.getElementById('predictContainer');
const predictButton = document.getElementById('predict-button');

const socket =
    io('http://localhost:8001',
       {reconnectionDelay: 300, reconnectionDelayMax: 300});

const testSample = [2.668,-114.333,-1.908,4.786,25.707,-45.21,78,0]; // Curveball

predictButton.onclick = () => {
  predictButton.disabled = true;
  socket.emit('predictSample', testSample);
};

// functions to handle socket events
socket.on('connect', () => {
    document.getElementById('waiting-msg').style.display = 'none';
    document.getElementById('trainingStatus').innerHTML = 'Training in Progress';
});

socket.on('trainingComplete', () => {
  document.getElementById('trainingStatus').innerHTML = 'Training Complete';
  document.getElementById('predictSample').innerHTML = '[' + testSample.join(', ') + ']';
  predictContainer.style.display = 'block';
});

socket.on('predictResult', (result) => {
  plotPredictResult(result);
});

socket.on('disconnect', () => {
  document.getElementById('trainingStatus').innerHTML = '';
  predictContainer.style.display = 'none';
  document.getElementById('waiting-msg').style.display = 'block';
});

function plotPredictResult(result) {
  predictButton.disabled = false;
  document.getElementById('predictResult').innerHTML = result;
  console.log(result);
}

Клиент обрабатывает сообщение сокета trainingComplete для отображения кнопки прогнозирования. При нажатии этой кнопки клиент отправляет сообщение сокета с образцом данных датчика. Получив сообщение predictResult , он отображает прогноз на странице.

8. Запустите приложение

Запустите сервер и клиент, чтобы увидеть полное приложение в действии:

[In one terminal, run this first]
$ npm run start-client

[In another terminal, run this next]
$ npm run start-server

Откройте страницу клиента в браузере ( http://localhost:8080 ). Когда обучение модели завершится, нажмите кнопку «Прогнозировать выборку» . Вы должны увидеть результат прогноза, отображаемый в браузере. Не стесняйтесь изменять образцы данных датчика, используя примеры из тестового CSV-файла, и посмотрите, насколько точно прогнозирует модель.

9. Что вы узнали

В этой лаборатории кода вы реализовали простое веб-приложение машинного обучения с использованием TensorFlow.js. Вы обучили специальную модель для классификации типов бейсбольных полей на основе данных датчиков. Вы написали код Node.js для выполнения обучения на сервере и вызываете вывод на обученной модели, используя данные, отправленные от клиента.

Обязательно посетите tensorflow.org/js, чтобы увидеть больше примеров и демонстраций с кодом, чтобы узнать, как вы можете использовать TensorFlow.js в своих приложениях.