[Javascript] Lenteur sous IE6 et IE7

[Ter Rowan]

Je développe sous firefox et après moult efforts je suis arrivé à un résultat assez satisfaisant (pour moi) d'ergonomie

Grosso modo, j'utilise les fonctionnalités de drag & drop de scriptaculo (et prototype derrière) pour gérer l'inventaire d'un personnage :

+ Un personnage a des sacs.
+ Un sac a des emplacements pour y mettre des objets et/ou des sacs

du coup je peux

+ déplacer les objets dans un sac (comme wow et certainement les autres mmo)
+ déplacer les objets d'un sac à l'autre (itou comme wow)
+ déplacer les sacs les un dans les autres ( arborescence de sac, comme l'exporateur windows arborescence des répertoires)

sur firefox super, je glisse un objet je le dépose où je veux, j'en ai la larme à l'oeil

sur IE je glisse l'objet et.... ça saccade ça saccade ça saccade et... ça peut marcher (mais comme le curseur est parfois loin de la où on clique, genre latence énorme sur un mmo en plein combat,c'est pas systématique)

Donc là c'est le drame... J'ai morflé pour arriver au résultat, j'en suis tout content, et au premier test de compatibilité, paf le chien

je constate que quand je supprime l'effet de "drop" (je peux glisser mais pas déposer, l'objet revient à sa place), IE est aussi fluide que Firefox

J'ai essayé de fouiller avec google sur ces problèmes mais je n'ai rien vu. Je me suis dit que peut être les librairies que j'utilisais étaient foireuses mais avant de tout remettre en cause (et de repasser tout le code) je fais appel à vous.

Avez vous, dans vos expériences javascript eu des comportements de ce type avec IE ? et... si oui, avez vous trouvez une solution autre que la simplification à outrance du besoin initial ?

[Bladrak]

Suggérer à tes utilisateurs de passer sous Firefox ?

Plus sérieusement (même si je reste convaincu que la solution ci-dessus reste la meilleure), faudrait que tu nous montres le code source pour voir ce qui peut pêcher Mais IE c'est une daube

P.S. : Tu peux aussi leur proposer Safari, No.1 sur la gestion du JS à ce qu'il paraît

[Ter Rowan]

je ne veux pas me priver de la population IEèsque :non: j'ai fait un petit tour de mes camarades certains sont sous IE alors qu'ils sont dans la cible (des joueurs potentiels)


concernant le code, je ne suis pas sur que cela aide mais voici :

Code :

Event.observe(window, 'load', initTriListeSacs, false);

/*                       gestion liste des Sacs                                              */

function initTriListeSacs()
{

  var listeSacs= document.getElementsByClassName('listeSacs');

  for (var i=0;  listeSacs[i] ; i++)
  {
    var sac =listeSacs[i];

    /// le déplacement
    if (sac != $('listeSacs_0_25')) // on ne peux pas bouger le personnage
    {
      new Draggable(sac,
      {
        revert : true,
        handle : "handle"
      });
    
      /// le plier/déplier
      Event.observe(item.down('img'),'click',plier);
      /// clic sur image du sac
      Event.observe(item.down('img').next('img'),'dblclick',selectionSacEvent);
    
    }
   else
      /// clic sur image du personnage (il n'y a pas de plier déplier ni d image associée)
     Event.observe(item.down('img'),'dblclick',selectionSacEvent);
    
    /// la réception
    Droppables.add(sac,
    {
      accept: ['listeSacs','contenuDetailSac', 'contenuDetailSol' ],
      onDrop: function(entree)
      {
        if (Element.hasClassName( entree, 'listeSacs' ) )
        {
          Ajax_DeplaceSac(entree, this);
        }
        else if (Element.hasClassName( entree , 'contenuDetailSac' ) )
        {
          Ajax_ObjetChangeSac(entree, this);
        }
        else if (Element.hasClassName( entree, 'contenuDetailSol' ))
        {
//  pas encore fait
        alert('le sol vers un sac');
        }
        else alert("ailleurs");
      }
    });

  }
}  /// initTriListeSacs

(y a deux trois indentations qui ratent et peut être quelques erreurs de programmation, j ai copié une version de debuggage un peu pourrie je teste au bureau et essaie de soigner, le vrai code propre est à la maison :p )

grossièrement, ce qui rame c'est :

Droppables.add(sac,
{
accept: ['listeSacs','contenuDetailSac', 'contenuDetailSol' ],
onDrop: function(entree)
{
}
}

les fonctions ajax marche nickel, tant sous ie que sous ff, c'est vraiment l'aspect déplacement (donc avant l'appel des fonctions ajax) qui rament

[Sephi-Chan]

Peut-être pourrais-tu nous présenter ton code via Pastebin, que l'on puisse voir d'où le problème peut venir, si c'est lié à ton code ou plutôt à la bibliothèque (ce dont je doute), etc.

Sinon tu peux regarder du côté de MooTools et de sa classe Drag (la documentation est mal fichue mis en cherchant un peu tu trouveras peut-être des exemples d'application des méthodes).

Tu as égalemet jQuery qui propose ça avec Droppable (démo).


Sephi-Chan

[Ter Rowan]

pastebin ? connait pas qu'est ce ?

ben je suis tombé sur mootools et en fait, en regardant les exemples, il semble qu'il y est le même soucis.

pour les exemples bidons ça marche très bien (peu de ligne, pas trop d'interaction, etc...) mais je suis tombé sur une arborescence et la un peu les mêmes soucis que moi


je ne pense donc pas que ça vienne de la librairie en tant que telle mais bien de ie qui est "chiant", mais qui a peut être une solution "spéciale"

précision importante, l'arborescence des sacs (ou des répertoires) se fait par des

Code :

<ul> sac 1
  <li> <ul> sac 2 dans sac 1
      <li> <ul> sac 3 dans sac 2 </ul></li>
      <li> <ul> sac 4 dans sac 2 </ul></li>
  <ul></li>
  <li> <ul> sac 5 dans sac 1
      <li> <ul> sac 6 dans sac 5 </ul></li>
  <ul></li>
</ul>

évidemment c'est du faux code mais pour illustrer