Для использования Keras.js необходимо подготовить среду исполнения на стороне клиента. Библиотека работает в браузере и позволяет запускать предварительно обученные модели Keras без необходимости серверной обработки. Основные способы подключения:
<script src="https://cdn.jsdelivr.net/npm/keras-js@0.8.0/dist/keras.min.js"></script>
npm install keras-js
После установки через npm можно подключать библиотеку в проект через сборщик, например, Webpack:
const KerasJS = require('keras-js');
Важно убедиться, что среда поддерживает WebGL, так как библиотека использует его для ускорения вычислений. Если WebGL отсутствует, Keras.js автоматически переключается на CPU-режим, что значительно снижает производительность.
Keras.js работает с моделями, сохранёнными в формате Keras
.json для структуры и отдельными бинарными файлами для
весов (.bin). Структура проекта может выглядеть так:
/model
model.json
group1-shard1of1.bin
Пример загрузки модели:
const model = new KerasJS.Model({
filepath: 'model/model.json',
gpu: true // использование WebGL для ускорения
});
model.ready()
.then(() => {
console.log('Модель загружена и готова к использованию');
})
.catch(err => {
console.error('Ошибка загрузки модели:', err);
});
Ключевой момент: model.ready() возвращает Promise,
который необходимо дождаться перед выполнением предсказаний. Попытка
использовать модель до её готовности приведёт к ошибкам.
Входные данные для модели должны точно соответствовать формату, используемому при обучении в Keras. Основные требования:
Float32Array или
Uint8Array.shape) должна совпадать с input shape
модели. Например, для модели, обученной на изображениях размером
28×28:const inputData = new Float32Array(28 * 28);
// Заполнение массива пикселями
for (let i = 0; i < inputData.length; i++) {
inputData[i] = pixels[i] / 255.0; // нормализация
}
const input = {
'input_1': inputData
};
Где 'input_1' — имя входного слоя модели.
После загрузки модели и подготовки данных выполняется метод
model.predict():
model.predict(input)
.then(outputData => {
console.log('Результаты предсказания:', outputData);
})
.catch(err => {
console.error('Ошибка при предсказании:', err);
});
Особенности работы:
outputData является объектом, где ключи
соответствуют именам выходных слоев.Float32Array.Пример обработки результата для классификации:
const predictions = outputData['dense_2']; // выходной слой
let maxIndex = 0;
for (let i = 1; i < predictions.length; i++) {
if (predictions[i] > predictions[maxIndex]) {
maxIndex = i;
}
}
console.log('Класс с наибольшей вероятностью:', maxIndex);
Для проверки корректности работы Keras.js достаточно запустить минимальный пример:
Пример минимальной проверки:
const testInput = {
'input_1': new Float32Array([0, 0, 0, 0, 0, 0, 0, 0, 0])
};
model.predict(testInput)
.then(output => console.log('Test prediction output:', output))
.catch(err => console.error('Test failed:', err));
При успешном выполнении этого кода можно быть уверенным, что библиотека подключена корректно, WebGL функционирует, и модель готова к полноценной работе.
gpu: true) значительно ускоряет обработку изображений и
больших массивов данных.Float32Array и удалять
неиспользуемые данные после предсказаний.Эти настройки позволяют гибко управлять использованием ресурсов браузера и поддерживать стабильную работу модели даже на слабых устройствах.