Inconveniente de utilizar la directiva CSS @import

La directiva CSS @import tiene algunas ventajas. Por ejemplo podemos importar con ella fuentes de Google y evitarnos tocar el markup de la página para añadir un <link> para cargar dichas fuentes.

Sin embargo la directiva @import también tiene algunos inconvenientes. El más importante es que su uso evita la descarga concurrente de las hojas de estilos. Esto puede suponer un impacto negativo en la carga de algunos sitios.

El motivo es que la descarga del recurso indicado por la directiva @import no puede comenzar hasta que la propia hoja ha sido descargada. En cambio si cada una de estas hojas se incluye mediante un tag en el elemento la descarga se puede realizar en paralelo.

Hacks relacionados con la directiva @import

Algunas personas utilizan el uso de esta directiva para realizar ajustes en navegadores antiguos. Muchos navegadores viejos no soportan la directiva @import por ello se puede incluir contenido exclusivo para navegadores modernos a través de esta directiva.

Las reglas comunes para ambos navegadores se incorporan en una hoja de estilos cargada mediante la técnica tradicional (elemento link en la cabecera).

Posteriormente se personalizan las reglas para los navegadores nuevos en la hoja importada con la directiva @import.