Да, сымитировать запрос можно. Поэтому есть правило: "Нельзя доверять данным, которые приходят с клиента". Следовательно, данные с клиента нужно проверять на сервере. Критические данные и операции нужно подписывать или хэшировать, чтобы избежать подмены. Например, для защиты от Replay Attack используют одноразовые токены — при повторном запросе токен уже не сработает.

Можно через document.readyState проверить состояние страницы:

if (document.readyState === 'complete') {
   someFunction();
} else {
   window.addEventListener('load', someFunction);
}

Картинки переключаются (это видно, если убрать overflow: hidden у .card-list). Просто они расположены в столбик, который ограничен по высоте, при этом неактивные карточки занимают своё положение в документе даже при opacity: 0. Вероятно, вы где-то пропустили часть логики или стилей, чтобы первая картинка заменялась на активную картинку. Поскольку у карточек в вашем примере размеры одинаковые, достаточно заменить position: relative на position: absolute у .card.

function myFn(arg: MyType['prop1']) {
    //
}