ASP.NET UpdatePanel вызывает «Сценарий на этой странице заставляет Internet Explorer работать медленно ...» в IE - PullRequest
Новая
       10

ASP.NET UpdatePanel вызывает «Сценарий на этой странице заставляет Internet Explorer работать медленно ...» в IE

0 голосов
/ 05 февраля 2011

IE работает очень медленно, когда внутри UpdatePanel есть кусок недопустимого HTML-кода.Интересный момент: когда некрасивый html очищается (jQuery: $ ('# Content'). Empty ()) перед частичной обратной передачей, IE работает довольно быстро и не показывает сообщение "A script ...".

В примере есть две кнопки.Первый (Async) выполняет простую частичную обратную передачу и вызывает описанную проблему.Второй (Async with clear) очищает div с помощью уродливого html, а затем выполняет частичную обратную передачу - без проблем!

Решением может быть использование iframe и загрузка уродливого html в iframe.Меня больше интересует объяснение такого поведения.

Пример разметки ASPX: 

<%@ 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>&nbsp;</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>&nbsp;</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>&nbsp;</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'"> xxxx@xxx.xx <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>&nbsp;</o:p> </?xml:namespace>               <p class="MsoNormal" style="MARGIN-BOTTOM: 12pt"><br />              <br />              ___________________________________________________________________________<br />              Od: xxx@xxxxxy.xx<br />              Přijato: 31.01.2011 01:20:44<br />              Komu: xxx@xxxxxy.xx<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">&nbsp;                   <o:p></o:p></p></div>                  <div>                   <p class="MsoNormal">Neumí Vaą televizor přehrávat přímo z&nbsp;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&eacute; filmy, hudbu a fotografie přímo na Vaąí TV, monitor (s podporou HDMI a DVI)&nbsp;                   <o:p></o:p></p></div>                  <div>                   <p class="MsoNormal">Jednoduch&eacute; připojování umoľňuje proměnit USB flashdisky, externí HDD a pamě»ov&eacute; karty na skutečná multimediální úloľiątě.&nbsp;<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:&nbsp;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">&nbsp;                                                <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&eacute; 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&eacute;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&eacute; 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&eacute; 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&eacute; 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 &copy; 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&eacute; 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">&nbsp;37158</span></b><b><span style="FONT-SIZE: 11.5pt; COLOR: black">&nbsp;                                                         <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)&nbsp;a podrobný popis&nbsp;</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" />&nbsp;                                                                    <o:p></o:p></span></b></p></div>                                                                 <div>                                                                  <div>                                                                   <p class="MsoNormal"><b><span style="FONT-SIZE: 11.5pt; COLOR: red">Cena:&nbsp;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">&nbsp;                                                                         <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&eacute; s návątěvou kina. Podporuje celou řadu video formátů v populárních kodecích XviD, DivX i v pokročil&eacute;m H.264 jako např. AVI, VOB (pro DVD), MPG, MP4 či vysoce kvalitní MKV. Nem&eacute;ně početná podpora formátů se týká i audio souborů, kter&eacute; 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&eacute; 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&eacute; č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>

Код: 

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)
        {
        }
    }
}

Протестировано в IE6 и IE8, ASP.NET3.5, IIS7.5 (встроенный).

Ответы [ 2 ]

1 голос
/ 06 февраля 2011

Это чистый код от 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;
    }

Он делает гораздо больше, чем jquery, так как вы могли бы инициализировать скрипты в панели обновления, которые будут удалены.После этого установка только innerHTML будет не лучшим способом, поэтому, возможно, он будет немного медленным.

Если вы используете jquery для очистки содержимого, и в него могут быть загружены скрипты, то они не будут удалены(уничтожено) ...

Вы можете найти этот код и проверить, является ли этот раздел медлительностью, я не знаю.

0 голосов
/ 25 мая 2011

Мы столкнулись с такой же ситуацией.Мы сделали несколько вещей:

  • Разбейте JS, чтобы у нас были файлы меньшего размера, а не один большой js для множества разных вещей
  • Убедитесь, что кэш серверанастроен правильно
  • Профилировал JS (вы можете использовать firebug, инструменты разработчика IE и определить кусок кода, который работал очень медленно, и оптимизировать его

Существует также подвох, еслиВы не можете оптимизировать код, добавив в длительный кусок кода в своем клиенте вызов к веб-серверу, даже если он просто для того, чтобы поддерживать работу, ничего не делать. Браузер будет думать, что это новый запроси перезапустите таймер. Мне стыдно давать эту опцию, которая не является правильным способом, но если она упрощает вашу жизнь и пользователь может ждать, то это может сэкономить вам много времени на профилирование и оптимизацию.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...