¿Cómo evitar un tamaño de DOM excesivo? Según lo cubierto por Google, un DOM excesivo puede dañar el rendimiento de su página web.
Se recomienda que su página web no tenga más de 1500 nodos, que no tenga más de 32 niveles anidados de profundidad o que tenga un nodo principal que tenga más de 60 nodos secundarios. Lo que básicamente se descompone o se deriva de este aserto es que, si tiene una página web que usa un tamaño DOM excesivamente grande, tomará más tiempo representar la página y ejecutar JavaScript en la página.
Sin rediseñar completamente su página web desde cero, no puede resolver esta advertencia. Comprenda que esta advertencia es importante y si la obtiene durante más de una o dos páginas en su sitio, debe considerar: reduciendo la cantidad de widgets / secciones dentro de sus páginas web o diseños de página usando un creador de páginas web más simple ya que muchos creadores de páginas agregan una gran cantidad de código hinchado usando un tema diferente usando un control deslizante diferente.
Qué es Document Object Model ( DOM )
El Document Object Model ( DOM ) es una interfaz de programación estandarizada por el W3C , que permite que los scripts examinen y modifiquen el contenido del navegador web. Por DOM, la composición de un documento HTML o XML se representa como un conjunto de objetos, que pueden representar una ventana, una oración o un estilo, por ejemplo, vinculados según una estructura de árbol.
Usando el DOM, un script puede modificar el documento presente en el navegador agregando o quitando nodos del árbol.
Descripción
Modelo
Se utiliza un modelo para representar algo, como un mapa de la ciudad. El DOM representa el documento que está en el navegador.
Objeto
En programación , un objeto es un contenedor que tiene propiedades y métodos, que son variables y acciones sobre lo que representa. Los objetos DOM pueden representar una ventana, un documento, una frase, un estilo.
Documento
El DOM se relaciona con un documento, como una página web que se muestra en un navegador. Una página web comienza con una etiqueta !DOCTYPEseguida de la etiquetaen la que se encuentra el resto del documento. El DOM representa el documento mostrado por una estructura de árbol, que comprende nodos (ramas y hojas).
Historia
Originalmente, el DOM (nivel 0, legado ) era un conjunto de objetos puestos a disposición por Netscape Navigator , cuya versión 4 fue lanzada en Junio de 1997. Internet Explorer 4 siguió en octubre del mismo año. Estos dos navegadores incluían soporte para DHTML 2 , que requería extensiones que luego ofrecía el DOM rudimentario en ese momento. El documento ahora podría manipularse a través del DOM; sin embargo, los dos navegadores no representaron el mismo documento de la misma manera. Este problema desapareció gradualmente con la adopción del DOM estandarizado por el W3C 2 . El DOM (nivel 4) ahora está incorporado en el estándar HTML5.
Implementación
La especificación del W3C proporciona los objetos, los métodos y las propiedades que un navegador web debe proporcionar. Las principales categorías de objetos de un árbol DOM son documento, elementos y atributos: document expone información sobre todo el documento HTML, así como la etiqueta que cataloga los elementos, expone una etiqueta de un documento HTML o XML y tiene una propiedad attributo que expone los atributos de la etiqueta. Cada elemento tiene métodos para acceder a los elementos padre, hijo y hermano del árbol DOM. cada uno text contiene el texto que está dentro de una etiqueta. Cada navegador implementa el DOM en su lenguaje de programación. La especificación DOM está alineada con el lenguaje JavaScript , reconocido por todos los navegadores web.
Por lo tanto, cualquier parte de una página web se puede editar mediante programación y el programa se ejecutará en cualquier navegador web compatible con DOM. Técnicamente, el DOM permite leer y modificar cualquier documento que utilice etiquetas , con cualquier lenguaje de programación que ofrezca una interfaz de programación DOM
Ediciones 2020-21
Leer también: Pensar en las imágenes de la siguiente generación; Cómo optimizar su sitio web para Google
This post is also available in:
Español
