Установка через CDN и npm

Библиотека ml5.js обеспечивает высокоуровневый доступ к мощным алгоритмам машинного обучения в JavaScript. Она построена поверх TensorFlow.js и ориентирована на простоту интеграции в веб-проекты и Node.js-приложения. Основные способы установки — через CDN для быстрого использования в браузере и через npm для проектов на Node.js.

Подключение через CDN

Использование CDN позволяет подключить библиотеку без установки дополнительных пакетов. Этот способ особенно удобен для быстрых прототипов и учебных проектов.

Подключение в HTML:

<script src="https://cdn.jsdelivr.net/npm/ml5@latest/dist/ml5.min.js"></script>

После подключения библиотека становится доступной через глобальный объект ml5.

Пример инициализации модели классификации изображений:

// Создание классификатора с помощью предобученной модели MobileNet
const classifier = ml5.imageClassifier('MobileNet', modelLoaded);

function modelLoaded() {
  console.log('Модель загружена');
}

// Классификация изображения
const image = document.getElementById('myImage');
classifier.classify(image, (error, results) => {
  if (error) {
    console.error(error);
    return;
  }
  console.log(results);
});

Особенности подключения через CDN:

  • Не требуется установка Node.js или npm.
  • Быстрая интеграция в HTML-проекты.
  • Используются предобученные версии моделей, доступные в ml5.js.
  • Возможны задержки при загрузке модели при первом обращении из-за скачивания данных из интернета.

Установка через npm

Для более крупных проектов, особенно при использовании сборщиков модулей (Webpack, Parcel, Vite), предпочтительно устанавливать ml5.js через npm.

Команда установки:

npm install ml5

После установки библиотеку можно импортировать в JavaScript-файл:

import * as ml5 from 'ml5';

Пример создания модели для распознавания поз:

import * as ml5 from 'ml5';

// Инициализация PoseNet
const video = document.getElementById('videoElement');
const poseNet = ml5.poseNet(video, modelReady);

function modelReady() {
  console.log('PoseNet загружен');
}

// Обработка событий распознавания поз
poseNet.on('pose', (results) => {
  console.log(results);
});

Преимущества установки через npm:

  • Возможность интеграции в современные фронтенд-проекты.
  • Контроль версий и совместимости через package.json.
  • Легкая работа с модулями ES6.
  • Возможность локальной работы без постоянного интернет-соединения.

Выбор между CDN и npm

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

npm предпочтителен для крупных проектов с несколькими зависимостями и сборкой через современные инструменты. Он позволяет использовать функции модульной системы JavaScript и более гибко управлять версиями библиотек.

Важные нюансы при установке

  • Версия ml5.js должна быть совместима с версией TensorFlow.js, особенно при использовании предобученных моделей.
  • При работе через CDN необходимо подключать <script> в конце <body> или использовать событие DOMContentLoaded, чтобы DOM-элементы были доступны перед инициализацией моделей.
  • npm-установка позволяет использовать tree-shaking для уменьшения итогового размера сборки, импортируя только нужные функции.

Проверка установки

После установки через CDN или npm проверка работоспособности сводится к вызову ml5.version:

console.log(ml5.version);

Если версия отображается корректно, библиотека готова к использованию.

Оглавление