Hay una ventaja para un uso muy específico selectores en CSS?

Question

Entiendo que en jQuery, es ventajoso para ser más específicos al utilizar los selectores de modo que jQuery no tiene que atravesar toda la DOM para encontrar lo que estás buscando.Por ejemplo, $('span.description') es mejor que sólo $('.description') si sé que el description clase solo se aplica a <span> elementos.

Es este el caso con CSS, también?¿Hay alguna ventaja específica para el uso de span.description { } en lugar de .description { }?Estoy pensando en términos de velocidad, optimización, etc.Estoy ahorrando el navegador, en cualquier trabajo diciendo exactamente dónde buscar?

Answer 1

Esto es cierto en CSS -

Una buena regla es descender desde la ID más cercana. Las ID están indexadas, por lo que localizarlas es extremadamente rápido. No hay ninguna razón para usar más de uno en su selector.

Google Code- Optimiza la representación del navegador

Esto respondió muchas de las preguntas que tenía sobre el tema, incluida esta: Espero que les sea útil.

Answer 2

Lea sobre la especificidad de CSS, que es la razón más importante para ser más o menos específico con su CSS.

http://www.w3.org/TR/CSS2/cascade .html # especificidad

Como el rendimiento del navegador no es un problema (excepto en jquery, como mencionaste), mi guía es ser específico cuando controlas la precedencia o cuando quieres hacer algo un poco más legible en tu css. Especificar en exceso puede dificultar la reutilización de los selectores CSS y hacer que las cosas sean demasiado complicadas.

Editar

Esto parece un poco duplicado:

Pregunta de rendimiento de CSS

Answer 3

siempre depende de la cantidad de código html y la estructura. Definitivamente es una buena idea usar especialmente identificadores y selectores apropiados. (es decir, #nav li en lugar de li.nav). Dado que el navegador primero carga el html y luego aplica el CSS, está ayudando mucho.

Dicho esto, cuando se trata de css puro (sin jquery), la diferencia de velocidad hoy en día no es fácil de distinguir, porque los motores de renderizado están altamente optimizados, especialmente cuando se trata de aplicar css. Entonces normalmente no debería importar.

Answer 4

Hasta donde yo sé, cuán específicos son sus selectores hacen muy poca diferencia en el rendimiento.

Las dos áreas donde los selectores más específicos son más útiles, es reducir el riesgo de que no se aplique donde no lo desee, y hacer que un selector tenga prioridad sobre otro.

Answer 5

Una regla más específica tiene precedencia sobre un menos de una regla específica, así:

span.myclass {}

tiene prioridad sobre:

.myclass {}

(no importa el orden en el que las reglas fueron declarados)