2010-08-15 12 views
9

Hola, me preguntaba si existe un límite en la cantidad de divs permitidos en una página web.Número máximo de divs permitidos en la página web

Por ejemplo, ¿Internet Explorer comenzará a ahogarse cuando tenga que renderizar una página web con mil divs?

+9

si va a ser a tal pregunta es probable que hacer algo mal ... Si –

+1

está teniendo una página con este tipo de diseño, el número de divisiones permitidas no es su mayor problema –

+2

No estoy de acuerdo con que el diseño sea incorrecto. He escrito búsquedas que permiten a las personas enumerar 100, 250 o 1.000 elementos y necesitan divs para cambiar dinámicamente su contenido.La pregunta era si hay un límite; la respuesta es no, pero el realismo sugiere un límite. –

Respuesta

1

Hay dos cosas a considerar. La memoria es una, donde los nodos DOM ocupan una gran cantidad de espacio. El otro es el tiempo de CPU necesario para volver a renderizar todos estos nodos cuando algo cambia. El umbral de rendimiento sin problemas depende del motor utilizado. En mi experiencia, IE se queda atrás, empezando a ahogarse después de varios cientos. Firefox puede tomar varios miles, y es casi lo mismo (y un poco mejor) para los navegadores WebKit como Chrome.

+0

¡Gracias por tu aporte! es difícil encontrar este tipo de información en línea. – Sau

26

Sé que esta es una publicación anterior, pero recientemente hice una prueba que está directamente relacionada con este tema y quería compartir mis resultados.

Creé un script php simple que escupe x número de divisiones de bloque en línea de 5px por 5px para probar la estabilidad del navegador y la capacidad de desplazamiento de la página.

En 1000 divs en la página IE9, Firefox y Chrome no tienen ningún problema y ni siquiera parecen tener problemas cuando se desplazan.

En 10,000 divs IE9 y Chrome pueden desplazarse con un retraso apenas perceptible, aún dentro del rango "aceptable" en mi libro, sin embargo Firefox comienza a retrasarse más notablemente, hasta el punto en que siente que la barra de desplazamiento está saltando a la posición medio segundo más tarde de lo que debería.

Curiosamente, la diferencia de rendimiento entre 10,000 divs y 100,000 no es tan drástica como se podría imaginar. IE9 y Chrome funcionan con solo un retraso apenas perceptible en el desplazamiento (con Chrome siendo el más suave de los dos), y Firefox tiene un retraso que es muy notable y probablemente se considerará molesto, pero aún funciona razonablemente bien (es decir, no funciona). t crash).

Ahora en 500,000 divs en la página finalmente comenzó a ponerse interesante. IE9 colapsó y trató de reiniciarse (en la misma página, por supuesto) y volvió a colapsar, en ese momento lo apagué correctamente, lo reinicié e intenté una vez más para asegurarme de que volviera a ocurrir el mismo resultado. Lo hizo.

Chrome se mantuvo estable, pero se hizo casi imposible desplazarse por la página debido a la extrema demora.

La gran sorpresa fue Firefox, el navegador que era grueso en 100.000 divs es casi lo mismo en 500,00 divs ... el desplazamiento no es uniforme, pero es mucho, mucho mejor que Chrome.

Sorprendentemente, ¡los resultados fueron prácticamente los mismos para 1,000,000 de divs en una página! Firefox los manejó sin fallar y permaneció desplazable aunque 'grueso'. IE9 se estrelló. Y Chrome pudo cargar la página, pero se volvió tan lento que prácticamente no se pudo usar.

Sé que esto no es exactamente un estudio científico, pero pensé que podría ser interesante para alguien más aparte de mí.

Las pruebas se realizaron en una estación de trabajo Dell con procesadores dual-Xeon y 4 GB de RAM, con Windows 7.

+3

información interesante, aunque algo limitada en su prueba. –

+0

+1 para listar la máquina de prueba –

+0

¿Qué tal el tiempo de carga? ¿Cuánto tiempo costó renderizar esos divs? – Ismail

Cuestiones relacionadas