jquery - queryselector - get div angular
Árbol DOM separado con AngularJS/jQuery (2)
Así que tengo una aplicación angular bastante simple y estoy tratando de averiguar qué está causando que aparezcan árboles DOM separados en el perfilador de chrome. Así, por ejemplo, cuando carga esta página:
http://rztest.nodejitsu.com/dashboard
Obtengo 2 árboles DOM separados, uno con 2 entradas y otro con 3 entradas. Esta página no usa ninguna directiva personalizada, por lo que debe ser algo con Angular o jQuery, sin embargo, simplemente no veo nada que pueda causar estos árboles DOM separados.
El problema se vuelve aún más grande (si hace clic en el enlace de proyectos y hace otro perfil, hay muchos más árboles y entradas de DOM separados en ellos), así que espero que si puedo solucionar este sencillo ejemplo, caiga en cascada todo el resto. de la aplicación.
También tenga en cuenta que estoy usando ui-router, sin embargo, he intentado lo mismo con el enrutador predeterminado de Angular con los mismos resultados. Incluso la aplicación Angular de todomvc ( http://todomvc.com/architecture-examples/angularjs/#/ ) que no usa jQuery tiene árboles DOM separados.
ACTUALIZAR
He sacado a jQuery de la aplicación y en mi página simple, todos menos un árbol de árbol separado desaparecen (y ese es de AngularJS, que sé dónde está). Cuando lo intento para una página más compleja (con una directiva personalizada que tiene un templateUrl y hace translusión), la eliminación de jQuery no parece ayudar.
No estoy seguro de si jQuery es realmente el problema (o tal vez parte de él) o cómo Angular usa jQuery / jqLite.
¿Alguien sabe si hay un árbol DOM separado separado conocido en jQuery 1.10.x?
En respuesta a tu última pregunta, esta publicación parecía relevante.
He pasado unas cuantas horas depurando las fugas de los nodos DOM en varias aplicaciones grandes de AngularJS.
Encuentro que una gran cantidad de elementos DOM separados no se recolectan como basura, ya que jQuery tiene una referencia a ellos desde algún caché interno que guarda. Estoy convencido de que hay un problema Angular / jQuery en juego.
Desafortunadamente, me he dado cuenta de que investigar el problema rápidamente crea más preguntas que respuestas (por ejemplo, me di cuenta de que en mi aplicación al abrir / cerrar una vista se generarían elementos DOM separados ... pero al abrir / cerrar no se crearía ningún más) - Al final, tuve que hacer un compromiso:
When an element is destroyed, I would recursively remove that elements children from their parents.
Admito que es un hack absoluto. Pero el resultado final es que cualquier elemento DOM con fugas ya no se mantendrá en grandes subárboles de elementos, por lo que la pérdida de memoria se convertirá en un problema mucho menor.
Si no encuentra una solución a este problema ... esto ciertamente ayudará a mantener la fuga bajo algún tipo de control.