Chrome hangs on loading page with many <video> tags

Question

I have a page with many elements in it arranged one after the other.

Lets says 100 for now. When I click on the web page, Chrome loads the fi

Answer 1

Same problem here, this is the best way to fix it

Replace

<video  controls>....</video>

To

<video controls preload="none" controls poster="screen_shot.png">

Answer 2

I found a solution that bypass this Chrome issue. Posting here in case someone else runs into the same problem.

Replaced All the

  <video  controls>....</video>

with

  <video preload = "none" controls poster="screen_shot.png">

What the above does is suggest to the browser not to download the videos unless one clicks on the play button, then only that specific video is loaded. It places a poster image meanwhile so that the space is occupied by something and not empty.

Now the web page loads fine in Chrome.

Chrome has a known bug creating multiple socket connections and not closing them. https://code.google.com/p/chromium/issues/detail?id=234779