Quickly switch pictures in the web front end to achieve video playback effects

There is a video component in the front-end interface that can directly play the downloaded video, and can also display streaming media such as rtmp through video.js to achieve real-time image effects. In order to ensure the real-time effect, after the real-time video is detected frame by frame, the video is synthesized and then displayed on the front end. When the quality of the video image is high and the detection is slow, it is difficult to achieve real-time Effect, so we are here to talk about a roundabout method, quickly switch pictures to achieve the effect of video playback. Not much to say, just go to the code.

<img id="im"  src="DJI_2055_30/1.jpg"/>
<script>
	setInterval("changeImg()",10);
	
	i=1
	function changeImg(){
    
    
		var SImg = document.getElementById('im');
		SImg.src="DJI_2055_30/" + i + ".jpg";
		i++;
	}
</script>