javascript – multiple html5 videos – takes too long to start playing

on a page I have about 50 html5 videos

<video class='avideo' src="https://stackoverflow.com/323.mp4" poster='323.jpg' controls></video>
<video class='avideo' src='324.mp4' poster='324.jpg' controls></video>
<video class='avideo' src='325.mp4' poster='325.jpg' controls></video>

need to stop the current playing video when another is clicked to play

$('.avideo').on('play', function(){
    $('.vact').trigger('pause').removeClass('vact');
    $(this).addClass('vact');
});

it works but often it takes very long time – sometimes 15sec – to start playing the new clicked video
also sometimes – there is no video spinner (loader) to indicate that video is loading
it looks like – there is no any reaction on click

how to make this pause shorter ?
or – how to force the video spinner while the video is loading ?