В чём разница между `event.preventDefault()` и `event.stopPropagation()`?

Разные задачи

stopPropagation не отменяет default и не глушит другие слушатели на том же элементе. Для «только мой хендлер на этом узле» — stopImmediatePropagation().

Примеры

link.addEventListener("click", (e) => {
  e.preventDefault(); // не уходим по href
  // событие всё ещё может всплыть к document
});

inner.addEventListener("click", (e) => {
  e.stopPropagation(); // outer не узнает о клике
});

Как думает сеньор

Частый stopPropagation ломает аналитику и «клик снаружи». Сначала структура DOM / делегирование, потом глушение потока.

Итог: preventDefault — про поведение браузера; stopPropagation — про путь события по дереву.