C'est généralement comment je gère l'amélioration progressive tout en conservant l'expérience propre, mais quelle est sa sécurité? Existe-t-il un potentiel d'une condition de race et que cela ne fonctionne pas?
Imaginez le scénario abstrait simple, vous souhaitez afficher quelque chose différemment si vous avez un support JavaScript. C'est généralement ce que je finirai par faire: P>
<div id="test">original</div>
<script type="text/javascript">
var t = document.getElementById('test');
t.innerHTML = 'changed';
</script>
5 Réponses :
Vous pouvez manipuler le DOM avant d'avoir complètement chargé, mais cela peut être risqué. Vous ne pouvez évidemment pas garantir que le bit du DOM que vous essayez de manipuler n'existe pas encore, de sorte que votre code peut échouer par intermittence.
Merci Rikh, qu'est-ce que vous voulez dire il n'y a aucune garantie, par spécification ou par réalité réelle des produits qui existent aujourd'hui (FF, Opera, etc.). Je pense que l'analyseur agit linéairement et ajoute des éléments à mesure qu'il rencontre son nœud de fermeture .. Bien que cela ne soit peut-être pas une spécification, je penserais que c'est un comportement sensible et que vous cherchiez plus à trouver des réponses autorisées à ce que c'est le cas.
Pour être honnête, je ne sais pas, mais ce n'est pas quelque chose que je voudrais dépendre de. Si vous êtes vraiment inquiet pour les mauvaises informations affichées, essayez de ne rien afficher initialement, puis de remplir quelque chose sur DOC prêt ou de concevoir simplement le problème du système, de sorte que vous n'avez pas besoin de faire ce que vous demandez.
Malheureusement, ce n'est pas possible, le dernier exemple que j'ai est où nous rendons des numéros de pagination sous forme de liens hypertexte, et notre JavaScript fonctionne et change ces éléments afin que nous puissions afficher "page x de y" et mettre en surbrillance le lien hypertexte actif (les pages sont des ancres. ) avoir un soutien javascript;)
Vous pouvez, mais il y a des questions qui entourent le faire.
Tout d'abord, dans IE si vous essayez de manipuler un noeud qui n'a pas été fermé (par exemple le corps avant son balise fermante qui devrait être en dessous de votre JS), vous pouvez rencontrer l'erreur « FONCTIONNEMENT ABORTED » IE qui se traduira par un blanc page. Manipulation d'un noeud comprend annexées noeuds, les noeuds mobiles, etc.
Dans d'autres navigateurs le comportement est indéfini, mais ils ne se comportent généralement comme on peut s'y attendre. Le principal problème est que votre page évolue, la page peut charger / parse / courir différemment. Cela peut provoquer un script à exécuter avant un navigateur définit les éléments référencés ont effectivement été créés et mis à la disposition pour la manipulation DOM.
Si vous essayez d'améliorer votre utilisateur perçu la performance (à savoir snappiness). Je vous suggère fortement que vous évitez ce chemin et regarder en allégeant vos pages. Vous pouvez utiliser la page Performance YSlow / Google Yahoo Firebug pour vous aider à démarrer.
Bonjour Raégx, oui, je peux comprendre complètement l'opération d'abandon du problème avec des éléments changeants qui ont été fermés. En termes de snappiness, ces pages sont la lumière, la page réelle est de 15kb .. Cependant, mon élément changé peut bien être juste sous l'ouverture Étiquette du corps, et cela rendra avant les incendies domready, quelle que soit la lumière de ma page .. J'essaie d'éviter une expérience bâclée qui est toujours expérimentée avec Domready et de faire ce genre de choses.
De retour dans les âges sombres, lorsque nous n'avions pas de moyen de navigateur transversal pour tirer sur ONDDYReady, nous utilisions surcharge, ce qui est tiré après toutes les images / CSS / etc., a été chargé et rendu. Maintenant, nous avons sur ONDomReady qui incendie une fois que le DOM a été analysé et représenté, mais potentiellement avant les images / etc. C'est également un avancement relativement nouveau. Attendez donc que Ondomready est tout ce que nous avons à ce stade et sa meilleure solution pour la robustesse. Si vous croyez que votre manipulation avant que OndomyReady en vaut la peine et que vous n'êtes pas ajouté / crée / en déplaçant des nœuds dans des nœuds non clos, vous êtes probablement bien.
Génial, c'est certainement la peine si ça marche si ça marche. De ce que j'entends, cela devrait bien fonctionner, mais il n'y a rien d'officiellement indiquant qu'un élément doit être prêt après son nœud de fermeture.
Tant que vous ne modifiez que des nœuds qui précèdent le bloc de script (c.-à-d. La balise de fermeture du nœud préconise la balise d'ouverture du script), vous ne devez rencontrer aucun problème.
Si vous souhaitez vous assurer que l'opération réussit, enveloppez le code dans un Essayez ... Catch Block et appelez-le à nouveau via Settimeout () sur une défaillance. < / p>
Merci Christoph, j'avais envisagé qu'à une insuffisance, je n'aurais rien récupérer ni une exception et que je puisse réessayer. Bien que je n'aime pas si telle logique, je crains que l'exécution puisse entraver la performance de chargement de la page. Je vais Pour voir si je peux exécuter des tests en essayant de simuler une bande passante hautement contrainte et même une puissance de traitement faible pour voir si je peux trouver une fenêtre du tout qui existe .. Jusqu'à présent, la bande passante ne semble rien faire, je fais des itérations de La page chargée à 100 octets une seconde (il faut un moment) .. Et au moment où la zone a chargé, elle a déjà ...
.. exécuté le script parfaitement bien .. J'imagine que le temps de traitement contraignant est beaucoup plus susceptible de paralyser l'analyseur et d'éclairer toutes les fenêtres où l'hypothèse est fausse.
à viajeros.com, j'ai un indicateur de chargement depuis 8 à 9 mois et je n'ai aucun problème jusqu'à présent. Il ressemble à ceci:
Peut-être que ce n'est pas tout le code, mais vous vous rendez compte que le getElementyid est totalement inutile, non? Vous pouvez simplement ajouter style = "affichage: bloc" sur html.
Accéder à la DOM jette prématurément des exceptions dans IE 5 et Navigator 4.