Rendimiento absoluto de posicionamiento

Question

Tengo un colega que usa mucho posicionamiento absoluto en su CSS.

Encuentro que normalmente puedo lograr los mismos efectos visuales al proporcionar una estructura diferente al html; de hecho, tiendo a evitar el uso del posicionamiento absoluto, excepto cuando es absolutamente necesario.

Pregunta: ¿Mis instintos suenan aquí, aparte de la complejidad de CSS, es un posicionamiento absoluto para ser utilizado con moderación?

Answer 1

El uso excesivo del posicionamiento absoluto es un problema de diseño, pero no tanto por problemas de rendimiento, no sé nada de rendimiento, lo que me haría dudar sobre el uso del posicionamiento absoluto cuando lo necesitaba.

El problema real con el posicionamiento absoluto es que tiende a atar su diseño a tamaños fijos, lo que puede hacer que las cosas se vuelvan completamente locas si tiene que adaptarse a cosas que cambian de tamaño.

Por ejemplo, ¿qué ocurre si desea aumentar el tamaño de fuente de su sitio? Si todo está completamente posicionado, tendrá un gran esfuerzo para volver a alinear todo.

En la misma línea, el posicionamiento absoluto casi siempre significa que todo el diseño está posicionado y dimensionado en píxeles en vez de em unidades o porcentaje. Nuevamente, no hay problema con el tamaño de píxeles, pero genera problemas de accesibilidad cuando las personas intentan ajustar el sitio ellos mismos (por ejemplo, con un zoom o una lupa, o simplemente cambiando el tamaño de las fuentes, etc.)

¿Y ha intentado ver su sitio en varios dispositivos móviles? Los sitios que están rígidamente diseñados son generalmente los peores cuando se trata de ver en un tamaño de pantalla más pequeño. Es mucho mejor tener un diseño fluido que funcione dondequiera que lo use, en lugar de tener que tener un sitio completamente separado para móviles.

Answer 2

Para mí, usar el posicionamiento absoluto en elementos relativamente posicionados (como, dentro de un pie de página) es un ahorro de tiempo. Usarlo en todas partes puede ser complicado cuando tiene que cambiar un diseño (columnas, encabezados ...).

Answer 3

Si puedo, siempre trato de evitar el posicionamiento absoluto. Como tiende a hacer las cosas más difíciles para mí al final. Pero a veces realmente no tengo una elección.

Answer 4

Muchos años después de la pregunta, las cosas se ven un poco diferentes. La pantalla táctil, los dispositivos móviles y la evolución de las funciones de zoom en los navegadores de escritorio normales eliminan todos los aspectos negativos del diseño absoluto. El acercamiento fácil hace innecesario el esfuerzo de evitar el posicionamiento absoluto. Diseña tu pantalla como quieras. Las fuentes, imágenes, coordenadas absolutas y tamaños se escalan fácilmente en casi cualquier OS/navegador reciente.

La mayoría de los sistemas operativos tienen una configuración de dpi por defecto razonable (puntos por pulgada) y los navegadores se configuran con la resolución de pantalla en mente. Tome cualquier tableta de alta resolución. "font-size: 10px" en su CSS en realidad resultará en texto muchas veces "más alto" cuando se mide en píxeles de pantalla real.

En cuanto al rendimiento, no es como el diseño estático, no requiere que el navegador calcule los tamaños y la posición de los elementos. El motor de distribución todavía tiene que realizar esos cálculos que siguen las reglas de posicionamiento y dimensionamiento estáticos. El diseño absoluto simplemente permite a los desarrolladores especificar esas reglas explícitamente.

Se puede argumentar que el posicionamiento absoluto puede incluso requerir menos trabajo del navegador a los elementos de diseño. Al tener 100 hijos, el diseño estático necesita evaluar la posición y el tamaño de 99 elementos para posicionar el elemento número 100.El posicionamiento absoluto le dice explícitamente al navegador dónde colocar ese centésimo hijo.

No ejecuté ningún punto de referencia, pero es muy poco probable que haya diferencias significativas en el rendimiento entre los diferentes tipos de diseños.