Voorkom CSS imports


Wat is @ CSS importeren?

Het is een methode om een ​​CSS-bestand te importeren vanuit een ander CSS-bestand. Het ziet er zo uit…
@import url (“style.css”)
Waarom zou je het niet gebruiken?

De @import-methode voor het ophalen van CSS-bestanden veroorzaakt enkele problemen die van invloed zijn op uw paginasnelheid. Het grootste probleem is dat het ervoor zorgt dat bestanden opeenvolgend worden geladen (de een moet op de ander wachten) in plaats van parallel (tegelijkertijd). Dit verspilt tijden en rondreizen en maakt uw webpagina langzamer laden.

Hoe CSS @ import te voorkomen

Kijk in uw HTML- en CSS-bestanden en zoek de @ import-aanroepen. U kunt ook de online CSS-bezorgtool gebruiken om ze te detecteren.
Nogmaals, ze zien er zo uit en zullen meestal bovenaan het bestand staan.
@import url (“style.css”)

In plaats van dat css-bestand met de importmethode aan te roepen, is het beter om die extra css in slechts één bestand te houden (kopieer en plak de geïmporteerde css in het oorspronkelijke css-bestand). Als u dat om een ​​of andere reden niet kunt doen, neemt u die CSS-bestanden op uit het HTML-bestand met de volgende code …
<link rel = “style.css” href = “style.css” type = “text / css”>

Zorg ervoor dat “style.css” wordt vervangen door de locatie en naam van uw CSS-bestand.
Controleer al uw CSS-bestanden

Tip: gebruik onze CSS-tool om te zien of je @imports op je pagina hebt

Veel websites hebben verschillende CSS-bestanden (u moet proberen deze CSS-bestanden te combineren). Als u meer dan één CSS-bestand hebt, controleert u elk bestand op import.

Als een CSS-bestand een ander CSS-bestand aanroept via de @ importmethode, is dit met name slecht voor de paginasnelheid. Dit voegt extra stappen toe voor de browser om uw webpagina te laden, waardoor de browser wordt gedownload, ontleed en vervolgens naar buiten gaat en het volgende CSS-bestand ophaalt voordat het begint met het weergeven van uw pagina.
Dit kan worden voorkomen door de hierboven getoonde koppelingsmethode te gebruiken.

Het is het beste als er helemaal geen @imports worden gebruikt



Subscribe to our newsletter!

More from our blog

See all posts