Discussion :

[Mako 5013]

Bonjour,

Je suis actuellement en train de faire une sorte de migration d'une application existante (J2EE, STRUTS, JSP) pour inclure Ext JS pour toute la partie présentation. Tout se passait bien (ou presque), mais plus j'avance, plus j'ai un problème évident de performance. En effet, le chargement de mes pages est vraiment lent (plusieurs secondes), et même une fois ce long chargement effectué, la première fois que je passe sur un bouton par exemple, je dois encore attendre plusieurs secondes pour que le tooltips apparaissent (idem pour dérouler la première combo, le premier menu contextuel, etc.).

J'aimerais comprendre d'où peut venir un tel problème, qui est bien trop handicapant pour les clients. Une première piste pourrait venir de l'architecture de mes écrans. En gros, j'ai une page jsp qui me définit trois parties (avec un viewport), dans lesquelles je charge d'autres pages jsp, dans lesquelles je peux également avoir de l'Ext JS. Donc au final, le code source de ma page html comporte plusieurs ext.onReady, et je me demandais si cela pouvait être un élément de réponse.

Merci à tout ceux qui auront eu le courage de lire jusqu'ici, et qui pourront m'éclairer sur ce problème.

Mako

[takitano]

Ola,

Je ne sais pas trop koi t'indiquer ...
Ca arrive d'avoir des ralentissement ...
je ne pense pas que ce soit les onready ...

tu dois avoir des fonction qui doivent tourner dans le vide ...
sur une action, par exemple un click,
mesure le temps de chaque fonction appelé afin de déterminer les endroit ou ca ram ...

[Mako 5013]

Bonjour,

Ca arrive d'avoir des ralentissement ...
je ne pense pas que ce soit les onready ...

C'est plus que des ralentissements à ce niveau-là...Entre 3 et 5 secondes d'attentes pour le premier tooltip/menu contextuel/liste de combo...

Par contre, cela me rassure que les onReady n'en soient pas la cause.

tu dois avoir des fonction qui doivent tourner dans le vide ...

Je ne pense pas. J'ai vraiment très peu de fonctions, qui sont très simples et ne sont appelées qu'en réponse à un évènement (clic sur un bouton le plus souvent).

sur une action, par exemple un click,
mesure le temps de chaque fonction appelé afin de déterminer les endroit ou ca ram ...

Ça rame à deux moments. Le chargement de la page est très lent (plusieurs secondes, et il n'y a pas d'images/vidéos ou autres), et comme mentionné ci-dessus, l'initialisation des tooltips, des menus contextuels ou encore des listes de combo est également handicapant.

Est-il possible qu'il y ait une histoire de cache qui intervienne ? En tout cas, toutes les pistes sont les bienvenues...

Mako

[takitano]

ok ...

2 questions me viennent a l esprit ...

1. combien de panels (ou elements similaire comme le formPanel, grid ...) sont généré ?
2. Est ce que tout les tootip, menuContext sont généré dans le onReady ?

[Mako 5013]

1. combien de panels (ou elements similaire comme le formPanel, grid ...) sont généré ?

Au final, sur une page, j'ai mes trois régions (un panel par région). Puis, à l'intérieur de tout ça, j'ai 3-4 panels (formPanel et gridPanel inclus). Donc un total de 6-7 panels en prenant en compte tous les niveaux.

2. Est ce que tout les tootip, menuContext sont généré dans le onReady ?

Les tooltips sont simplement des attributs donnés lors de la création de mes panels, pour les boutons. Par exemple, pour un formPanel, j'ai deux boutons (submit et réinitialiser), déclarés comme suit :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
var formPanel = new Ext.form.FormPanel({
     // Config de mon formPanel
     items: [{
          // les éléments de mon formPanel
     }],
     buttons: [{
          text: 'Submit',
          tooltip: 'Envoyer votre formulaire',
          handler: function {
               formPanel.submit();
          }
     }]
});

Tout ceci étant dans mon onReady() bien entendu. Pour ce qui est du menu contextuel, c'est dans ma grille, et il est déclaré un peu de la même manière :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
var gridPanel = new Ext.grid.GridPanel({
     // Config de ma grille
     listeners: {
          rowcontextmenu: function(grid, index, event) {
               var menu = new Ext.menu.Menu({
                    style: 'overflow: visible',
                    items: [{
                         // Plusieurs 'textfield' avec gestion du onClick
                    }]
               });
          }
     }
});

J'avoue que c'est sans doute assez laid comme façon de procéder...

Mako

[takitano]

avec mon premier post, essayes de trouver l'origine de ton problème ...