Databases
StackOverflow2013
Postsdbo
POIs there an IE Render Complete event?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POIs there an IE Render Complete event?
    text
    copied!<p>While trying to determine why a page was taking 20s to load, I found some odd behavior in IE8.</p> <p>The scenario is this.</p> <p>I make an ajax call, it returns and the callback looked something like this</p> <pre><code>$("#StoreDetailsContainer").html($(tableHtml)); var StoreDetailsTable = $("#StoreDetailsTable"); StoreDetailsTable.tablesorter({ sortList: [[0, 0]], cssChildRow: "SubTable" }); StoreDetailsTable.filtertable({ cssChildRow: "SubTable" }); </code></pre> <p>However, this bit of code took 20s to complete.</p> <p>I was messing around, timing things, and popping up alerts between methods, and suddenly, it took only 6s. I played around a little more to find that if I introduced a delay after the <code>.html()</code> call, and before I attempted to manipulate the DOM, the page rendered MUCH faster. It now looks like this</p> <pre><code>$("#StoreDetailsContainer").html($(tableHtml)); window.setTimeout(function() { var StoreDetailsTable = $("#StoreDetailsTable"); StoreDetailsTable.tablesorter({ sortList: [[0, 0]], cssChildRow: "SubTable" }); StoreDetailsTable.filtertable({ cssChildRow: "SubTable" }); }, 100); </code></pre> <p>It also only takes 6s despite having an extra 1/10th of a second added to the process.</p> <p>My theory is that because the DOM wasn't fully rendered to the screen by IE by the <code>.html()</code> call before attempting to work with it, there is some kind of locking happening.</p> <p>Is there a way to determine when IE has finished rendering what was added to the DOM by <code>.html()</code> so I don't need to use an arbitrary value in a <code>setTimeout</code> call?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload