I have come across an interesting bug in IE.

In a web page I dynamically create 8 flash <embed> elements using document.createElement.

If I stop using document.createElement. The bug goes away.

If I clear the cache and load the web page, the flash takes a minute to load. See the following load trace from HttpWatch.

WTF?

The first two requests happen right away, every other request takes 10 seconds up to the last one but none of the requests complete until the last one is finished.

CPU usage is 0. IE just seems to sit there and wait.

If I leave the files in the cache I get the following.

Every time I clear the cache, the pattern is the same. 10 seconds. The first 2 files take the same time to load. Everyone after that takes 10 seconds. All seem to finish at the same time. The last one loads ‘normally’.

If I remove any one or more of the flash elements – I get the same pattern.

6 Flash elements

3 Flash elements

The problem goes away when I get to 2 Flash elements.

Note that the first two files have a result of 206. This is an artifact of streaming in flash. If I remove the first two. The next two have this result. So the first two stream. The next do not. Maybe only two can stream at once and that causes an issue?

It could be that the default behavior of flash to stream is part of the issue.

If I stop using document.createElement and emit the <embed> elements using innerHTML. The problem goes away.

So what could be happening? I have tried rebooting. A different machine. Turning off hyper-threading. No joy.

Astoundingly, If I put a JavaScript 

alert("meep"); 

…between each of the flash element creation calls. The problem goes away. So it seems that allowing the windows message pump to process has something to do with the issue.

All I can come up with is the following ‘theory’.

When the elements are added with document.createElement, they are not individually processed. At some point the IE document renderer goes through the added <embed> elements and processes their setup code all at once. If the flash file is not in the cache, a http GET request is made for each one. So we get 8 rapid requests for flash files.

Two GETs good.. three GETs bad.

I believe that more than three requests causes a deadlock in IE, and that somewhere there is some code that can deal with the deadlock that fires off every 10 seconds to process then next request.

If I add an alert between each creation the windows message pump is activated and is able to either IE process the setup code or the http request of the <embed> element, and the deadlock never has a chance to trigger.

The issue may be restricted to flash which streams by default.

I’m wondering if this affects just flash or other resources using <embed> as well?

Has anyone else encountered this or have a possible explanation?

I have my solution – that is to stop using document.createElement and instead use innerHTML and pray I never have to use xhtml.