เคยรู้สึกมั้ย ว่าเว็บไซต์ของเราแสดงผลช้ากว่าที่ควรจะเป็น อาจจะเป็นเพราะ WordPress ของเราติดตั้ง Plugin มากเกินไป หรือใช้ Theme ที่ออกแบบมาไมดี ทำให้ต้องโหลดไฟล์ CSS และ JavaScript เยอะ ส่งผลเว็บประมวลผลช้า วิธีแก้ให้เรามาลองบีบอัด CSS และ JavaScript ให้เล็กลงโหลดเร็วขึ้นด้วย Autoptimize เถอะ

Autoptimize คืออะไร และทำงานยังไง

Autoptimize เป็นปลั๊กอินที่ช่วยบีบอัดและจัดการไฟล์ HTML CSS และ JavaScript ในเว็บไซต์ของเราให้เล็กลง โดยใช้วิธีลดบรรทัดของโค้ดด้วยการ Minify และการรวมไฟล์ประเภทเดียวกันให้เป็นไฟล์เดียวกัน ยกตัวอย่างเช่น หากเว็บไซต์ของเรามีไฟล์ CSS อยู่ 10 ไฟล์ เจ้าปลั๊กอินนี้ก็จะจับมารวมกันเป็นไฟล์เดียว ทำให้ Web Browser ลดจำนวนไฟล์ที่ต้องโหลดลง มีไฟล์ต้องประมวลผลน้อยลง ส่งผลให้การแสดงผลหน้าเว็บไซต์ของเราเร็วขึ้น

Autoptimize เป็นปลั๊กอินที่เป็นที่นิยมแพร่หลายเป็นอีกหนึ่งปลั๊กอินที่ควรมีติดเว็บเอาไว้ และยังสามารถใช้คู่กับปลั๊กอิน Cache ตัวอื่นเพื่อให้เว็บไซต์ของเราเร็วขึ้นไปอีกก็ได้

เริ่มบีบอัด CSS และ JavaScript กันเลย

เริ่มจากเข้าสู่ระบบ WordPress กันก่อน

ติดตั้งและเปิดใช้งานปลั๊กอิน Autoptimize
สำหรับใครที่ยังติดตั้งปลั๊กอินไม่เป็นก็ลองอ่านบทความนี้ดูก่อนนะ
>> ปลั๊กอิน WordPress คืออะไร ติดตั้งยังไง

หลังเปิดใช้งานปลั๊กอินแล้ว ให้เลื่อนเมาส์ไปที่ “Settings” แล้วคลิกที่ Autoptimize

ในหัวข้อ “JavaScript Options” ให้ติ๊ก “✔” ตามภาพด้านล่าง

1. Optimize JavaScript Code? – เปิดใช้งานการบีบอัด JavaScript
2. Aggregate JS-files? – ย่อและรวมไฟล์ JavaScript ทั้งหมดให้ไปอยู่ที่ footer

ต่อไปในหัวข้อ “CSS Options” ให้ติ๊ก “✔” ตามภาพด้านล่าง

1. Optimize CSS Code? – เปิดใช้งานการบีบอัด CSS
2. Aggregate CSS-files? – ย่อและรวมไฟล์ CSS (แบบเดียวกับ JavaScript)
3. Also aggregate inline CSS? – รวม CSS จาก HTML ของเว็บไซต์ของเรา
4. Inline and Defer CSS? – เอา CSS ที่ไม่จำเป็นออก

คลิก “Save Changes and Empty Cache”

เสร็จแล้วให้ลองเปิดเว็บไซต์ของเราดูว่าแสดงผลเร็วขึ้นมั้ย ลองตรวจดูทุกหน้าว่ามีจุดไหนแสดงผลผิดเพี้ยนหรือไม่ เพราะการ Minify Code อาจทำให้ Code บางส่วนทำงานผิดพลาดยกตัวย่างเช่น ข้อความแสดงผลทับกัน รูปหาย หรือข้อความหายไป หากพบจุดที่มีปัญหาให้ลองลด Option ที่เปิดใน Autoptimize ดู หรือไม่ก็ลองปิดปลั๊กอินดูว่าหายมั้ย