Используйте TPU Coral Edge для запуска моделей TFlite в Node с помощью TensorFlow.js

1. Введение

Последнее обновление: 11.04.2022

В этом практическом занятии вы научитесь обучать модель классификации изображений с помощью Teachable Machine и запускать её с аппаратным ускорением Coral, используя TensorFlow.js — мощную и гибкую библиотеку машинного обучения для JavaScript. Вы создадите приложение Electron, которое отображает изображения с веб-камеры и классифицирует их с помощью Coral Edge TPU. Полностью рабочая версия этого практического занятия доступна в репозитории sig-tfjs на GitHub .

Нужно ли мне устройство для работы с кораллами?

Нет. Вы можете попробовать выполнить это практическое задание без устройства Coral и получить хорошую производительность на настольном компьютере, используя вместо него ускоритель WebNN.

Что вы построите

В этом практическом задании вы создадите приложение Electron для классификации изображений. Ваше приложение:

• Классифицирует изображения с веб-камеры по категориям, определенным в обученной вами модели.
• Использует ускоритель Coral для повышения производительности, если таковой имеется.
• Использует WebNN для повышения производительности, если эта технология поддерживается на вашей платформе.

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

• Как установить и настроить NPM-пакет tfjs-tflite-node для запуска моделей TFLite в Node.js.
• Как установить библиотеку среды выполнения Edge TPU для запуска моделей на устройстве Coral.
• Как ускорить вывод модели с помощью TPU на периферии Coral.
• Как ускорить вывод модели с помощью WebNN .

Данный практический урок посвящен использованию TFLite в Node.js. Несущественные концепции и фрагменты кода опущены и предоставлены для простого копирования и вставки.

Что вам понадобится

Для выполнения этого задания вам потребуется:

• Компьютер с веб-камерой.
• Для Coral мы рекомендуем Raspberry Pi с операционной системой Raspberry Pi OS (64-бит) и настольным компьютером .
• Для WebNN мы рекомендуем использовать компьютер на базе Intel x86-64 под управлением Ubuntu 20.04 или Windows 10.
• Версия Node.js >= 12.
• Знание JavaScript.
• (Рекомендуется) USB-ускоритель Coral для ускорения работы модели.

2. Настройка

Получите код

Весь необходимый для этого проекта код собран в репозитории Git. Для начала скачайте код и откройте его в вашей любимой среде разработки. Для этого практического занятия мы рекомендуем использовать Raspberry Pi под управлением Raspberry Pi OS (64-бит) с настольной операционной системой . Это упростит подключение ускорителя Coral.

Настоятельно рекомендуется: используйте Git для клонирования репозитория на Raspberry Pi.

Чтобы получить код, откройте новое окно терминала и клонируйте репозиторий:

git clone https://github.com/tensorflow/sig-tfjs.git

Все файлы, которые вам нужно отредактировать для выполнения этого практического задания, находятся в каталоге tfjs-tflite-node-codelab (внутри sig-tfjs ). В этом каталоге вы найдете подкаталоги с именами starter_code , cpu_inference_working , coral_inference_working и webnn_inference_working . Это контрольные точки для выполнения шагов этого практического задания.

В репозитории также находятся файлы NPM, от которых зависит tfjs-tflite-node-codelab . Вам не потребуется редактировать эти файлы, но нужно будет запустить некоторые из их тестов, чтобы убедиться в правильной настройке вашей среды.

Установите библиотеку среды выполнения Edge TPU.

Для работы устройств Coral необходимо предварительно установить библиотеку среды выполнения Edge TPU. Установите ее, следуя инструкциям для вашей платформы.

На Linux / Raspberry Pi

В Linux библиотека доступна в репозитории Google PPA в виде пакета Debian , libedgetpu1-std , для архитектур x86-64 и Armv8 (64-бит). Если ваш процессор использует другую архитектуру, вам потребуется скомпилировать её из исходного кода .

Выполните эту команду, чтобы добавить репозиторий Coral PPA от Google и установить библиотеку Edge TPU Runtime.

# None of this is needed on Coral boards
# This repo is needed for almost all packages below
echo "deb https://packages.cloud.google.com/apt coral-edgetpu-stable main" | sudo tee /etc/apt/sources.list.d/coral-edgetpu.list
# This repo is needed for only python3-coral-cloudiot and python3-coral-enviro
echo "deb https://packages.cloud.google.com/apt coral-cloud-stable main" | sudo tee /etc/apt/sources.list.d/coral-cloud.list

curl https://packages.cloud.google.com/apt/doc/apt-key.gpg | sudo apt-key add -

sudo apt-get update
sudo apt-get install libedgetpu1-std

В Windows / других ОС

Для 32-разрядных версий macOS и Windows доступны предварительно скомпилированные бинарные файлы, которые можно установить, запустив скрипт install.sh или install.bat из загруженного архива.

Перезагрузите устройство.

После установки Edge TPU Runtime перезагрузите устройство, чтобы активировать новое правило Coral Udev, добавленное установщиком.

Убедитесь, что ваше устройство Coral обнаружено.

Чтобы убедиться, что ваше устройство Coral обнаружено и работает, запустите интеграционные тесты для пакета coral-tflite-delegate . Этот пакет находится в корневом каталоге репозитория. Для запуска интеграционных тестов подключите ваш ускоритель Coral и выполните следующие команды в каталоге пакета:

npx yarn
npx yarn build-deps
npx yarn test-integration

Примечание: Если npx недоступен, убедитесь, что у вас установлен Node.js. Вы можете установить Node, следуя инструкциям на nodejs.org . Убедитесь, что вы установили версию не ниже 12. Запуск apt install nodejs может установить Node 10, который не следует использовать для этого практического занятия.

В результате вы должны увидеть примерно следующее:

yarn run v1.22.17
$ yarn build && yarn test-integration-dev
$ tsc
$ jasmine --config=jasmine-integration.json
Platform node has already been set. Overwriting the platform with node.
Randomized with seed 78904
Started

============================
Hi there 👋. Looks like you are running TensorFlow.js in Node.js. To speed things up dramatically, install our node backend, which binds to TensorFlow C++, by running npm i @tensorflow/tfjs-node, or npm i @tensorflow/tfjs-node-gpu if you have CUDA. Then call require('@tensorflow/tfjs-node'); (-gpu suffix for CUDA) at the start of your program. Visit https://github.com/tensorflow/tfjs-node for more details.
============================
WARNING: converting 'int32' to 'uint8'
.


1 spec, 0 failures
Finished in 2.777 seconds
Randomized with seed 78904 (jasmine --random=true --seed=78904)
Done in 6.36s.

Не беспокойтесь об установке @tensorflow/tfjs-node, как указано в логах, поскольку вы будете запускать модель в TFLite.

Если же в выводе содержится сообщение Encountered unresolved custom op: edgetpu-custom-op , значит, ваше устройство Coral не обнаружено. Убедитесь, что вы установили библиотеку среды выполнения edge TPU и подключили устройство Coral к компьютеру. Вы также можете воспользоваться руководством по началу работы с Coral , чтобы протестировать версию привязок Coral на Python. Если версия на Python работает, но эти тесты по-прежнему не проходят, пожалуйста, сообщите нам об этом, отправив отчет об ошибке .

Запустите стартовый код

Теперь вы готовы запустить стартовый код. Выполните следующие шаги, чтобы начать.

1. Перейдите в каталог starter_code , расположенный внутри каталога tfjs-tflite-node-codelab .
2. Для установки зависимостей выполните npm install .
3. Запустите проект с помощью npm start . Должно открыться приложение, отображающее видеопоток с веб-камеры вашего компьютера.

Примечание: Если вы используете плату разработки Coral и команда npm install выдает ошибку ENOMEM , выполните npm rebuild && npm install чтобы пересобрать поврежденные пакеты.

С чего мы начнём?

В качестве отправной точки мы используем базовое приложение для работы с камерой на языке Electron , разработанное для этого практического занятия. Код упрощен, чтобы продемонстрировать концепции, рассматриваемые в занятии, и содержит минимум обработки ошибок. Если вы решите использовать какой-либо код в рабочем приложении, обязательно обработайте все ошибки и тщательно протестируйте весь код.

Изучите стартовый код

В этом стартовом коде много файлов, но редактировать нужно только renderer.js . Он управляет тем, что отображается на странице, включая видеопоток и HTML-элементы, и именно сюда вы добавляете свою модель машинного обучения в приложение. Среди других файлов есть index.html , но он просто загружает файл renderer.js . Также есть файл main.js , который является точкой входа для Electron . Он управляет жизненным циклом приложения, включая то, что отображать при открытии и что делать при закрытии, но вам не нужно будет вносить в него какие-либо изменения.

Откройте отладчик

В процессе выполнения этого практического задания вам может потребоваться отладка приложения. Поскольку это приложение основано на Electron , в него встроен отладчик Chrome. На большинстве платформ его можно открыть с помощью Ctrl + Shift + i . Щелкните вкладку «Консоль» , чтобы просмотреть журналы и сообщения об ошибках приложения.

Здесь больше нечего исследовать, поэтому давайте сразу перейдем к обучению классификатора изображений!

3. Обучение классификатора изображений

В этом разделе вы обучаете версии пользовательской модели классификации изображений на платформах TFLite и Coral.

Обучить классификатор

Классификатор изображений принимает на вход изображения и присваивает им метки. В этом практическом задании вы используете Teachable Machine для обучения модели в браузере. Чтобы ускорить обучение, вместо Raspberry Pi можно использовать настольный или портативный компьютер, но тогда вам придётся скопировать полученные файлы на Pi.

Теперь вы готовы обучить модель. Если вы не уверены, какую модель обучать, простой в обучении вариант — это детектор людей, который просто определяет, находится ли человек в кадре.

1. Откройте страницу обучения Teachable Machine в новой вкладке.
2. Выберите «Проект изображения» , а затем «Стандартная модель изображения» .
3. Добавьте образцы изображений для каждого класса. Проще всего это сделать, используя вход с веб-камеры. Вы также можете переименовать классы.
4. Когда вы соберете достаточно данных для каждого класса (обычно достаточно 50 образцов), нажмите кнопку «Обучить модель» .

После завершения обучения модели вы должны увидеть предварительный просмотр ее результатов.

Попробуйте подать на модель разные входные данные. Если вы обнаружите неправильно классифицированный входной параметр, добавьте его в обучающие данные и переобучите модель.

5. Когда вы будете удовлетворены точностью модели, нажмите «Экспорт модели» . Вам потребуется загрузить две отдельные версии модели.
6. Экспортируйте свою модель в формате Tensorflow Lite Floating point model. При этом будет загружен файл converted_tflite.zip , который будет выполняться на центральном процессоре.
7. Экспортируйте свою модель как модель Tensorflow Lite EdgeTPU. При этом будет загружен файл converted_edgetpu.zip , который будет работать на Coral Edge TPU.

Совет: Для большей точности используйте в образцах изображений различные повороты, положения и фоны. Если у вас есть ноутбук, используйте его для более удобного сбора этих образцов.

4. Запустите модель ЦП в своем приложении.

Теперь, когда вы обучили модель, пришло время добавить её в ваше приложение. К концу этого раздела приложение сможет запускать вашу модель, используя процессор устройства.

Добавьте файл модели в приложение.

Распакуйте загруженный вами файл модели converted_tflite.zip, который вы использовали при обучении классификатора. В архиве находятся два файла. model_uquant.tflite — это сохраненная модель TFLite, включающая граф модели и веса. labels.txt содержит удобочитаемые метки для классов, которые предсказывает модель. Поместите оба файла в каталог model .

Установите зависимости

Для загрузки модели и предварительной обработки входных данных требуется несколько зависимостей от TensorFlow.js:

• tfjs-tflite-node : пакет TensorFlow.js для запуска моделей TFLite в Node.js.
• @tensorflow/tfjs : Основной пакет TensorFlow.js.

Библиотека @tensorflow/tfjs уже установлена, но вам необходимо установить tfjs-tflite-node с помощью этой команды:

npm install --save tfjs-tflite-node

После установки добавьте его в приложение в верхней части файла renderer.js :

CODELAB, часть 1: Импорт tfjs-tflite-node.

const {loadTFLiteModel} = require('tfjs-tflite-node');

Загрузите модель

Теперь вы готовы загрузить модель. tfjs-tflite-node предоставляет для этого функцию loadTFLiteModel . Она может загружать модели из пути к файлу, из ArrayBuffer или по URL-адресу TFHub. Чтобы загрузить вашу модель и её веса, добавьте это в main функцию:

CODELAB, часть 1: Загрузите модель сюда.

const modelPath = './model/model_unquant.tflite';
const model = await loadTFLiteModel(modelPath);
const labels = fs.readFileSync('./model/labels.txt', 'utf8')
      .split('\n');

Запустите модель

Запуск модели состоит из трех шагов. Сначала вы получаете и предварительно обрабатываете входной кадр с веб-камеры. Затем вы запускаете модель на этом кадре и получаете предсказание. После этого вы отображаете предсказание на странице.

Предварительная обработка входного сигнала с веб-камеры.

В настоящий момент веб-камера представляет собой всего лишь HTML-элемент, и отображаемые ею кадры недоступны для файла renderer.js на JavaScript. Для получения кадров с веб-камеры TensorFlow.js предоставляет класс tf.data.webcam , который предлагает простой в использовании метод capture() для захвата кадров с камеры.

Для использования добавьте следующий код настройки в main() :

CODELAB, часть 1: Настройте здесь tf.data.webcam.

const tensorCam = await tf.data.webcam(webcam);

Затем, чтобы захватывать изображение каждый кадр, добавьте в run() следующее:

CODELAB, часть 1: Захват кадров с веб-камеры здесь.

const image = await tensorCam.capture();

Также необходимо предварительно обработать каждый кадр, чтобы он был совместим с моделью. Модель, используемая в этом практическом задании, имеет входную форму [1, 224, 224, 3], поэтому она ожидает изображение RGB размером 224 на 224 пикселя. Функция tensorCam.capture() возвращает форму [224, 224, 3], поэтому необходимо добавить дополнительное измерение в начало тензора с помощью tf.expandDims . Кроме того, модель для ЦП ожидает входные данные типа Float32 от -1 до 1 , но веб-камера захватывает значения от 0 до 255. Вы можете разделить входной тензор на 127, чтобы изменить его диапазон с [0, 255] на [0, ~2], а затем вычесть 1, чтобы получить желаемый диапазон [-1, ~1]. Добавьте следующие строки в tf.tidy() в функции run() , чтобы это сделать:

CODELAB, часть 1: Здесь выполняется предварительная обработка кадров с веб-камеры.

const expanded = tf.expandDims(image, 0);
const divided = tf.div(expanded, tf.scalar(127));
const normalized = tf.sub(divided, tf.scalar(1));

Важно освобождать ресурсы тензоров после их использования. tf.tidy() делает это автоматически для кода, содержащегося в его функции обратного вызова, но он не поддерживает асинхронные функции. Вам потребуется вручную освободить ресурсы тензора изображения, созданного ранее, вызвав его метод dispose() .

CODELAB, часть 1: Удалите кадры с веб-камеры здесь.

image.dispose();

Запустите модель и отобразите результаты.

Чтобы запустить модель на предварительно обработанных входных данных, вызовите model.predict() для нормализованного тензора. Это вернет одномерный тензор, содержащий предсказанную вероятность каждой метки. Умножьте эту вероятность на 100, чтобы получить процентную вероятность каждой метки, и используйте функцию showPrediction входящую в стартовый код, чтобы отобразить предсказание модели на экране.

В этом коде также используется stats.js для измерения времени, необходимого для прогнозирования, путем размещения вызовов stats.begin и stats.end вокруг model.predict .

CODELAB, часть 1: Запустите модель и отобразите результаты здесь.

stats.begin();
const prediction = model.predict(normalized);
stats.end();
const percentage = tf.mul(prediction, tf.scalar(100));
showPrediction(percentage.dataSync(), labels);

Запустите приложение еще раз с помощью yarn start , и вы должны увидеть классификации, полученные с помощью вашей модели.

Производительность

В текущей конфигурации модель работает на центральном процессоре. Это подходит для настольных компьютеров и большинства ноутбуков, но может быть нежелательно при использовании Raspberry Pi или другого маломощного устройства. На Raspberry Pi 4 вы, вероятно, получите около 10 кадров в секунду, чего может быть недостаточно для некоторых приложений. Для повышения производительности без использования более мощного компьютера можно использовать специализированные микросхемы, такие как TPU Coral Edge.

5. Запустите модель Coral в своем приложении.

Если у вас нет устройства Coral, вы можете пропустить этот раздел.

Этот этап практического занятия основан на коде, который вы написали в предыдущем разделе, но вы можете использовать контрольную точку cpu_inference_working, если хотите начать с чистого листа.

Этапы запуска модели Coral практически идентичны этапам запуска модели для ЦП. Основное отличие заключается в формате модели. Поскольку Coral поддерживает только тензоры типа uint8, модель квантуется. Это влияет на входные тензоры, передаваемые модели, и на выходные тензоры, которые она возвращает. Еще одно отличие заключается в том, что для работы на Coral TPU модели необходимо компилировать с помощью компилятора Edge TPU. TeachableMachine уже выполнила этот шаг, но вы можете узнать, как это сделать для других моделей, посетив документацию Coral .

Добавьте файл модели Coral в приложение.

Распакуйте загруженный вами файл модели converted_edgetpu.zip, который вы использовали при обучении классификатора. В архиве содержатся два файла: model_edgetpu.tflite — это сохраненная модель TFLite, включающая граф модели и веса; labels.txt — это удобочитаемые метки для классов, которые предсказывает модель. Поместите файл модели в каталог coral_model .

Установите зависимости

Для запуска моделей Coral требуется библиотека среды выполнения Edge TPU . Перед продолжением убедитесь, что вы установили её, следуя инструкциям по установке.

Доступ к устройствам Coral осуществляется через делегаты TFLite . Для доступа к ним из JavaScript установите пакет coral-tflite-delegate :

npm install --save coral-tflite-delegate

Затем импортируйте делегат, добавив следующую строку в начало файла renderer.js :

CODELAB, часть 2: Импортируйте делегат сюда.

const {CoralDelegate} = require('coral-tflite-delegate');

Загрузите модель

Теперь вы готовы загрузить модель Coral. Это делается так же, как и для модели CPU, за исключением того, что теперь вы передаете параметры функции loadTFLiteModel для загрузки делегата Coral.

CODELAB, часть 2: Загрузите модель делегата сюда.

const coralModelPath = './coral_model/model_edgetpu.tflite';
const options = {delegates: [new CoralDelegate()]};
const coralModel = await loadTFLiteModel(coralModelPath, options);

Загружать метки не нужно, поскольку они совпадают с метками для модели процессора.

Добавить кнопку для переключения между CPU и Coral.

Вы добавляете модель Coral вместе с моделью CPU, которую добавили в предыдущем разделе. Одновременный запуск обеих моделей затрудняет выявление различий в производительности, поэтому для переключения между выполнением Coral и CPU используется кнопка-переключатель.

Добавьте кнопку с этим кодом:

CODELAB, часть 2: Создайте кнопку делегата здесь.

let useCoralDelegate = false;
const toggleCoralButton = document.createElement('button');
function toggleCoral() {
  useCoralDelegate = !useCoralDelegate;
  toggleCoralButton.innerText = useCoralDelegate
      ? 'Using Coral. Press to switch to CPU.'
      : 'Using CPU. Press to switch to Coral.';
}
toggleCoralButton.addEventListener('click', toggleCoral);
toggleCoral();
document.body.appendChild(toggleCoralButton);

Давайте добавим это условие в функцию run() . Когда useCoralDelegate равно false, должна запускаться версия для ЦП. В противном случае запускается версия Coral (но пока она просто ничего не будет делать). Оберните код запуска модели для ЦП в оператор if . Обратите внимание, что expanded тензор опущен в операторе if, поскольку модель Coral его использует.

CODELAB, часть 2: Проверьте, следует ли использовать здесь делегат.

// NOTE: Don't just copy-paste this code into the app.
// You'll need to edit the code from the CPU section.
const expanded = tf.expandDims(image, 0);
if (useCoralDelegate) {
  // CODELAB part 2: Run Coral prediction here.
} else {
  const divided = tf.div(expanded, tf.scalar(127));
  const normalized = tf.sub(divided, tf.scalar(1));
  stats.begin();
  const prediction = model.predict(normalized);
  stats.end();
  const percentage = tf.mul(prediction, tf.scalar(100));
  showPrediction(percentage.dataSync(), labels);
}

Запустите модель

В версии модели для Coral ожидаются тензоры типа uint8 от 0 до 255, поэтому их входные данные не требуют нормализации. Однако выходные данные также представляют собой тензор типа uint8 в диапазоне от 0 до 255. Перед отображением его необходимо преобразовать в число с плавающей запятой от 0 до 100.

CODELAB, часть 2: Запуск прогнозирования Coral здесь. (Это часть приведенного выше фрагмента кода)

stats.begin();
const prediction = coralModel.predict(expanded);
stats.end();
const percentage = tf.div(tf.mul(prediction, tf.scalar(100)), tf.scalar(255));
showPrediction(percentage.dataSync(), labels);

Запустите приложение еще раз с помощью yarn start , и оно должно отобразить классификации из ускорителя Coral.

Переключаться между выводом данных в Coral и CPU можно, нажав соответствующую кнопку. Вы можете заметить, что ранжирование достоверности модели Coral менее точное, чем у модели CPU, и обычно заканчивается четным числом после запятой. Эта потеря точности является компромиссом при запуске квантованной модели в Coral. На практике это обычно не имеет значения, но об этом стоит помнить.

Заметка о выступлении

Указанная частота кадров включает в себя предварительную и постобработку, поэтому она не отражает возможности оборудования Coral. Более точное представление о производительности можно получить, щелкнув по индикатору FPS, пока он не покажет задержку (в миллисекундах), которая измеряет только вызов model.predict . Однако это также включает время, необходимое для перемещения тензоров в собственные C-привязки TFLite, а затем на устройство Coral, поэтому это не идеальное измерение. Для получения более точных результатов тестов производительности, написанных на C++, см. страницу тестов EdgeTPU .

Также следует отметить, что видео было записано на ноутбуке, а не на Raspberry Pi, поэтому частота кадров может отличаться.

Ускорение предварительной обработки данных для Coral

В некоторых случаях можно ускорить предварительную обработку, переключившись на другой бэкенд TFJS. Бэкенд по умолчанию — WebGL, который хорошо подходит для больших, распараллеливаемых операций, но это приложение не использует их в значительной степени на этапе предварительной обработки (единственная используемая операция — expandDims , которая не является параллельной). Вы можете переключиться на бэкенд для ЦП, чтобы избежать дополнительной задержки, связанной с перемещением тензоров на графический процессор и обратно, добавив эту строку после импортов в начале файла.

tf.setBackend(‘cpu');

Это также влияет на предварительную обработку модели TFLite для ЦП, которая выполняется в распараллеленном режиме, поэтому после этого изменения модель будет работать значительно медленнее.

6. Ускорьте работу модели на ЦП с помощью WebNN.

Если у вас нет ускорителя Coral или вы просто хотите попробовать другой способ ускорения модели, вы можете использовать делегат WebNN TFLite . Этот делегат использует аппаратное обеспечение машинного обучения, встроенное в процессоры Intel, для ускорения вывода модели с помощью инструментария OpenVINO . Следовательно, у него есть дополнительные требования, которые не были рассмотрены в разделе настройки этого практического занятия, и вам потребуется установить инструментарий OpenVINO. Перед продолжением обязательно проверьте свою конфигурацию на соответствие поддерживаемым целевым системным платформам , но обратите внимание, что делегат WebNN пока не поддерживает macOS.

Установите инструментарий OpenVINO.

Инструментарий OpenVINO использует встроенное в процессоры Intel оборудование для машинного обучения, ускоряющее работу моделей. Вы можете загрузить предварительно скомпилированную версию с сайта Intel или собрать её из исходного кода . Существует несколько способов установки OpenVINO, но для целей этого Codelab мы рекомендуем использовать скрипт установки для Windows или Linux . Убедитесь, что вы установили версию среды выполнения 2021.4.2 LTS, так как другие версии могут быть несовместимы . После запуска установщика убедитесь, что вы настроили переменные среды вашей оболочки, как описано в инструкциях по установке для Linux или Windows ( постоянное решение ), или запустив команду setupvars.sh (Linux) или setupvars.bat (Windows), расположенную в каталоге webnn-tflite-delegate .

Примечание для Windows: команда setupvars.bat не поддерживает Git bash, поэтому обязательно запускайте её и другие команды из этого руководства из командной строки Windows.

Убедитесь, что делегат WebNN работает.

Чтобы убедиться в корректной работе делегата WebNN, запустите интеграционные тесты для пакета webnn-tflite-delegate расположенного в корневом каталоге репозитория. Для запуска интеграционных тестов выполните следующие команды в каталоге пакета:

# In webnn-tflite-delegate/
npx yarn
npx yarn test-integration

В результате вы должны увидеть примерно следующее:

WebNN delegate: WebNN device set to 0.
INFO: Created TensorFlow Lite WebNN delegate for device Default and power Default.

============================
Hi there 👋. Looks like you are running TensorFlow.js in Node.js. To speed things up dramatically, install our node backend, which binds to TensorFlow C++, by running npm i @tensorflow/tfjs-node, or npm i @tensorflow/tfjs-node-gpu if you have CUDA. Then call require('@tensorflow/tfjs-node'); (-gpu suffix for CUDA) at the start of your program. Visit https://github.com/tensorflow/tfjs-node for more details.
============================
label: wine bottle
score:  0.934505045413971
.


1 spec, 0 failures
Finished in 0.446 seconds
Randomized with seed 58441 (jasmine --random=true --seed=58441)
Done in 8.07s.

Если вы видите подобный вывод, это указывает на ошибку конфигурации:

Platform node has already been set. Overwriting the platform with node.
Randomized with seed 05938
Started
error Command failed with exit code 3221225477.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Скорее всего, этот вывод означает, что вы не установили переменные среды OpenVINO. На данный момент вы можете установить их, запустив команду setupvars.sh (Linux) или setupvars.bat (Windows), но вы можете установить их навсегда, следуя инструкциям для Linux или Windows ( постоянное решение ). Если вы используете Windows, то...

setupvars.bat

Эта команда не поддерживает Git Bash , поэтому убедитесь, что вы запускаете её и другие команды из этого руководства из командной строки Windows.

Установите делегат WebNN.

После установки OpenVINO вы готовы ускорить работу модели на ЦП с помощью WebNN. Этот раздел практического задания основан на коде, который вы написали в разделе «Запуск модели на ЦП в вашем приложении». Вы можете использовать код, написанный на этом шаге, но если вы уже выполнили раздел Coral, используйте вместо него контрольную точку cpu_inference_working , чтобы начать с чистого листа.

Часть делегата WebNN, предназначенная для Node.js, распространяется через npmjs. Для её установки выполните следующую команду:

npm install --save webnn-tflite-delegate

Затем импортируйте делегат, добавив следующую строку в начало файла renderer.js :

CODELAB, часть 2: Импортируйте делегат сюда.

const {WebNNDelegate, WebNNDevice} = require('webnn-tflite-delegate');

Делегат WebNN поддерживает работу как на центральном процессоре (CPU), так и на графическом процессоре (GPU); WebNNDevice позволяет выбрать, какой из них использовать.

Загрузите модель

Теперь вы готовы загрузить модель с включенным делегатом WebNN. Для Coral вам пришлось бы загрузить другой файл модели, но WebNN поддерживает тот же формат модели, что и TFLite. Добавьте WebNNDelegate в список делегатов, передаваемых модели, чтобы включить его:

CODELAB, часть 2: Загрузите модель делегата сюда.

let webnnModel = await loadTFLiteModel(modelPath, {
  delegates: [new WebNNDelegate({webnnDevice: WebNNDevice.DEFAULT})],
});

Повторная загрузка этикеток не требуется, поскольку это та же самая модель.

Добавить кнопку для переключения между TfLite CPU и WebNN.

Теперь, когда версия модели WebNN готова, добавьте кнопку для переключения между выводом данных на ЦП с использованием WebNN и TfLite. Одновременный запуск обеих версий затрудняет выявление различий в производительности.

Добавьте кнопку с этим кодом (обратите внимание, что переключение моделей пока не будет происходить):

CODELAB, часть 2: Создайте кнопку делегата здесь.

let useWebNNDelegate = false;
const divElem = document.createElement('div');
const toggleWebNNButton = document.createElement('button');
function toggleWebNN() {
  useWebNNDelegate = !useWebNNDelegate;
  toggleWebNNButton.innerHTML = useWebNNDelegate
      ? 'Using WebNN. Press to switch to TFLite CPU.'
      : 'Using TFLite CPU. Press to switch to WebNN.';
  divElem.hidden = useWebNNDelegate ? false : true;
}

toggleWebNNButton.addEventListener('click', toggleWebNN);
toggleWebNN();
document.body.appendChild(toggleWebNNButton);
document.body.appendChild(divElem);

Этот код также добавляет элемент div , который вы будете использовать для настройки параметров WebNN в следующем разделе.

Добавьте выпадающее меню для переключения между устройствами WebNN.

WebNN поддерживает работу как на CPU, так и на GPU, поэтому добавьте выпадающее меню для переключения между ними. Добавьте этот код после кода, создающего кнопку:

// Create elements for WebNN device selection
divElem.innerHTML = '<br/>WebNN Device: ';
const selectElem = document.createElement('select');
divElem.appendChild(selectElem);

const webnnDevices = ['Default', 'GPU', 'CPU'];
// append the options
for (let i = 0; i < webnnDevices.length; i++) {
  var optionElem = document.createElement('option');
  optionElem.value = i;
  optionElem.text = webnnDevices[i];
  selectElem.appendChild(optionElem);
}

Теперь, если вы запустите приложение, вы увидите выпадающее меню со списком «По умолчанию», «GPU» и «CPU». Выбор одного из них пока ничего не даст, поскольку выпадающее меню еще не подключено.

В выпадающем списке можно изменить устройство.

Чтобы настроить выпадающий список таким образом, чтобы он автоматически выбирал используемое устройство WebNN, добавьте обработчик события изменения элемента селектора выпадающего списка. При изменении выбранного значения пересоздайте модель WebNN с соответствующим устройством WebNN, выбранным в параметрах делегата.

Добавьте следующий код после кода, который добавил выпадающий список:

selectElem.addEventListener('change', async () => {
  let webnnDevice;
  switch(selectElem.value) {
    case '1':
      webnnDevice = WebNNDevice.GPU;
      break;
    case '2':
      webnnDevice = WebNNDevice.CPU;
      break;
    default:
      webnnDevice = WebNNDevice.DEFAULT;
      break;
  }
  webnnModel = await loadTFLiteModel(modelPath, {
    delegates: [new WebNNDelegate({webnnDevice})],
  });
});

Благодаря этому изменению выпадающее меню каждый раз создает новую модель с правильными настройками. Теперь пришло время подключить модель WebNN и использовать ее для вывода результатов.

Запустите модель WebNN

Модель WebNN готова к использованию, но кнопка переключения между WebNN и TfLite CPU пока фактически не переключает модель. Для переключения модели сначала необходимо переименовать переменную model , которую вы загрузили при загрузке модели TfLite CPU в первом разделе практического задания.

Измените следующую строку...

const model = await loadTFLiteModel(modelPath);

...так чтобы оно соответствовало этой строке.

const cpuModel = await loadTFLiteModel(modelPath);

Переименовав переменную model в cpuModel , добавьте в функцию run следующий код, чтобы выбрать правильную модель в зависимости от состояния кнопки:

CODELAB, часть 2: Проверьте, следует ли использовать здесь делегат.

let model;
if (useWebNNDelegate) {
  model = webnnModel;
} else {
  model = cpuModel;
}

Теперь при запуске приложения кнопка переключается между TfLite CPU и WebNN.

Также, при наличии встроенного графического процессора Intel, вы можете переключаться между выводом WebNN на ЦП и ГП.

Заметка о выступлении

Указанная частота кадров включает в себя предварительную и постобработку, поэтому она не отражает возможностей WebNN. Более точное представление о производительности можно получить, щелкнув по индикатору FPS, пока он не покажет задержку (в миллисекундах), которая измеряет только вызов model.predict . Однако это по-прежнему включает время, необходимое для перемещения тензоров в собственные C-привязки TFLite, поэтому это не идеальное измерение.

7. Поздравляем!

Поздравляем! Вы только что завершили свой первый проект на Coral/WebNN, используя tfjs-tflite-node в Electron.

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

Краткий обзор

В ходе этого практического занятия вы узнали:

• Как установить и настроить npm-пакет tfjs-tflite-node для запуска моделей TFLite в Node.js.
• Как установить библиотеку среды выполнения Edge TPU для запуска моделей на устройстве Coral.
• Как ускорить вывод модели с помощью TPU на периферии Coral.
• Как ускорить вывод модели с помощью WebNN.

Что дальше?

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

Чтобы узнать больше о том, как TeachableMachine обучал используемую вами модель, ознакомьтесь с нашим практическим руководством по трансферному обучению . Если вы ищете другие модели, работающие с Coral, например, для распознавания речи и оценки позы, загляните на coral.ai/models . Вы также можете найти версии этих и многих других моделей для ЦП на TensorFlow Hub .

Поделитесь с нами своими творениями!

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

Не забудьте отметить нас в социальных сетях, используя хэштег #MadeWithTFJS , чтобы получить шанс на публикацию вашего проекта в нашем блоге TensorFlow или даже на будущих мероприятиях . Нам очень интересно посмотреть на ваши работы.

Сайты, которые стоит посмотреть

• Официальный сайт TensorFlow.js
• готовые модели TensorFlow.js
• API TensorFlow.js
• Демонстрация TensorFlow.js