Discussion :

[Beginner.]

Salut,

Il y a un point que je ne comprends pas bien dans cette article : https://developer.mozilla.org/fr/doc...useenter_event

Avec des hiérarchies profondes, le nombre d'évènements mouseenter envoyé peut être important et entraîner des problèmes de performances. Dans ce cas, mieux vaut écouter les évènements mouseover.

Je ne comprends pas pourquoi mouseenter pourrait poser des problèmes de performances par rapport à mouseover... J'aurais même dit le contraire en lisant dans le même article ceci :

Bien que mouseover soit similaire, mouseenter est différent et ne remonte pas dans le DOM et qu'il n'est pas envoyé aux descendants lorsque le pointeur passe d'un descendant à l'élément.

En gros si j'attache un mouseover à un parent il sera déclenché à chaque passage d'un descendant à un autre alors que si j'attache un mouseenter il sera déclenché seulement à l'entré dans le parent, à l'intérieur on peut passer d'un descendant à un autre sans déclenchement.

Alors du coup il y a plus de déclenchements avec mouseover alors si j'ai juste besoin de détecter l'entré dans un élément donné alors ce serait plus judicieux (coté performance) d'utiliser mouseenter contrairement à ce qui est dit dans l'article, non ?

Par contre si je voulais faire de la délégation (détecter chaque passage d'un descendant à un autre avec un seul gestionnaire) alors là oui il serait plus performant d'utiliser un mouseover. Avec un mouseenter cela ne serait pas possible avec un seul gestionnaire, il en faudrait un pour chaque descendant et là c'est évidement beaucoup moins bien coté gestion et performance.


Qu'en pensez-vous ?


PS : Cette partie "Avec des hiérarchies profondes, le nombre d'évènements mouseenter envoyé peut être important..." illustrée par une image est-elle correcte ? Y a-t-il vraiment plusieurs évènements mouseenter qui sont envoyés ? Il me semble que c'est le contraire, non ? Il n'y a qu'un évènement mouseenter qui est envoyé et c'est lorsqu'on entre dans l’élément auquel on a attaché l'événement mouseenter...

[Beginner.]

Salut,

Je viens de voir cet article : https://thisthat.dev/mouseenter-vs-mouseover

Dans lequel on peut lire :

Good practice

Because the mouseover event propagates from the child element up through the hierarchy, if you're doing a resource-intensive task on the event you may notice the screen flickering.
It's recommended to use the mouseenter and mouseleave events instead.

Cette fois c'est mouseenter et mouseleave qui sont recommandés !

[javatwister]

Oui, mouseenter est mieux domestiqué; tu auras le même effet en demandant currentTarget avec mouseover;

Mais tout ça, c'est de la théorie... Sans un cas concret problématique, les conséquences sont rarement désastreuses sur les performances ou la fonctionnalité;

[Beginner.]

Ben effectivement mouseenter est préférable si on ne s’intéresse qu'à l'entrée dans un élément donné et non à l'entrée dans chacun de ses descendants du coup justement il ne conviendrait pas si on voulait faire de la délégation (détecter les entrées dans les descendants).

Je pense que dans l'article il se base sur ça :



Pour dire ça :

Avec des hiérarchies profondes, le nombre d'évènements mouseenter envoyé peut être important et entraîner des problèmes de performances. Dans ce cas, mieux vaut écouter les évènements mouseover.

Mais cela n'a pas de sens, pourquoi un mouseenter serait envoyé à chaque élément de la hiérarchie ? Peut-être que l’auteur pré-suppose que l'on aurait auparavant attaché un mouseenter à chaque élément de la hiérarchie (pour pouvoir détecter les entrées dans les descendants) ?

Si oui alors dans ce cas, effectivement, il vaut mieux utiliser un seul mouseover sur le parent (délégation).

[NoSmoking]

Bonjour,

Je ne comprends pas pourquoi mouseenter pourrait poser des problèmes de performances par rapport à mouseover.
( ... )

effectivement moi non plus, un seul mouseenter/mouseleave par éléments alors que x fois mouseover/mouseout lors des déplacements sur les éléments, peut être un soucis avec la pile dans ce cas.

Je viens de voir cet article : https://thisthat.dev/mouseenter-vs-mouseover

Pas forcément d'accord avec ce qu'il dit, ce n'est pas tant la tâche qui fera scintiller l'écran mais le passage d'un état over/out en cascade pour cause du « bouillonement », par contre cela sera effectivement plus flagrant si la tâche est en plus lourde.

De même mouseenter/mouseleave ne sauront en aucun cas être une aide lorsque l'on veut faire de la délégation car eux justement ne « bouillonnent » pas.

Ce n'est donc pas une bonne pratique, générale, car cela va dépendre du contexte et du besoin.