Javascript: Adding src to video tag increases memory footprint

chirag shah Source

When I am adding 'src' dynamically to video tag, the memory footprint (Google Task Manager) shoots up.

const wrapper = document.getElementById('wrapper')
for (let i = 0; i < 10; i++) {
  const video = document.createElement('video');
  // video.src = '' // The memory doesn't shoot up in this case
  video.src = 'http://clips.vorwaerts-gmbh.de/VfE_html5.mp4'
  wrapper.appendChild(video)
}
<div id="wrapper"></div> 

Can somebody explain why does this happen? What could be the best way to optimize adding multiple videos dynamically to DOM?

javascripthtml5domvideohtml5-video

Answers

comments powered by Disqus