การเรียกคืนไฟล์ CSS ขนาดใหญ่ / เก่า


13

ขณะนี้ฉันกำลังทำงานกับเว็บไซต์ 100,000 หน้าการออกแบบในปัจจุบันมีมานานกว่า 5 ปีและการปรับปรุงอย่างต่อเนื่องส่งผลให้มีไฟล์ CSS ไลน์มากกว่า 12,000 ไฟล์

เห็นได้ชัดว่า CSS นั้นกลายเป็นเรื่องไม่สะดวกไปหลายรูปแบบได้ถูกทำซ้ำและแทบจะเป็นไปไม่ได้เลยที่จะรู้ว่ามีการใช้รูปแบบใดบ้าง

เราสามารถย่อขนาดได้ แต่นี่ไม่ใช่การแก้ปัญหาจริงๆเพียงแค่ชะลอการทำงานซ้ำอย่างหลีกเลี่ยงไม่ได้

ดังนั้นสามคำถามจะมีเครื่องมือออกมีสำหรับ ...

  • ยกเลิกการทำซ้ำไฟล์ CSS ขนาดใหญ่หรือไม่
  • สแกนไซต์และบันทึกคลาส CSS และ ID ใช้หรือไม่
  • สามารถทำการสแกนด้วยสคริปต์บางชนิด greasemonkey อาจจะ?

คำตอบ:


17

http://unused-css.com/ทำสิ่งที่คุณถามและพวกเขามีสิ่งที่จะพูด: -

Latish Sehgalได้เขียนแอปพลิเคชัน windows เพื่อค้นหาและลบคลาส CSS ที่ไม่ได้ใช้ ฉันยังไม่ได้ทดสอบ แต่จากคำอธิบายคุณต้องระบุพา ธ ของไฟล์ html ของคุณและไฟล์ CSS หนึ่งไฟล์ โปรแกรมจะแสดงรายการตัวเลือก CSS ที่ไม่ได้ใช้ จากภาพหน้าจอดูเหมือนว่าไม่มีวิธีการส่งออกรายการนี้หรือดาวน์โหลดไฟล์ CSS ใหม่ที่สะอาด ดูเหมือนว่าบริการจะ จำกัด ไฟล์ CSS หนึ่งไฟล์เท่านั้น หากคุณมีไฟล์หลายไฟล์ที่คุณต้องการล้างคุณต้องล้างไฟล์ทีละไฟล์

Dust-Me Selectorsเป็นส่วนเสริมของ Firefox (สำหรับ v1.5 หรือใหม่กว่า) ที่พบ CSS selector ที่ไม่ได้ใช้ มันแยกตัวเลือกทั้งหมดจากสไตล์ชีตทั้งหมดในหน้าเว็บที่คุณกำลังดูจากนั้นวิเคราะห์หน้านั้นเพื่อดูว่าตัวเลือกใดไม่ได้ใช้ จากนั้นข้อมูลจะถูกจัดเก็บเพื่อให้เมื่อทำการทดสอบหน้าถัดไปตัวเลือกสามารถถูกข้ามออกจากรายการเมื่อพบ เครื่องมือนี้น่าจะเป็นแหล่งรวมเว็บไซต์ทั้งหมด แต่น่าเสียดายที่มันสามารถทำงานได้ นอกจากนี้ฉันไม่เชื่อว่าคุณสามารถกำหนดค่าและดาวน์โหลดไฟล์ CSS โดยลบสไตล์ออก

Liquidcity CSS cleanerเป็นสคริปต์ php ที่ใช้นิพจน์ทั่วไปเพื่อตรวจสอบสไตล์ของหนึ่งหน้า มันจะบอกชั้นเรียนที่ไม่สามารถใช้ได้ในรหัส HTML ฉันยังไม่ได้ทดสอบวิธีแก้ปัญหานี้

Deadweightเป็นเครื่องมือครอบคลุม CSS ด้วยชุดของสไตล์ชีทและชุดของ URL มันจะกำหนดตัวเลือกที่ใช้จริงและรายการที่สามารถลบได้อย่างปลอดภัย เครื่องมือนี้เป็นโมดูลทับทิมและจะทำงานกับเว็บไซต์ทางรถไฟเท่านั้น ตัวเลือกที่ไม่ได้ใช้จะต้องถูกลบออกจากไฟล์ CSS ด้วยตนเอง

Helium CSS เป็นเครื่องมือจาวาสคริปต์สำหรับการค้นพบ CSS ที่ไม่ได้ใช้ในหลาย ๆ หน้าบนเว็บไซต์ ก่อนอื่นคุณต้องติดตั้งไฟล์ javascript ไปยังหน้าที่คุณต้องการทดสอบ จากนั้นคุณต้องเรียกใช้ฟังก์ชันฮีเลียมเพื่อเริ่มการทำความสะอาด

UnusedCSS.com เป็นเว็บแอปพลิเคชันที่มีส่วนต่อประสานที่ใช้งานง่าย พิมพ์ URL ของเว็บไซต์และคุณจะได้รับรายชื่อตัวเลือก CSS สำหรับตัวเลือกแต่ละตัวตัวเลขจะระบุว่ามีการใช้ตัวเลือกกี่ครั้ง บริการนี้มีข้อ จำกัด เล็กน้อย ไม่สนับสนุนคำสั่ง @import คุณไม่สามารถกำหนดค่าและดาวน์โหลดไฟล์ CSS ใหม่ได้

CSSESSเป็น bookmarklet ที่ช่วยให้คุณค้นหา CSS selector ที่ไม่ได้ใช้ในเว็บไซต์ใด ๆ เครื่องมือนี้ใช้งานง่าย แต่ไม่อนุญาตให้คุณกำหนดค่าและดาวน์โหลดไฟล์ CSS ที่สะอาด มันจะแสดงรายการไฟล์ CSS ที่ไม่ได้ใช้เท่านั้น

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.