เมื่อเราเขียนสไตล์ หลังจากที่แก้ไข CSS ของเพจไปหลายเวอร์ชันแล้ว สไตล์บางสไตล์ก็อาจใช้ไม่ได้อีกต่อไป หรือบางสไตล์อาจถูกเปลี่ยนชื่อและสไตล์ดั้งเดิมก็ลืมที่จะลบออกไป สรุปก็คือ บางอย่างก็อาจไม่มีประโยชน์ เนื้อหาในรูปแบบหน้า การสิ้นเปลืองพื้นที่เซิร์ฟเวอร์และการใช้แบนด์วิธอย่างไร้ประโยชน์เหล่านี้จะทำให้ค่าบำรุงรักษาของเราเพิ่มขึ้นด้วย มีวิธีใดบ้างที่จะทำความสะอาดสไตล์ที่ไร้ประโยชน์เหล่านั้น? วันนี้เรามาดูเครื่องมือที่มีประโยชน์กันดีกว่า
ตัวเลือก Dust-Me
Dust-Me เป็นปลั๊กอิน Firefox ที่มีประโยชน์มากและใช้งานง่าย สามารถวิเคราะห์ไฟล์ CSS ทั้งหมดที่เรียกใช้ในเพจของคุณและวิเคราะห์ไฟล์ที่ไม่ได้ใช้ในหน้านั้น
รองรับไฟล์สไตล์ในเครื่องและระยะไกล รวมถึงไฟล์สไตล์ที่ใช้แท็ก <link>, คำแนะนำการประมวลผล <?xml-stylesheet?>, คำสั่ง @import ฯลฯ (แต่ไม่รองรับบล็อก <style> และสไตล์อินไลน์ในเพจ)
รองรับไฟล์สไตล์ที่แนะนำในความคิดเห็นแบบมีเงื่อนไขของ IE;
คุณสามารถตรวจสอบหน้าเดียวหรือทั้งเว็บไซต์ได้
รองรับตัวเลือก CSS1, ตัวเลือก CSS2 และ CSS3 ส่วนใหญ่;
ทำความเข้าใจว่าการแฮ็ก CSS ทั่วไป เช่น "* html #fuck-ie" จะถูกตีความว่าเป็น "html #fuck-ie";
รองรับ Firefox 3.5 และ Firefox 3.0 ที่จริงแล้ว ต้องขอบคุณการปรับปรุงเอ็นจิ้น js ของ FF 3.5 ทำให้ประสิทธิภาพใน FF 3.5 สูงกว่า FF 3.0 ถึง 50%
การติดตั้ง: คลิกที่นี่. ในเวลาเดียวกัน คุณสามารถดาวน์โหลดซอร์สโค้ดของโครงการได้ หากต้องการเรียนรู้เพิ่มเติม โปรดไปที่หน้าอย่างเป็นทางการของตัวเลือก Dust-Me
ความเร็วหน้า
Page Speed คือเครื่องมือวิเคราะห์ประสิทธิภาพส่วนหน้าที่จัดทำโดย Google มันค่อนข้างคล้ายกับ YSlow แต่มีเครื่องมือที่มีเอกลักษณ์และมีประโยชน์มากกว่า เช่น ลบ CSS ที่ไม่ได้ใช้:
Page Speed เช่น YSlow อาศัย Firebug สำหรับรายละเอียดและการติดตั้ง โปรดไปที่นี่
ตัวตรวจสอบความซ้ำซ้อน CSS
CSS Redundancy Checker เป็นแอปพลิเคชันออนไลน์ฟรีที่สามารถตรวจสอบทุกหน้าที่ใช้ไฟล์ CSS เพื่อหาสไตล์ที่ไม่มีประโยชน์ คุณสามารถตรวจสอบการใช้สไตล์บางอย่างได้หลายหน้าพร้อมกัน ข้อเสียของเครื่องมือนี้คือแม้ว่าจะสามารถตรวจสอบหน้า HTML ได้หลายหน้าในแต่ละครั้ง แต่ก็สามารถตรวจสอบไฟล์ CSS ได้ครั้งละหนึ่งไฟล์เท่านั้น และคุณต้องป้อนมันด้วยตนเอง:
IntelliJ IDEA
IntelliJ IDEA นี่เป็น IDE ที่ค่อนข้างทรงพลัง คล้ายกับ DreamWeaver แต่ไม่ค่อยมีคนใช้ในประเทศจีน ซอฟต์แวร์นี้มีเครื่องมือวิเคราะห์โค้ดแบบทันทีที่สามารถวิเคราะห์คลาสและรหัสที่ไม่ได้ใช้ในไฟล์ CSS
เว็บนิพจน์
Expression Web ซึ่งเป็นเครื่องมือพัฒนาเว็บไซต์รุ่นใหม่ของ Microsoft ยังคงถูกใช้โดยคนจำนวนมาก ฟังก์ชันรายงาน CSS สามารถตรวจสอบ CSS ที่ไม่ได้ใช้ซึ่งจำเป็นต้องล้าง (ฉันไม่เคยใช้ EW ในการพัฒนาเว็บไซต์เลย ฉันหวังว่าเด็กๆ ที่ใช้ซอฟต์แวร์นี้จะสามารถทำได้ ช่วยด้วย ตรวจสอบสิ่งนี้)
บทสรุป
แน่นอนว่าอาจมีเครื่องมืออื่นๆ ที่ไม่ได้กล่าวถึงในที่นี้ หากคุณรู้อะไรเกี่ยวกับเครื่องมือนี้ คุณสามารถแชร์กับทุกคนได้
นอกจากนี้ เรามักจะเขียนสไตล์ของทั้งเว็บไซต์ลงในไฟล์สไตล์หนึ่งไฟล์ขึ้นไป จากนั้นจึงเรียกสไตล์เหล่านั้นทั้งหมดในเพจหรือเรียกสไตล์เหล่านั้นในโมดูล ดังนั้น สไตล์ในไฟล์ CSS บางไฟล์อาจไม่สามารถใช้ได้ในบางหน้า ถูกใช้ในหน้าอื่น ๆ ดังนั้นเมื่อใช้เครื่องมือเหล่านี้เพื่อตรวจจับรูปแบบที่ซ้ำซ้อนในไฟล์ CSS คุณต้องใช้ความระมัดระวัง การล้างสไตล์อาจส่งผลต่อหน้าอื่น ๆ ดังนั้นผลการตรวจสอบที่ได้รับจาก Page Speed ใช้กับหน้าเดียวเท่านั้น ไม่เหมาะกับทั้งเว็บไซต์ ให้ใช้ Dust-Me หรือ CSS Redundancy แทน เมื่อใช้ Checker คุณสามารถตรวจสอบทั้งเว็บไซต์หรือหลายหน้าของเว็บไซต์พร้อมกันได้ ซึ่งอาจหลีกเลี่ยงข้อผิดพลาดได้
PS: ขอบคุณงานของ Knowledge Capsules เป็นอย่างมาก