¿Está verificando la preparación del DOM?

Estoy desarrollando una plataforma para desarrollar aplicaciones de escritorio con tecnologías web. En el transcurso de este proceso, he estado tratando de obtener una funcionalidad de documento / listo para trabajar con el navegador que voy a integrar en la plataforma. Es por eso que anteriormente hice esta pregunta aquí en SO: javascript-framework-that-ante todo-proporciona-solo-documento-en-listo-funcionalidad

Sin embargo, no he podido obtener mi navegador de elección (shush, es un secreto;) para utilizar con éxito la funcionalidad sugerida por la única respuesta a la anterior. Así que, en el curso de tratar de averiguar qué podría funcionar, encontré lo siguiente.

El código a continuación tiene el mismo efecto dentro de este navegador que estoy usando simplemente ejecutando una función después de un tiempo de espera de 1 milisegundo: puedo escribir en el DOM mientras la imagen grande se está cargando. Puede que esta no sea la solución definitiva para mí, puedo escribir algo específico sobre cómo el motor de JavaScript implementa la funcionalidad de DOM para este navegador.

Sin embargo, decidí ver si esto funciona en los navegadores estándar, y para mi sorpresa, ¡lo hace! A la luz de lo cual, mi pregunta: ¿son varias implementaciones de la funcionalidad dom / readiness provistas por varios marcos de JavaScript, simplemente una exageración?

   Untitled Document   setTimeout(function() { var txtNode = document.createTextNode("ready_yet?"); var ready_yet_el = document.getElementById("ready_yet"); ready_yet_el.appendChild(txtNode); },1);    

EDITAR / OTROS PENSAMIENTOS En la página vinculada a la respuesta a mi pregunta anterior relacionada, se indica “Para Firefox y Opera, una simple comprobación del tipo de evento determinará si se trata de DOMContentLoaded. Safari e IE verifican el estado de listo del documento … “Por último, en caso de que todo lo demás falle, el evento onload traerá la retaguardia”. ¿Quizás un setInterval similar a mi setTimeout anterior podría ser el penúltimo curso de acción, antes de confiar en la carga como último recurso? En cualquier caso, con el navegador integrable que he elegido, ni el evento DOMContentLoaded, ni document.readyState parecen ser compatibles.

3 Solutions collect form web for “¿Está verificando la preparación del DOM?”

Tu corazonada es buena y bien fundada, OMI. Pero alguien ya te ha vencido al golpe . La respuesta corta es que setTimeout no es una implementación que funcione para detectar la preparación de DOM en todos los casos. Puede estar bien para su navegador de interés, pero IE falla en algunas situaciones.

Le puede interesar saber que el propio marco ASP.NET AJAX de Microsoft usa el truco setTimeout para detectar la preparación de DOM. Y sorpresa, sorpresa: también falla en ciertos casos de uso .

En resumen, el problema parece estar en IE con scripts de carga lenta, ya sea debido al gran tamaño del archivo (por ejemplo, ~ 500K) o la latencia de la red / servidor.

No, porque cuando los errores de “falta de lectura” de DOM se manifiestan, lo hacen de una forma increíblemente inusual y difícil de predecir y rastrear, cada una (por supuesto) es única para el navegador en el que se encuentra.

Es mucho más fácil simplemente evitar esos problemas por completo y saber que siempre vas a tener que lidiar con un DOM listo.

Como ejemplo, hace un tiempo tuve un error de DOM no preparado en el navegador favorito de todos que se manifestó al funcionar perfectamente el 99% del tiempo, pero murió con errores si el contenido de la página tenía un elemento img con el atributo src Y si el el contenido también tenía un elemento ul con cualquier número de li dentro … no se molestó si alguna de esas cosas no eran ciertas.

Es fácil para mí decir ahora ‘oh, era un problema de DOM’, pero en ese momento … no, no es tan fácil.

Simplemente, no. Alguien con una conexión más lenta y varios archivos para cargar no apreciará que su navegador intente ejecutar scripts en elementos que aún no existen.

Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.