ientras intentaba determinar por qué una página tardaba 20 segundos en cargarse, encontré un comportamiento extraño en IE8.

El escenario es este.

Hago una llamada ajax, regresa y la devolución de llamada se parecía a esto

$("#StoreDetailsContainer").html($(tableHtml));
var StoreDetailsTable = $("#StoreDetailsTable");
StoreDetailsTable.tablesorter({ sortList: [[0, 0]], cssChildRow: "SubTable" });
StoreDetailsTable.filtertable({ cssChildRow: "SubTable" });

Sin embargo, este fragmento de código tardó 20 segundos en completarse.

Estaba jugando, cronometrando cosas y apareciendo alertas entre métodos, y de repente, solo tomó 6 segundos. Jugué un poco más para descubrir que si introduje un retraso después de la.html() call, y antes de intentar manipular el DOM, la página se procesó MUCHO más rápido. Ahora se ve así

$("#StoreDetailsContainer").html($(tableHtml));
window.setTimeout(function() {
    var StoreDetailsTable = $("#StoreDetailsTable");
    StoreDetailsTable.tablesorter({ sortList: [[0, 0]], cssChildRow: "SubTable" });
    StoreDetailsTable.filtertable({ cssChildRow: "SubTable" });
}, 100);

También solo toma 6 segundos a pesar de haber agregado una décima de segundo adicional al proceso.

Mi teoría es que porque el DOM no fue procesado completamente por IE por la.html() llame antes de intentar trabajar con él, se está produciendo algún tipo de bloqueo.

Hay una manera de determinar cuándo IE ha terminado de representar lo que se agregó al DOM por.html() así que no necesito usar un valor arbitrario en unsetTimeout ¿llamada