Menggunakan css saya bukan bookmarklet

Stoyan betul -betul betul. Walaupun kita semua suka CSS, ia masih merupakan faktor penting dalam kelajuan pemuatan laman web, dan mengurangkan penggunaan CSS adalah perkara yang baik. Dia mencipta penanda buku yang mudah dipanggil "CSS Me Not" untuk mendiagnosis fail CSS yang tidak perlu, yang akan kami sampaikan lebih terperinci kemudian.

Masalahnya adalah bahawa CSS berada di jalan kritikal, yang menghalang rendering dan bahkan sering menghalang pelaksanaan JavaScript. Kami suka CSS, ia luar biasa, ia boleh melakukan kejayaan yang luar biasa, memperbaiki UI yang rosak, memanipulasi imej dan menarik gambar yang menakjubkan. Kami suka CSS. Kami hanya mahu ... kurang CSS kerana sifatnya menyekat.

Kadang -kadang laman web kami menggunakan seluruh helaian gaya yang tidak perlu. Saya harus mengakui bahawa WordPress terkenal untuk ini, dan ia memuatkan stylesheets untuk plugin dan blok yang anda tidak boleh gunakan sama sekali. Saya berada dalam keadaan ini kerana saya menulis artikel ini. Saya tidak menemui masa untuk membersihkan beberapa gaya kecil yang tidak perlu dimuatkan.

Stoyan mencipta penanda ringkas yang dipanggil "CSS Me Not" untuk melihat semua fail CSS ini. Sudah tentu, manfaat terbesar ialah ia membolehkan anda tahu apa yang anda hadapi.

Anda juga boleh mencari stylesheet ini di Devtools, tetapi "CSS Me Not" bookmark menjadikannya lebih mudah, dan terdapat pembunuh tambahan: matikan stylesheet ini . Menguji penanda buku ini di laman web CSS-Tricks saya, saya dapat melihat bahawa WordPress memuatkan empat stylesheets (kerana tetapan dan plugin) saya tahu saya tidak memerlukannya.

Jika anda ingin melakukan ini di DevTools, anda boleh menekan CSS untuk menapis permintaan rangkaian anda, cari stylesheet yang anda mahu tutup, klik kanan dan menyekatnya, dan kemudian tambah nilai.

Saya telah mengusahakan ini selama bertahun -tahun, skrip dan gaya yang tidak bersuara di WordPress.

Memadam lembaran gaya yang tidak digunakan sepenuhnya adalah kemenangan yang jelas, tetapi ada masalah yang lebih sukar, iaitu untuk menghapuskan CSS yang tidak digunakan. Dalam jawatan itu, saya menyebutkan satu -satunya cara untuk benar -benar memahami jika mana -mana CSS tertentu tidak digunakan, adalah untuk melampirkan imej latar belakang kepada setiap pemilih dan kemudian periksa log pelayan selepas tempoh masa pengeluaran untuk melihat imej mana yang tidak pernah diminta. Stoyan mengesahkan apa yang saya katakan di sini:

UNCSS agak seperti "makmal". "Dunia nyata" mungkin mengejutkan anda. Oleh itu, kami melakukan helah di SomeCompany Inc. adalah untuk menambah alat untuk semua pengisytiharan CSS pada masa membina, di mana setiap pemilih mendapat imej latar belakang 1 × 1. Kemudian periksa log pelayan dengan teliti selepas kira -kira seminggu untuk melihat apa yang sebenarnya digunakan.

Atas ialah kandungan terperinci Menggunakan css saya bukan bookmarklet. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!