Reputation: 4072
IE works very slow when there is a chunk of invalid html code inside an UpdatePanel. Interesting point: when the ugly html is cleared (jQuery: $('#Content').empty()) before partial postback, IE runs pretty fast and does not show "A script..." message.
There are two buttons in the example. The first one (Async) do simple partial postback and causes described problem. The second one (Async with clear) clears div with the ugly html and then executes partial postback - without any problems!
A solution could be to use iframe and load the ugly html into iframe. I am more interested in explanation of such behavior.
Example ASPX markup:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="LongRunningJavascript._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" ID="ScriptManager1">
<Scripts>
<asp:ScriptReference Path="~/Scripts/jquery-1.4.1.min.js" />
</Scripts>
</asp:ScriptManager>
<div>
<script type="text/javascript">
function Remove() {
$('#Content').empty();
}
</script>
<asp:UpdatePanel runat="server" ID="UpdatePanel1" ChildrenAsTriggers="true">
<ContentTemplate>
<asp:Button runat="server" ID="AsyncButton" Text="Async" OnClick="AsyncButton_Click"/>
<asp:Button runat="server" ID="AsyncWithClearButton" Text="Async with clear" OnClick="AsyncButton_Click" OnClientClick="Remove();" />
<div id="Content">
<style> <!-- v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VML);} .shape {behavior:url(#default#VML);} --> </style> <style> <!-- /* Font Definitions */ @font-face {font-family:Wingdings; panose-1:5 0 0 0 0 0 0 0 0 0;} @font-face {font-family:Wingdings; panose-1:5 0 0 0 0 0 0 0 0 0;} @font-face {font-family:Calibri; panose-1:2 15 5 2 2 2 4 3 2 4;} @font-face {font-family:Tahoma; panose-1:2 11 6 4 3 5 4 4 2 4;} @font-face {font-family:Verdana; panose-1:2 11 6 4 3 5 4 4 2 4;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {margin:0cm; margin-bottom:.0001pt; font-size:12.0pt; font-family:"Times New Xxxxx","serif";} a:link, span.MsoHyperlink {mso-style-priority:99; color:blue; text-decoration:underline;} a:visited, span.MsoHyperlinkFollowed {mso-style-priority:99; color:purple; text-decoration:underline;} p.MsoAcetate, li.MsoAcetate, div.MsoAcetate {mso-style-priority:99; mso-style-link:"Text bubliny Char"; margin:0cm; margin-bottom:.0001pt; font-size:8.0pt; font-family:"Tahoma","sans-serif";} span.StylE-mailovZprvy19 {mso-style-type:personal-reply; font-family:"Calibri","sans-serif"; color:#1F497D;} span.TextbublinyChar {mso-style-name:"Text bubliny Char"; mso-style-priority:99; mso-style-link:"Text bubliny"; font-family:"Tahoma","sans-serif";} .MsoChpDefault {mso-style-type:export-only; font-size:10.0pt;} @page WordSection1 {size:612.0pt 792.0pt; margin:70.85pt 70.85pt 70.85pt 70.85pt;} div.WordSection1 {page:WordSection1;} --> </style> <div class="WordSection1"> <p class="MsoNormal"><span style="FONT-SIZE: 11pt; COLOR: #1f497d; FONT-FAMILY: 'Calibri','sans-serif'"> <o:p> </o:p> <p class="MsoNormal"><span style="FONT-SIZE: 11pt; COLOR: #1f497d; FONT-FAMILY: 'Calibri','sans-serif'">Xxxx xx </span><span style="FONT-SIZE: 11pt; COLOR: #1f497d; FONT-FAMILY: Wingdings">J</span><span style="FONT-SIZE: 11pt; COLOR: #1f497d; FONT-FAMILY: 'Calibri','sans-serif'"> <o:p></o:p> <p class="MsoNormal"><span style="FONT-SIZE: 11pt; COLOR: #1f497d; FONT-FAMILY: 'Calibri','sans-serif'"> <o:p> </o:p> <p class="MsoNormal"><span style="FONT-SIZE: 11pt; COLOR: #1f497d; FONT-FAMILY: 'Calibri','sans-serif'">Xxxxx <o:p></o:p> <p class="MsoNormal"><span style="FONT-SIZE: 11pt; COLOR: #1f497d; FONT-FAMILY: 'Calibri','sans-serif'"> <o:p> </o:p> <p class="MsoNormal"><b><span style="FONT-SIZE: 10pt; FONT-FAMILY: 'Tahoma','sans-serif'">From:</span></b><span style="FONT-SIZE: 10pt; FONT-FAMILY: 'Tahoma','sans-serif'"> [email protected] <br /> <b>Sent:</b> Tuesday, February 01, 2011 4:06 PM<br /> <b>To:</b> XXXXX Xxxxx<br /> <b>Subject:</b> test Akce multimediální přehrávače. <o:p></o:p></span></p> <p class="MsoNormal"> <o:p> </o:p> </?xml:namespace> <p class="MsoNormal" style="MARGIN-BOTTOM: 12pt"><br /> <br /> ___________________________________________________________________________<br /> Od: [email protected]<br /> Přijato: 31.01.2011 01:20:44<br /> Komu: [email protected]<br /> Předmět: Akce multimediální přehrávače. <o:p></o:p></p> <p class="MsoNormal"><i><span style="FONT-SIZE: 24pt; COLOR: navy"><img id="_x0000_i1097" height="32" src="cid:avecom_7new1.JPG" width="32" /><em><span style="TEXT-DECORATION: underline">doporučuje...</span></em></span></i> <o:p></o:p></p> <div> <div> <div> <div> <p class="MsoNormal"> <o:p></o:p></p></div> <div> <p class="MsoNormal">Neumí Vaą televizor přehrávat přímo z flashdisku nebo externího HDD ??? <o:p></o:p></p></div> <div> <p class="MsoNormal">Připravili jsme pro Vás multimediální přehrávače, díky kterým si budete moci uľít Vaąe oblíbené filmy, hudbu a fotografie přímo na Vaąí TV, monitor (s podporou HDMI a DVI) <o:p></o:p></p></div> <div> <p class="MsoNormal">Jednoduché připojování umoľňuje proměnit USB flashdisky, externí HDD a pamě»ové karty na skutečná multimediální úloľiątě. <b><span style="FONT-SIZE: 11.5pt; COLOR: black"> <o:p></o:p> <div> <div class="MsoNormal" style="TEXT-ALIGN: center" align="center"><b><span style="FONT-SIZE: 11.5pt; COLOR: black"> <hr align="center" width="100%" size="2" /> </span></b></div></div> <div> <div> <div> <div> <div> <div> <div> <div> <div> <div> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia">GENIUS Media Player 200, HDMI, přehrávání hudby, videa, fotek z pamě»ových karet, externích HDD. <o:p></o:p></span></b></p></div></div> <div> <div> <div> <div> <div> <div> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: red"><img id="_x0000_i1099" height="32" src="cid:37158a.jpg" width="32" /></span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia"> <o:p></o:p> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: red">Cena: 999,00Kč bez DPH </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: blue">(1 199,00Kč s DPH)</span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia"> <o:p></o:p> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia"> <o:p></o:p> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: black">Kompaktní přehrávač, který si poradí se spousty multimediálními formáty. Podporuje video soubory ve formátech DVD disků, pokročilý MPEG-4 formát (H.264), oblíbené komprese DivX a XviD a rovněľ i formáty Real Media v rozliąení aľ 1024 x 576 bodů. Z hudebních souborů jsou to pak např. populární MP3 a WMA. V neposlední řadě přehrávač dovolí i prohlíľení obrazářů a fotografií ve formátech BMP, JPEG a PNG. Nechybí podpora textových souborů a několik formátů titulek. Ke svému televizoru přehrávač připojíte pomocí HDMI nebo komponentního výstupu. V rozhraní potěąí USB vstup pro připojení externích datových úloľią» a slot na pamě»ové karty typu MS/SC/MMC. Přehrávač je dodáván s dálkovým ovladačem.<br /> <br /> </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: blue">Podporované formáty:<br /> Video: </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: black">RM/RMVB, MPEG 1/2 (DAT, VOB, MOV), MPEG4 (AVI, DIVX , XVID), </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: blue">Audio: </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: black">MP3, WMA, AAC, AC3, WAV, </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: blue">Foto: </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: black">BMP, JPEG, PNG, </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: blue">Text: </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: black">TXT, SRT, SUB, SSA, ASS, SMI<br /> </span></b><strong><span style="FONT-SIZE: 11.5pt; COLOR: blue">Rozhraní: </span></strong><b><span style="FONT-SIZE: 11.5pt; COLOR: black">1x HDMI výstup, 1x komponentní výstup (Y, Pr, Pb), 1x kompozitní A/V výstup (RCA konektory), 1x USB vstup, 1x slot na pamě»ové karty MS/SD/MMC<br /> </span></b><strong><span style="FONT-SIZE: 11.5pt; COLOR: blue">Rozměry: </span></strong><b><span style="FONT-SIZE: 11.5pt; COLOR: black">27 x 35 x 7 cm (V x © x H)<br /> </span></b><strong><span style="FONT-SIZE: 11.5pt; COLOR: blue">Hmotnost: </span></strong><b><span style="FONT-SIZE: 11.5pt; COLOR: black">1,3 kg<br /> </span></b><strong><span style="FONT-SIZE: 11.5pt; COLOR: blue">Dodávané přísluąenství: </span></strong><b><span style="FONT-SIZE: 11.5pt; COLOR: black">Dálkový ovladač</span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia"> <o:p></o:p> <div> <div> <p class="MsoNormal"><b><span style="COLOR: black; TEXT-DECORATION: underline">Kód zboľí:</span><span style="COLOR: blue"> 37158</span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: black"> <o:p></o:p></span></b></p></div></div> <div> <div> <div> <p class="MsoNormal"><b><span style="COLOR: black">Moľnost objednání (po registraci) a podrobný popis </span><span style="COLOR: blue; TEXT-DECORATION: underline"><a href="http://www.avekom.cz/product/37158/2/genius-media-player-200-hdmi-prehravani-hudby-videa-fotek-z-pametovych-karet-externich-hdd">zde</a></span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: black"> <o:p></o:p> <div> <div> <div> <div> <div> <div> <div class="MsoNormal" style="TEXT-ALIGN: center" align="center"><b><span style="FONT-SIZE: 11.5pt; COLOR: black"> <hr align="center" width="100%" size="2" /> </span></b></div> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia">ASUS O!PLAY MINI multimedialni prehravac FullHD 1080p USB (MINI/1A/PAL/HDMI/AS mediaplayer) <o:p></o:p></span></b></p></div> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia"><img id="_x0000_i1101" height="32" src="cid:37632.jpg" width="32" border="0" /> <o:p></o:p></span></b></p></div> <div> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: red">Cena: 1 299,00Kč bez DPH </span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: blue">(1 599,00Kč s DPH)</span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia"> <o:p></o:p> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: fuchsia"> <o:p></o:p> <div> <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: black">Výrazně zmenąená verze populárního multimediálního přehrávače Asus O!Play, která váľí pouze 175 g a vejde se vám do dlaní! I tak si přehrávač zachoval svou největąí přednost a podporuje Full HD rozliąení 1080p a 7.1kanálový zvuk Dolby TrueHD, který zaručuje audiovizuální záľitky srovnatelné s návątěvou kina. Podporuje celou řadu video formátů v populárních kodecích XviD, DivX i v pokročilém H.264 jako např. AVI, VOB (pro DVD), MPG, MP4 či vysoce kvalitní MKV. Neméně početná podpora formátů se týká i audio souborů, které si budete moci přehrávat např. MP3, WAV, OGG, WMA nebo AAC. Nechybí moľnost prohlíľení digitálních fotografií JPEG, obrázků BMP, GIF a TIFF.<br /> Jelikoľ přehrávač disponuje opravdu miniaturními rozměry, tak ho není moľné osadit interním pevným diskem. Datový obsah vąak můľete přehrávači dodávat pomocí flashdisků, externích HDD anebo pamě»ových karet několika druhů, díky přednímu USB 2.0 portu respektive vestavěné čtečce karet. Propojení s televizorem obstará HDMI výstup ve verzi 1.3 nebo komponentní a kompozitní výstup. Optický digitální audio výstup dobře poslouľí např. k posílání digitálního signálu do vaąeho receiveru. Přehrávač je dodáván s dálkovým ovladačem.<br /> <br />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
Code behind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace LongRunningJavascript
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void AsyncButton_Click(object sender, EventArgs e)
{
}
}
}
Tested in IE6 and IE8, ASP.NET 3.5, IIS7.5 (integrated).
Upvotes: 0
Views: 701
Reputation: 1961
We ran into the same situation. There are a few things that we did:
There is also a dirty trick if you can't optimize the code, add within the long running piece of code in your client a call to the web server, even if it is just to a keep alive do nothing web service. The browser will think that it is a new request and restart the timer. I am ashamed giving this option, which is not the correct way, but if it makes your life simpler and the user can wait then it may save you a lot of time of profiling and optimizing.
Upvotes: 0
Reputation: 8407
This is the clear code by ms
function Sys$WebForms$PageRequestManager$_updatePanel(updatePanelElement, rendering) {
for (var updatePanelID in this._scriptDisposes) {
if (this._elementContains(updatePanelElement, document.getElementById(updatePanelID))) {
var disposeScripts = this._scriptDisposes[updatePanelID];
for (var i = 0, l = disposeScripts.length; i < l; i++) {
eval(disposeScripts[i]);
}
delete this._scriptDisposes[updatePanelID];
}
}
Sys.Application.disposeElement(updatePanelElement, true);
updatePanelElement.innerHTML = rendering;
}
It is doing quite more stuff than jquery, since you might have initialized scripts in the updatepanel, that would be disposed. After that, setting just innerHTML is not the best way, so maybe it´s little slow.
If you use jquery to clear the stuff, and you may have scripts loaded into it, then they will not be disposed (destroyed)...
You could find that code and check if it´s the section what makes this slowness, i dont know.
Upvotes: 1