От нулата в чист JavaScript

Как работи този
MLP разпознавач?

Пълно обяснение на математиката зад кода.
С реални числа и интерактивни примери.

Започни с интерактивния пример Виж Backpropagation

Това е образователна страница към демото Mobile MLP Digits Demo

РАЗДЕЛ 1

Архитектурата на мрежата

Реалната мрежа в демото

ВХОДЕН СЛОЙ
196
неврона
14 × 14 пиксела
СКРИТ СЛОЙ
32
неврона
Sigmoid
ИЗХОДЕН СЛОЙ
10
неврона
Цифри 0–9
Всеки пиксел от твоята рисунка става входна стойност (0 или 1). Мрежата преобразува тези 196 числа в 10 изходни стойности — по една за всяка цифра.

Защо точно тези размери?

  • • 14×14 — достатъчно детайлно за цифри, но малко (196 входа) за да се обучава бързо в браузъра.
  • • 32 скрити неврона — добър баланс. Достатъчно капацитет за разпознаване, без да забавя обучението.
  • • 10 изхода — по един неврон за всяка цифра (one-hot стил).
РАЗДЕЛ 2

Активационната функция: Sigmoid

Sigmoid преобразува всяко число в стойност между 0 и 1. Това е ключово, защото:

  • Позволява на мрежата да "включва" или "изключва" неврони плавно.
  • Производната ѝ е лесна за изчисляване (използва се при backprop).
  • Изходните стойности могат да се интерпретират като "колко сигурна е мрежата".
ФОРМУЛА
σ(z) = 1 / (1 + e-z)
Производна (използва се в backprop):
σ'(a) = a × (1 − a)   (където a = σ(z))
ИНТЕРАКТИВЕН КАЛКУЛАТОР
-6
0
+6
σ(z)
0.500
σ'(z)
0.250
РАЗДЕЛ 3

Прямият проход (Forward Propagation)

Това е моментът, в който мрежата "предсказва". Входните данни преминават през теглата и активациите и накрая получавате 10 числа.

1 Как се изчислява един неврон?

За всеки неврон в следващия слой:

z = bias + Σ (weightk × activationk от предишния слой)
a = sigmoid(z)
В кода:
sum = bias[j]
sum += current[k] * weights[i][j][k]

next.push( activate(sum) )
РАЗДЕЛ 4 • ИНТЕРАКТИВНО

Играй с малка мрежа (2 → 2 → 1)

Променяй входовете и виж как числата се движат през мрежата в реално време.

ВХОДНИ СТОЙНОСТИ
x₁ 0.70
01
x₂ 0.25
01
ТЕГЛА И BIAS-И (можеш да ги видиш как се променят)
W1 (вход → скрит слой) + bias1
h₁ h₂
x₁
x₂
bias
W2 (скрит → изход) + bias2
out
h₁
h₂
bias
ПРЯМ ПРОХОД — РЕЗУЛТАТИ
Скрит слой
h₁ (z → a)
h₂ (z → a)
Изход
out (z → a)
Предсказание
0.000
0.85
РАЗДЕЛ 5

Обратна пропагация на грешката (Backpropagation)

Това е моментът, в който мрежата се учи. Тя сравнява какво е предсказала с това, което трябва да е, и поправя теглата.

Стъпки в кода (опростено)

  1. 1
    Изчислява се грешката на изхода
    error = target − output_activation
  2. 2
    Грешката се разпространява назад
    За всеки предишен слой: error = Σ (error_next × weight)
  3. 3
    Изчислява се градиентът
    gradient = error × activatePrime(activation)
  4. 4
    Обновяват се теглата и bias-ите
    weight += learningRate × gradient × prev_activation
    bias += learningRate × gradient

Защо работи?

Мрежата използва градиентен спуск. Тя търси посоката, в която грешката намалява най-бързо, и прави малка крачка в тази посока (learning rate = 0.15 в кода).

При всяко натискане на "Train X" в оригиналното демо се изпълняват 200 епохи върху всички примери, които си нарисувал досега. Това е причината мрежата да започне да разпознава бързо дори с малко примери.
РАЗДЕЛ 6

Как точно работи оригиналният код?

1
Рисуваш → 14×14 grid се обновява в реално време (с леко "задебеляване" на линията).
2
Натискаш "Train 5" → текущият grid се запазва като пример + one-hot target [0,0,0,0,0,1,0,0,0,0].
След това мрежата се обучава 200 пъти върху всички примери досега (с разбъркване).
3
Докато рисуваш → на всеки ход се извиква guess(), който прави predict() и показва най-вероятната цифра.