Charger des div dans une div sans figeage du navigateur

Bonjour,

En javascript, j'empile 25 DIV dans une DIV
Quand je fais ce traitement en JS, j'ai un petit figeage qui n'est pas gravissime mais j'aurais voulu l'éviter.

Actuellement, je rajoute les 25 divs en une fois.

Comment faire pour faire pour rendre la main au navigateur pendant 50 ms entre chaque rajout de div de manière à ce que le navigateur ne soit pas figé...

Peut-être rajouter chaque DIV dans un timeout ?

Bref, s'il y a une méthode pour ce que je cherche, je suis preneur

Merci bcp
Sylo

C'est étonnant que 25 div suffisent à figer ton navigateur, alors que certaines solutions actuelles rafraîchissent des pages entières sans que cela pose problème. Je pense qu'il doit manquer de grosses optimisations à la manière dont tu ajoutes ces div à la page.

Sinon, oui, tu peux ajouter des timeouts entre chaque ajout de div. Mais je suis convaincu qu'il y a un autre problème en amont.

le figeage est trés léger, il doit durer à peine 1/4 secondes...
Mais comme parfois des anim se déroule au moment du chargement des divs, cela fait un léger blocage qui rend l'anim moins sympa.
C'est du domaine du détail
Merci pour votre retour
Sylo

Citation:

---

Envoyé par SylvainPV

C'est étonnant que 25 div suffisent à figer ton navigateur, alors que certaines solutions actuelles rafraîchissent des pages entières sans que cela pose problème. Je pense qu'il doit manquer de grosses optimisations à la manière dont tu ajoutes ces div à la page.

Sinon, oui, tu peux ajouter des timeouts entre chaque ajout de div. Mais je suis convaincu qu'il y a un autre problème en amont.

---

+1
et je ne suis pas du tout convaincu par les timeout
A+JYT

effectivement, c'est pas top les timeout
...
tant pis.

Si tu nous montrais un bout de ton code, il y aurait certainement 2/3 choses à faire.

As tu pensé à utiliser un peu de Promise par dessus tout ça ?

Et dans cette optique, tu n'utiliserais pas le .then() pour continuer à faire quelque chose, tu le lancerais un peu comme cela :

startAnimation().then(); ... (avec éventuellement un traitement de fin pour ton animation.)
.... // le reste de ton code qui s'exécutera en parallèle de ta promise

Mais, il y a un mais (ou plus :p ) :
- lourdeur du traitement, qui exécuté en parallèle ou non, te donnera une sensation de "non réponse" du navigateur
- peut être "fluide" sur un ordi', mais pas pour un autre (suivant les puissances matérielles)

Merci Luc1ano
Mais je cherchais s'il y avait une solution simple en fait.
C'est vraiment un detail pour l'instant sur mon appli...
Je reprendrais ce point quand cela sera nécessaire.
Merci à tous
Sylo