Optimizando nuestra web (IX): Selectores CSS

Aunque esto te parezca imposible y realmente dudes de ello, es totalmente cierto y veraz: el mal uso de los selectores CSS provoca que nuestra página se cargue más lento, que el usuario utilice más CPU y que nuestra página sea por lo tanto mucho menos eficiente.

Pero para ello hay que entender cuando estamos haciendo una buena selección y cuando estamos haciendo una mala.

Selectores poco eficientes

Son todos aquellos que tienen dos o más hijos en la selección, ya que para llegar al destino tiene que recorrer el DOM de nuevo buscando todo lo que tenían sus padres, haciendo un mal uso exponencial según cuantos padres tengamos.

Ejemplos

#menu .item div ul li span

div#miMenu

En el primer caso es totalmente incorrecto el uso y debemos especificar una ID o clase a ese span para seleccionarlo de una forma única, mientras que en el segundo caso recorremos dos veces el DOM cuando los IDs son únicos a cada elemento, por lo que con #miMenu sería suficiente.

Packs de recursos a precios increíbles
Aprovecha la ocasión y hazte con alguno de estos packs con recursos de calidad para profesionales, ahora a precios muy rebajados:
Pack rebajado un 99%1000 fotos rebajadas un 64%

Escribe un comentario