4 Alat untuk Mengaudit dan Mengoptimalkan CSS
Setelah situs web Anda mulai tumbuh, kode Anda juga akan bertambah. Saat kode Anda berkembang, CSS mungkin tiba-tiba menjadi sulit untuk dipertahankan, dan Anda mungkin akhirnya menimpa satu aturan CSS dengan yang lain. Ini mempersulit dan Anda mungkin akan berakhir dengan banyak bug.
Jika ini terjadi pada Anda, inilah saatnya bagi Anda audit CSS situs Anda. Mengaudit CSS Anda akan memungkinkan Anda untuk mengidentifikasi bagian-bagian dari CSS Anda yang tidak dioptimalkan. Anda juga dapat mengurangi ukuran stylesheet dengan menghilangkan baris kode yang memperlambat kinerja situs Anda.
Berikut adalah 5 alat yang bagus untuk membantu Anda mengaudit dan mengoptimalkan CSS.
Ketik-o-matic
Ketik-o-matic adalah plugin Firebug untuk menganalisis font yang digunakan di situs web. Plugin ini memberikan laporan visual dalam sebuah tabel, memuat properti font seperti keluarga font, ukuran, berat, warna, dan juga berapa kali font tersebut digunakan di halaman web. Melalui tabel laporan, Anda dapat dengan mudah mengoptimalkan penggunaan font, menghapus apa yang tidak perlu, atau menggabungkan gaya yang terlalu mirip.
CSS Lint
CSS Lint adalah linting alat yang menganalisis sintaks CSS berdasarkan parameter spesifik yang membahas kinerja, aksesibilitas, dan kompatibilitas CSS Anda. Anda akan terkejut dengan hasilnya, berharap banyak peringatan di CSS Anda. Namun, kesalahan ini pada akhirnya akan membantu Anda memperbaiki sintaks CSS, dan membuatnya lebih efisien. Selain itu, Anda juga akan menjadi penulis CSS yang lebih baik.
CSS ColorGuard
CSS ColorGuard adalah alat yang relatif baru. Itu dibangun sebagai modul Node dan berjalan di semua platform: Windows, OS X, dan Linux. CSS ColorGuard adalah alat baris perintah yang akan memberi tahu Anda jika Anda menggunakan warna serupa di stylesheet Anda; misalnya. # f3f3f3 cukup dekat # f4f4f4, jadi Anda mungkin ingin mempertimbangkan untuk menggabungkan keduanya. CSS ColorGuard dapat dikonfigurasi, Anda dapat mengatur ambang kesamaan dan juga mengatur warna yang ingin diabaikan alat.
CSS Dig
CSS Dig adalah skrip Python dan bekerja secara lokal di komputer Anda. CSS Dig akan menjalankan pemeriksaan menyeluruh dalam CSS Anda. Ini akan membaca dan menggabungkan properti, mis. semua deklarasi warna latar akan berada di bawah bagian latar belakang. Dengan begitu Anda dapat dengan mudah mengambil keputusan berdasarkan laporan ketika mencoba untuk membakukan sintaks CSS Anda, mis. Anda dapat menemukan warna di seluruh gaya dengan deklarasi warna berikut.
warna: #ccc; warna: #cccccc; warna: #CCC; warna: #CCCCCC;
Deklarasi warna ini melakukan hal yang sama. Anda mungkin juga pergi dengan #ccc atau dengan modal #CCC sebagai standar. CSS Dig dapat mengekspos redundansi ini untuk properti CSS lainnya juga, dan Anda akan dapat membuat kode Anda lebih konsisten.
