Exécution trop lente !

**kheironn** · 31/10/2008, 12h26

Bonjour,

Je dois modifier une application faite par un collègue afin de la rendre plus performante.

Il s'agit d'un ascx qui est intégré dans un site sharepoint.
Cet ascx en contient un autre (en fait plusieurs autres), ainsi qu'une très grosse tartine de javascript et environ 8 UpdatePanel.

Selon le profil connecté, l'application se met à ramer dramatiquement.
Avec mon profil (droits très limités), tout est rapide. Avec un profil de superviseur - qui a la visibilité sur les 300 employés de la boite - c'est la cata.

les animations sur OnMouseOver mettent une seconde avant de s'afficher, les listes déroulantes : pareil ! et enfin chercher un nom dans une liste de 300 personnes devient un exploit !

Bref, mon boss m'a demandé de rendre la chose plus rapide !

Dans un premier temps, j'ai repris les UpdatePanel en mettant certains en UpdateMode="Conditional" (un gros restant sur Always par obligation).

Enfin chose notable : c'est lentissime sur IE, plus rapide sur FireFox et Chrome.

Je sèche.
Si quelqu'un a une idée pour m'aider à trouver l'origine du problème.

**Pongten** · 31/10/2008, 12h32

Je dirais que le JS ne doit pas y être pour rien...

En plus, si l'appli balance une série de requêtes AJAX dès que tu fais qqch, c'est pas top non plus.

Maintenant, sans code, c'est pas facile à cerner...

En utilisant Firebug pour firefox, tu pourras déjà profiler certaines choses et voir où sont les pertes...

Sinon, il y a également la Trace côté serveur qui pourra te permettre de voir où ton application galère.

**kheironn** · 31/10/2008, 13h03

Merci pour cette réponse.

Pendant ce temps, j'ai fait un tour sur le net tout en mangeant mes petits poids... et là, j'y ai vu pas mal de messages du même genre.

IE 7 est Méga lent avec JS... par contre, mon appli fonctionne aussi bien sur IE6 que sur Firefox. étonnant non ?

Pour tracer, j'ai utilisé Fiddler2, mais cela n'a pas vraiment apporté de réponse.

Ok, je vais voir avec firebug (si les quelques ko dispo sur mon HDD le permettent ! -> c'est quand qu'on me donne une machine digne de ce nom !?)

pour ce qui est du code voici quelques extraits...

Code ASP :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
    <div style="text-align: center;">
        <!-- Menus déroulants : première ligne -->
        <asp:UpdatePanel ID="upnlNomDate" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <uc1:DropDownAjax runat="server" ID="DropDownNom" OnSelect="UserCraSelected" />
                <uc1:DropDownAjax runat="server" ID="DropDownMois" OnSelect="CreerTableauCra" />
                <uc1:DropDownAjax runat="server" ID="DropDownAnnee" OnSelect="CreerTableauCra" />
                <!-- Ecran d'attente -->
                <asp:UpdateProgress runat="server" ID="uprgLoadingNomDate" AssociatedUpdatePanelID="upnlNomDate"
                    DisplayAfter="50" DynamicLayout="false">
                    <ProgressTemplate>
                        <div class="overlayProgress">
                            <div class="modalprogress">
                                <div class="theprogress">
                                    <asp:Image ID="imgLoadingNomDate" runat="server" ImageUrl="~/Image/loading.gif" />
                                </div>
                            </div>
                        </div>
                    </ProgressTemplate>
                </asp:UpdateProgress>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="DropDownNom" />
            </Triggers>
        </asp:UpdatePanel>
        <!-- Menus déroulants : seconde ligne -->
        <asp:UpdatePanel ID="upnlActivity" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <uc1:DropDownAjax runat="server" ID="DropDownDivers" OnSelect="DiversSelected" />
                <uc1:DropDownAjax runat="server" ID="DropDownProjet" OnSelect="ProjetSelected" />
                <uc1:DropDownAjax runat="server" ID="DropDownSousProjet" Visible="false" OnSelect="AjouterLigneCra" />
                <!-- Ecran d'attente -->
                <asp:UpdateProgress runat="server" ID="uprgLoadingActivity" AssociatedUpdatePanelID="upnlActivity"
                    DisplayAfter="50" DynamicLayout="false">
                    <ProgressTemplate>
                        <div class="overlayProgress">
                            <div class="modalprogress">
                                <div class="theprogress">
                                    <asp:Image ID="imgLoadingActivity" runat="server" ImageUrl="~/Image/loading.gif" />
                                </div>
                            </div>
                        </div>
                    </ProgressTemplate>
                </asp:UpdateProgress>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="DropDownNom" />
            </Triggers>
        </asp:UpdatePanel>
    </div>

Code C# :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
        protected void Page_Load(object sender, EventArgs e)
        {
            if (LicenseManager.UsageMode == LicenseUsageMode.Designtime)
                return;
 
            // Met à jour l'affichage des jours : normal, férié, heure sup ...
            //this.RefreshClass();
            if (!IsPostBack)
            {
                #region AJOUT DES FUNCTION JS DE LA PAGE (ICI À CAUSE DE FIREFOX)
                string script = @"
                    function updateValue(item)
                    {// Met à jour la textbox : si elle est vide, insert 1 et place le curseur en fin de textbox
                    // Si elle est déjà remplie, do nothing
                        if(item.value == null || item.value == '')
                        {
                            item.value = '1';
                            try
                            {
                                // Change le caret index de l'élément pour le placer à la fin
                                var range = item.createTextRange();
                                range.move('character', 2);
                                range.select();
                            }catch(ex)
                            {// Ne marche pas sous firefox
                            }
                        }                
                    }
                    function updateTotalSousProjet(textbox, indexTotal, indexProjet, indexJour)
                    {// Met à jour le tableau lors du lost focus d'une textbox    
 
                        var idTotal = prefixeTotal + indexTotal + sufixeTotal
                        var idTotalJourFooter = prefixeJourTotal + indexJour + sufixeJourTotal;
 
                        // Compatibilité IE-firefox
                        var IE = true;
                        var key = textbox.key;
                        if(key == null)
                        {// Firefox
                            // Firefox
                            for (n = 0 ; n < textbox.attributes.length; n ++) 
                            {
                               if(textbox.attributes[n].nodeName == ""key"")
                                {
                                    key = textbox.attributes[n].nodeValue;
                                    break;
                                }
                            }
                            IE = false;
                        }
                        var newValue = parseFloat(textbox.value.replace("","", "".""));
                        if(isNaN(newValue)|| newValue <= 0 || newValue >3.5 )   
                        {// Je demande à voir celui qui arrive à travailler 24.5h dans la meme journée
                            newValue = 0;
                        }
 
                        var oldValue = parseFloat(key.replace("","", "".""));
 
                        if(IE)
                        {   // Total ligne
                            document.getElementById(idTotal).innerText =(parseFloat(document.getElementById(idTotal).innerText.replace("","", ""."")) - oldValue + newValue).toFixed(2).toString().replace(""."","","").replace("",00"", """");
                            // Total footer (jour / jour ouvrable
                            document.getElementById(idTotalFooter).innerText =(parseFloat(document.getElementById(idTotalFooter).innerText.replace("","", ""."")) - oldValue + newValue).toFixed(2).toString().replace(""."","","").replace("",00"", """");
                        }
                        else
                        {   // Total ligne
                            document.getElementById(idTotal).innerHTML =(parseFloat(document.getElementById(idTotal).innerHTML.replace("","", ""."")) - oldValue + newValue).toFixed(2).toString().replace(""."","","").replace("",00"", """");
                            // Total footer (jour / jour ouvrable
                            document.getElementById(idTotalFooter).innerHTML =(parseFloat(document.getElementById(idTotalFooter).innerHTML.replace("","", ""."")) - oldValue + newValue).toFixed(2).toString().replace(""."","","").replace("",00"", """");
                        }
 
 
 
                        if(indexProjet != ""Non"")
                        {
                            // Mise à jour ligne projet
                            var idJourProjet = prefixeJour + indexProjet + prefixeJour2 + indexJour + sufixeJour;
                            var idTotal2 = prefixeTotal + indexProjet + sufixeTotal;
 
                            var oldValueJour = parseFloat(document.getElementById(idJourProjet).value.replace("","", ""."").replace("""",""0""));
                            var newValueJour =  parseFloat((oldValueJour - oldValue + newValue).toFixed(2));
                            document.getElementById(idJourProjet).value = newValueJour.toString().replace(""."","","").replace("",00"", """").replace(""0,"", "","");
                            if(document.getElementById(idJourProjet).value == ""0"")
                                document.getElementById(idJourProjet).value = """";
 
                            if(IE)
                            {
                                // Mise à jour ligne projet total
                                var totaL = parseFloat(parseFloat(document.getElementById(idTotal2).innerText.replace("","", ""."").replace("""",""0"")) - oldValueJour + newValueJour).toFixed(2);
                                document.getElementById(idTotal2).innerText = totaL.toString().replace(""."","","").replace("",00"", """");
                            }else
                            {// Firefox
                                // Mise à jour ligne projet total
                                var totaL = parseFloat(parseFloat(document.getElementById(idTotal2).innerHTML.replace("","", ""."").replace("""",""0"")) - oldValueJour + newValueJour).toFixed(2);
                                document.getElementById(idTotal2).innerHTML = totaL.toString().replace(""."","","").replace("",00"", """");
                            }
                            // Un temps total > 1 => heure sup => à commenter
                            if(newValueJour > 1)
                            {
                                document.getElementById(idJourProjet).className = ""CraBad"";
                            }else
                            {    
                                if(document.getElementById(idJourProjet).title != """")
                                {
                                    if(document.getElementById(idJourProjet).value == 0)
                                        document.getElementById(idJourProjet).className = ""Ferie"";
                                    else
                                        document.getElementById(idJourProjet).className = ""CraBad"";
                                }else
                                {
                                    document.getElementById(idJourProjet).className = ""CraTemps"";
                                }
                            }
 
                        }
                    // Mise à jour total du jour (footer)
                        var textJourFooter = document.getElementById(idTotalJourFooter);
 
                        textJourFooter.value = parseFloat(parseFloat(textJourFooter.value.replace("","", ""."")) - oldValue + newValue).toFixed(2).toString().replace(""."","","").replace("",00"", """");
                        if(textJourFooter.title != """")
                        {
                        // Jour férié ou we
                            if (textJourFooter.value != ""0"")
                            {
                                textJourFooter.className = ""TempsTotalBad"";
                                textbox.className = ""CraBad"";
                            }
                            else
                            {
                                textJourFooter.className = ""Ferie"";
                                textbox.className = ""Ferie"";
                            }
                        }else
                        {// Jour normal
                            if(textJourFooter.value != ""1"")
                            {
                                if(parseFloat(textJourFooter.value.toString().replace("","",""."")) > 1)
                                {
                                    textJourFooter.className = ""TempsTotalBad"";
                                    textbox.className = ""CraBad"";
                                }
                                else
                                {
                                    textJourFooter.className = ""TempsTotal"";
                                    textbox.className = ""CraTemps"";
                                }
                            }
                            else
                            {
                                textJourFooter.className = ""TempsTotalOk"";
                                textbox.className = ""CraTemps"";
                            }
                        }
 
 
                        // Mise à jour de la textbox
                        if(IE)
                        {
                            textbox.key = newValue.toString();
                        }else
                        {
                            // Firefox
                            for (n = 0 ; n < textbox.attributes.length; n ++) 
                            {
                               if(textbox.attributes[n].nodeName == ""key"")
                                {
                                    textbox.attributes[n].nodeValue = newValue.toString();;
                                    break;
                                }
                            }
                        }
 
                        textbox.value = newValue.toString().replace(""."","","").replace(""0,"","","");
                        if(textbox.value == ""0"")
                            textbox.value = """";
 
                        // Mise à jour du total général
                         var LabTotalGeneral = document.getElementById(""idTotalFooter"");
                         LabTotalGeneral.value = parseFloat(parseFloat(LabTotalGeneral.value.replace("","", ""."")) - oldValue + newValue).toFixed(2).toString().replace(""."","","").replace("",00"", """");
 
 
                    }";
 
 
                ScriptManager.RegisterClientScriptBlock(this, typeof(tableauCRA), "Fonction", script, true);
 
                #endregion AJOUT DES FUNCTION JS DE LA PAGE (ICI À CAUSE DE FIREFOX)
            }
        }

voilà ce que mon prédécesseur à fait... (en plus il a fait plein de bug que j'ai dû corriger

)

--------------------------------------------------------------------------

Au fait, une petite précision :
Mon composant tout seul fonctionne correctement et rapidement.
Par contr, dès qu'il est intégré dans son environnement final : SharePoint, c'est la cata...

toujours pas d'autres idéespour optimiser ?

**Discovery312** · 31/10/2008, 19h38

Tu peux probablement regarder du côté de l'accès aux données. En effet, il n'est pas rare de voir des aberrations au niveau de l'architecture de la base provoquant une certaine lenteur au niveau de l'application.

Exécution trop lente !

ASP.NET

Vue hybride

Discussions similaires

Partager

Partager