Evite usar CSS @Import

O que é @ CSS import?

O CSS import é um método de importar um arquivo CSS dentro de outro arquivo CSS.

Se parece com isso…

@import url("style.css")

Por que não usar @ CSS import?

O método @import de recuperar arquivos CSS cria alguns problemas que afetam a velocidade de carga das páginas de seu site ou blog.

O maior problema é que ele faz com que os arquivos sejam carregados sequencialmente (é preciso esperar pelo outro) em vez de em paralelo (ao mesmo tempo).

Isso desperdiça tempos e gera tráfego de ida e volta tornando a carga de suas páginas mais lentas.

Como evitar usar css @imports

Procure em seus arquivos HTML e CSS e localize as chamadas @import.

Repito: eles se parecem com isso e geralmente estarão perto do topo do arquivo.

@import url("style.css") 

 

Em vez de chamar esse arquivo CSS usando o método de importação, é melhor manter apenas o CSS adicional em apenas um arquivo (copie e cole o CSS importado no arquivo CSS original).

Se não for possível fazer isso por algum motivo, então inclua os arquivos CSS do arquivo HTML usando o seguinte código:

<link rel = "style.css" href = "estilo.css" type = "text / css">

 

Certifique-se de substituir “estilo.css” pela localização e nome do seu próprio arquivo CSS.

Verifique todos os seus arquivos CSS

Muitos sites têm vários arquivos CSS (você deve tentar combinar esses arquivos CSS em um único). Se você tiver mais de um arquivo CSS, verifique cada arquivo em busca de @imports.

Se um arquivo CSS chamar outro arquivo CSS por meio do método @import, isso será particularmente ruim para a velocidade da página. Isso adiciona etapas adicionais para o navegador carregar a página, fazendo com que o navegador baixe, analise e, só então, saia e obtenha o próximo arquivo CSS antes de começar a exibir a página.

Isso pode ser evitado usando o método mostrado acima.

Conclusão: é melhor que nenhum @import seja usado

Comente