Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1090 connectés 

  FORUM HardWare.fr
  Programmation
  XML/XSL

  XML/XSL Probleme de vitesse d'execution Javascript

 
 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

XML/XSL Probleme de vitesse d'execution Javascript

n°1348513
guinchy
Posté le 18-04-2006 à 08:36:21  profilanswer
 

Bonjour,
 
Dans une feuille de transformation XSL générant du HTML,
j'ai une perte considerable de temps d'execution par l'ajout  
d'evenements javascript dans un <td>.
 
J'espere de pas etre le seul a avoir rencontrer ce probleme
 
Merci d'avance
 

mood
Publicité
Posté le 18-04-2006 à 08:36:21  profilanswer
 

n°1348525
guinchy
Posté le 18-04-2006 à 09:28:30  profilanswer
 

Pour plus de précisions:
 
j'ajoute a chaque boucle de génération  les evenements "onclick", "onmouseover", "onmouseout" à un <td>.
Il y a environ 150 passages dans boucles.
la page html met environ 3 fois plus de temps à s'afficher par l'ajout
de ces evenements.
Quelqu'un aurait il une idée?

n°1348551
anapajari
s/travail/glanding on hfr/gs;
Posté le 18-04-2006 à 09:54:23  profilanswer
 

comprends pas exactement :o
Tu as un flux xml, tu le transformes en html via xsl, jusque là ça va...
Ensuite tu ajoutes tes evenements en js ou alors tes "evenements" ont été ajoutés lors de la transformation?

n°1348553
guinchy
Posté le 18-04-2006 à 09:58:46  profilanswer
 

Mes evenements sont ecrits dans ma feuille xsl.
 
 
voici mon code :
 
<xsl:template match="REFQX">
<xsl:param name="la_ref" select="."/>
  <xsl:param name="val_ARTLIB" select="../ITNBR"/>
  <xsl:param name="htj" select="../HTJOAX"/>
  <xsl:param name="chemin_image" select="../chemin_image"/>
   
  <xsl:param name="prix" select="../TARPU"/>
   <xsl:if test="$htj=' ' ">
    <td  
    onclick="window.location='/IntranetJLC/servlet/article?codeArticle={$la_ref}&#038;sessionID={$sessionID}&#038;roleTarif={$roleTarif}&#038;codeDevise={$codeDevise}&#038;typeTarif={$typeTarif}&#038;Langue={$langue}&#038;joaillerie=non&#038;ref6000={$val_ARTLIB}&#038;prix={$prix}' "  
    onmouseout="HideBulle(this)"  
    onmouseover="LoadBulle('{$detail}','{$reference}','{$val_ARTLIB}','{$la_ref}','{$chemin_image}',this)"  
    NOWRAP='1'  
    width='80'  
    class="artref" >
     <xsl:value-of select="$la_ref" />
    </td>

n°1348567
anapajari
s/travail/glanding on hfr/gs;
Posté le 18-04-2006 à 10:10:29  profilanswer
 

Ok et donc ce qui est lent c'est le "rendu" de la page dans le navigateur?
 
Alors la réponse à la question: "Est-ce normal qu'une page contenant 150 lignes de tableau mette plus de temps a s'afficher avec des handlers d'evenements sur chacune des lignes que sans ces handlers?"
La réponse est : OUI.
 
Maintenant as-tu vraiment besoin de javascript??? Ne pourrais-tu pas faire la même chose juste avec des css ( ce qui résoudrait le problème)!

n°1348585
guinchy
Posté le 18-04-2006 à 10:31:51  profilanswer
 

En fait je n'ai pas le choix. je suis obliger d'utiliser javascript car avec css je ne peux pas gerer d'evenements.
 
Ce qui est long est la transformation avec xslt. Ce code ecrit dans une servlet ou une page php ne prend pas beaucoup de temps.
 
Je sais pas s'il existe une astuce pour eviter de faire des appels javascipts dans la feuille xsl.

n°1348735
esox_ch
Posté le 18-04-2006 à 13:07:50  profilanswer
 

Mais ton xslt il appelle rien du tout [:pingouino] , il ecrit juste du texte ... ce que ca represente, lui il s'en fou .. Apres c'est ton navigateur qui va s'en occuper.
Donc si ton probleme est que ça met trop longtemps a ecrire le JS ... bein c'est normal .. tu lui fais ecrire le double [:pingouino]. Si c'est l'execution , c'est normal aussi


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
n°1349136
rx__
Paint It Black
Posté le 18-04-2006 à 19:34:20  profilanswer
 

As-tu vraiment besoin de tous ces attributs dans chaque handler? Des trucs comme sessionID, codeDevise, langue, ...
Tu pourrais avoir une fonction javascript unique qui fait le window.location en passant les quelques paramètres qui changent.

n°1349941
guinchy
Posté le 19-04-2006 à 17:45:43  profilanswer
 

Je pense ne pas avoir été clair et precis:
 
voici le debut de ma feuille xslt
 
 

Code :
  1. <?xml version="1.0" encoding="ISO-8859-1"?>
  2. <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  3. <xsl:output method="html" version="1.0" encoding="ISO-8859-1" indent="yes"/>
  5. <xsl:variable name='sessionID' select="/document/sessionid"/>
  6. <xsl:variable name='roleTarif' select="/document/roleTarif"/>
  8. <xsl:variable name='codeDevise' select="/document/codeDevise"/>
  9. <xsl:variable name='typeTarif' select="/document/typeTarif"/>
  10. <xsl:variable name='langue' select="/document/Langue"/>
  12. <xsl:variable name='detail' select="/document/detail"/>
  13. <xsl:variable name='reference' select="/document/reference"/>
  14.  
  15. <xsl:variable name='codeFamille' select="/document/ARTCNA/@codeFamille"/>
  16. <xsl:variable name='codeRLP' select="/document/ARTCNA/ARTCFA/@codeRLP"/>
  17. <xsl:variable name='codeLP' select="/document/ARTCNA/ARTCFA/ARTCLP/@codeLP"/>
  18. <xsl:variable name='codeGenre' select="/document/ARTCNA/ARTCFA/ARTCLP/ARTCMO/@codeGenre"/>
  21. <xsl:template match="document">
  22.   <html>
  23.    <head>
  24.     <META http-equiv="Pragma" content="no-cache">
  25.     </META>
  26.        
  27.     <LINK REL="stylesheet" TYPE="text/css" HREF= "/IntranetJLC/css/classification.css">
  28.     </LINK>
  29.    
  30.     <script src="/IntranetJLC/js/classificationHTML.js" language="JavaScript"></script>

 

 
On peux remarquer que je fais appel a un ficier de fonction javascript "classificationHTML.js"
dont voici le code
 
 

Code :
  1. [#7f0055 size=2]
  2. var [/#7f0055 size=2][size=1]IB=[/size][#7f0055 size=2]new [/#7f0055 size=2][size=1]Object;[/size][#7f0055 size=2]
  3. var [/#7f0055 size=2][size=1]posX=0;[/size][#7f0055 size=2]
  4. var [/#7f0055 size=2][size=1]posY=0;[/size][#7f0055 size=2]
  5. var [/#7f0055 size=2][size=1]xOffset=10;[/size][#7f0055 size=2]
  6. var [/#7f0055 size=2][size=1]yOffset=10;[/size][#7f0055 size=2]
  7. function [/#7f0055 size=2][size=1]LoadBulle(refArtQ, path,x)[/size][#7f0055 size=2]{
  9. var [/#7f0055 size=2][size=1]color = [/size][#8e00ff size=2]"#DDDDDD"[/#8e00ff size=2][size=1];
  10. x.bgColor= color;
  13. [/size][#7f0055 size=2]var [/#7f0055 size=2][size=1]monImage = [/size][#7f0055 size=2]new [/#7f0055 size=2][size=1]Image();
  14. monImage.src = path+[/size][#8e00ff size=2]'/'[/#8e00ff size=2][size=1]+refArtQ+[/size][#8e00ff size=2]'.jpg'[/#8e00ff size=2][size=1];
  15. [/size][#3f5fbf size=2]// Il y a une image  
  16. [/#3f5fbf size=2][size=1]AffBulle([/size][#8e00ff size=2]'<CENTER><img src=\''[/#8e00ff size=2][size=1]+monImage.src+[/size][#8e00ff size=2]'\' onerror="LoadBulleNO(\''[/#8e00ff size=2][size=1]+refArtQ+[/size][#8e00ff size=2]'\', \''[/#8e00ff size=2][size=1]+path+[/size][#8e00ff size=2]'\')" ></CENTER>'[/#8e00ff size=2][size=1]);[/size][#7f0055 size=2]
  17. }[/#7f0055 size=2][size=1][/size][#7f0055 size=2]
  18. function [/#7f0055 size=2][size=1]LoadBulleNO(refArtQ, path)[/size][#7f0055 size=2]{
  19. var [/#7f0055 size=2][size=1]monImage = [/size][#7f0055 size=2]new [/#7f0055 size=2][size=1]Image();
  20. monImage.src = path+[/size][#8e00ff size=2]'/NO_'[/#8e00ff size=2][size=1]+refArtQ+[/size][#8e00ff size=2]'.jpg'[/#8e00ff size=2][size=1];
  21. [/size][#3f5fbf size=2]// Il y a une image Non Officielle  
  22. [/#3f5fbf size=2][size=1]AffBulle([/size][#8e00ff size=2]'Unofficial image ... <br>'[/#8e00ff size=2][size=1]+[/size][#8e00ff size=2]'<CENTER><img src=\''[/#8e00ff size=2][size=1]+monImage.src+[/size][#8e00ff size=2]'\' onerror="LoadBulleErr()" ></CENTER>'[/#8e00ff size=2][size=1]);[/size][#7f0055 size=2]
  23. }[/#7f0055 size=2][size=1][/size][#7f0055 size=2]
  24. function [/#7f0055 size=2][size=1]LoadBulleErr()[/size][#7f0055 size=2]{
  25. [/#7f0055 size=2][#3f5fbf size=2]// Il n'y a pas d'image  
  26. [/#3f5fbf size=2][size=1]AffBulle([/size][#8e00ff size=2]'Sorry, this picture is unavailable'[/#8e00ff size=2][size=1]);[/size][#7f0055 size=2]
  27. }[/#7f0055 size=2][size=1]
  28. [/size][#7f0055 size=2]
  29. function [/#7f0055 size=2][size=1]AffBulle(texte) [/size][#7f0055 size=2]{
  30. [/#7f0055 size=2][size=1]contenu=[/size][#8e00ff size=2]"<TABLE border=0 cellspacing=0 cellpadding="[/#8e00ff size=2][size=1]+IB.NbPixel+[/size][#8e00ff size=2]"><TR bgcolor='"[/#8e00ff size=2][size=1]+IB.ColContour+[/size][#8e00ff size=2]"'><TD><TABLE border=0 cellpadding=2 cellspacing=0 bgcolor='"[/#8e00ff size=2][size=1]+IB.ColFond+[/size][#8e00ff size=2]"'><TR><TD><FONT size='-1' face='arial' color='"[/#8e00ff size=2][size=1]+IB.ColTexte+[/size][#8e00ff size=2]"'>"[/#8e00ff size=2][size=1]+texte+[/size][#8e00ff size=2]"</FONT></TD></TR></TABLE></TD></TR></TABLE>&nbsp;"[/#8e00ff size=2][size=1];
  31. [/size][#7f0055 size=2]var [/#7f0055 size=2][size=1]finalPosX=posX-xOffset;
  32. [/size][#7f0055 size=2]if [/#7f0055 size=2][size=1](finalPosX<0) finalPosX=0;
  33. [/size][#7f0055 size=2]if [/#7f0055 size=2][size=1](document.getElementById([/size][#8e00ff size=2]"bulle"[/#8e00ff size=2][size=1])!=[/size][#7f0055 size=2]null[/#7f0055 size=2][size=1])[/size][#7f0055 size=2]{
  34. [/#7f0055 size=2][size=1]document.getElementById([/size][#8e00ff size=2]"bulle"[/#8e00ff size=2][size=1]).innerHTML=contenu;
  35. document.getElementById([/size][#8e00ff size=2]"bulle"[/#8e00ff size=2][size=1]).style.top=posY+yOffset;
  36. document.getElementById([/size][#8e00ff size=2]"bulle"[/#8e00ff size=2][size=1]).style.left=finalPosX;
  37. document.getElementById([/size][#8e00ff size=2]"bulle"[/#8e00ff size=2][size=1]).style.visibility=[/size][#8e00ff size=2]"visible"[/#8e00ff size=2][size=1];
  38. [/size][#7f0055 size=2]}
  40. }[/#7f0055 size=2][size=1][/size][#7f0055 size=2]
  41. function [/#7f0055 size=2][size=1]HideBulle(x) [/size][#7f0055 size=2]{
  43. var [/#7f0055 size=2][size=1]color = [/size][#8e00ff size=2]"#FFFFFF"[/#8e00ff size=2][size=1];
  44. x.bgColor= color;
  46. document.getElementById([/size][#8e00ff size=2]"bulle"[/#8e00ff size=2][size=1]).style.visibility=[/size][#8e00ff size=2]"hidden"[/#8e00ff size=2][size=1];
  47. [/size][#7f0055 size=2]
  48. }[/#7f0055 size=2][size=1][/size][#7f0055 size=2]
  49. function [/#7f0055 size=2][size=1]InitBulle(ColTexte,ColFond,ColContour,NbPixel) [/size][#7f0055 size=2]{
  50. [/#7f0055 size=2][size=1]IB.ColTexte=ColTexte;IB.ColFond=ColFond;IB.ColContour=ColContour;IB.NbPixel=NbPixel;
  51. document.write([/size][#8e00ff size=2]"<DIV id='bulle' style='position:absolute;top:0;left:0;visibility:hidden'></DIV>"[/#8e00ff size=2][size=1]);
  52. document.onmousemove=getMousePos;
  53. [/size][#7f0055 size=2]
  54. }[/#7f0055 size=2][size=1][/size][#7f0055 size=2]
  56. function [/#7f0055 size=2][size=1]getMousePos(e) [/size][#7f0055 size=2]{
  57. if [/#7f0055 size=2][size=1](document.all) [/size][#7f0055 size=2]{
  58. [/#7f0055 size=2][size=1]posX=event.x+document.body.scrollLeft; [/size][#3f5fbf size=2]//modifs CL 09/2001 - IE : regrouper l'?v?nement
  59. [/#3f5fbf size=2][size=1]posY=event.y+document.body.scrollTop;
  60. [/size][#7f0055 size=2]}
  61. else {
  62. [/#7f0055 size=2][size=1]posX=e.pageX; [/size][#3f5fbf size=2]//modifs CL 09/2001 - NS6 : celui-ci ne supporte pas e.x et e.y
  63. [/#3f5fbf size=2][size=1]posY=e.pageY;
  64. [/size][#7f0055 size=2]}
  65. }[/#7f0055 size=2]

 

 
 
Voici la partie de ma feuille xsl qui fait appel aux fonctions
 
 

Code :
  1. <xsl:template match="DSLNG">
  2.   <xsl:param name="refQ" select="../REFQX"/>
  3.   <xsl:param name="chemin_image" select="../chemin_image"/>
  4.  
  5.   <td class="artlib" width='330' NOWRAP='1'
  6.   onmouseover="LoadBulle('{$refQ}','{$chemin_image}',this)"
  7.   onmouseout="HideBulle(this)" >
  8.    <xsl:apply-templates/>
  9.   </td>
  10. </xsl:template>

 

On peut remarquer que j'ai reduit les parametres des fonction javascripts
 
 
le template "DSLNG" est appele 150 fois environ
 
 
Mon probleme est que les deux lignes :
 
 
onmouseover="LoadBulle('{$refQ}','{$chemin_image}',this)"
onmouseout="HideBulle(this)" >
 
me font perdre 3 fois plus de temps a l'affichage.
 
je ne comprends pas pourquoi.  
le meme code sans transformation XML->HTML avec xslt est rapide  
 
 
je vous remercie de vos réponses.
 
 

n°1349946
guinchy
Posté le 19-04-2006 à 17:46:37  profilanswer
 

desole pour le code javascript: le rendu est erroné

mood
Publicité
Posté le 19-04-2006 à 17:46:37  profilanswer
 

n°1350152
Profil sup​primé
Posté le 20-04-2006 à 00:16:57  answer
 

Et sinon ca sert à quoi à part être extrèmement compliqué surement pour rien  :pt1cable:  ?


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  XML/XSL

  XML/XSL Probleme de vitesse d'execution Javascript

 

Sujets relatifs
Problème - variable non récupéréeLe '%' du SQL existe-t-il en javascript
creation des instrances d'objet contexte Probleme ?probleme nvu
le XML est-il lu par les navigateurs web?[Delphi] probleme requete nil
[C] Calculer le temps d'exécution d'une boucle.Problème avec fenêtre graphique
Date et heure en JavaScriptHTML probleme avec tableau tres complexe
Plus de sujets relatifs à : XML/XSL Probleme de vitesse d'execution Javascript

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.091 secondes

Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR