Menghindari CSS @import

Apa CSS @impor itu?

Ini adalah metode mengimpor satu file css dari dalam file css lain. Sepertinya ini ...

@import url ("style.css")

Mengapa tidak menggunakannya?

Metode @import mengambil file CSS yamg menciptakan beberapa masalah yang mempengaruhi kecepatan halaman Anda. Masalah terbesarnya adalah bahwa hal itu menyebabkan file untuk memuat berurutan (satu harus menunggu untuk yang lain) bukan secara paralel (pada waktu yang sama). Ini termasuk limbah dan perjalananya berputar-putar dan membuat beban halaman web Anda lebih lambat.

Bagaimana menghindari css @ impor?

Lihat di file HTML dan CSS Anda dan cari panggilan @ impor. Anda juga dapat menggunakan alat pengiriman CSS secara online yang akan mendeteksi mereka.
Sekali lagi, mereka terlihat seperti ini dan biasanya akan menjadi dekat bagian atas file.

@import url ("style.css")

Daripada memanggil file css dengan menggunakan metode impor lebih baik untuk  tambahan menjaga css saja, tambahan hanya dalam satu file (copy dan paste css diimpor ke dalam file css asli). Jika Anda tidak dapat melakukan itu untuk beberapa alasan, termasuk file-file css dari file html menggunakan kode berikut ...

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

Pastikan untuk mengganti "style.css" dengan lokasi dan nama file CSS Anda.

Periksa semua file CSS Anda

Tip: Gunakan alat CSS untuk mengetahui apakah Anda memiliki @imports pada halaman Anda

Banyak situs memiliki beberapa file CSS (Anda harus mencoba untuk menggabungkan file-file CSS). Jika Anda memiliki lebih dari satu file CSS, memeriksa setiap file untuk impor.

Jika file CSS panggilan melalui metode @ impor, sangat buruk untuk kecepatan halaman. Hal ini menambah langkah-langkah tambahan untuk browser dalam memuat halaman web Anda, menyebabkan browser untuk men-download, mengurai, dan kemudian pergi keluar dan mendapatkan file CSS berikutnya sebelum mulai menampilkan halaman Anda.
Hal ini dapat dihindari dengan menggunakan metode link di atas.

Cara terbaik adalah jika tidak ada @imports digunakan sama sekali.

Lihat: cara optimalkan css