ผู้เขียน หัวข้อ: WP Rocket ปลั๊กอิน Cache ที่เร็วและใช้งานง่ายที่สุดของ WordPress  (อ่าน 1098 ครั้ง)

0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้

ออฟไลน์ smf

  • [color=green][i]"ถ้าคุณไม่สามารถอธิบายอย่างง่ายๆ ให้คนอื่นเข้าใจได้แล้วล่ะก็ แสดงว่าคุณยังเข้าใจมันไม่ดีพอ"[/i][/color]
  • Administrator
  • Hero Member
  • *****
  • กระทู้: 1,368
  • พอยท์: 5
    • ดูรายละเอียด
    • pordoo.com
    • อีเมล์
WP Rocket


การแคช คือการ แคชนั้นก็คือการที่เราให้เซิฟเวอร์ทำการสร้างไฟล์โคลนนิ่งของหน้าเว็บต่างๆ ขึ้นมาพร้อมเสริฟให้กับผู้เข้าชม โดยกำหนดระยะเวลาได้ว่าจะให้แคชนั้นดำรงอยู่นานแค่ไหน ข้อดีของการสร้างแคชก็คือ ทำให้บราวเซอร์ไม่ต้องไปเรียกให้เซิฟเวอร์ประมวลผลทุกครั้งที่มีการเรียกดู หน้า กว่าจะเรียกหัว เรียกตัว เรียกหางมารวมกัน กินทั้งเวลาและทรัพยากร ดังนั้นการที่เราสร้างแคชไว้พร้อมเสริฟทันทีก็เป็นเรื่องที่ดีกับทั้งฝั่ง Server และ Client ส่วนข้อเสียก็คือ การที่เว็บยิ่งมีหน้าเยอะ ก็ยิ่งมีการสร้างไฟล์แคชเยอะขึ้นเท่านั้น ก็ทำให้กินพื้นที่มากตามไปด้วย ดังนั้นเราจึงต้องมีการกำหนดเวลาในการล้างแคชนั่นเองWP Rocketคือ ปลั๊กอินที่ว่านั้น โดยเครมว่าเป็นปลั๊กอินที่ตั้งค่าง่าย และช่วยให้เว็บไซต์เราเร็วขึ้นได้จริง แต่ WP Rocket นั้นไม่ใช่ปลั๊กอินฟรีนะคะ เราต้องจ่ายเงินเพื่อให้ได้ใช้งาน และไม่มีเวอร์ชั่นฟรีให้ใช้ด้วย แต่เนื่องจากประสิทธิภาพของมัน จึงทำให้มีการกล่าวถึงเป็นอย่างมากในสังคม WordPress ซึ่งผู้เขียนก็ได้ยินมาบ้าง และอยากลองมาตลอด จนสุดท้ายก็ต้องยอมควักกระเป๋าซื้อจนได้
WP Rocket เทียบกับปลั๊กอินอื่น


สิ่งหนึ่งที่ชัดเจนมากเลยคือการตั้งค่าที่ง่ายกว่ามากๆ ใครยังไม่แน่ใจ ลองไปอ่านของ WP Super Cache กับ W3 Total Cache ก่อนได้ และจริงๆ แล้ว ใช้คู่กับ Autoptimize  เพื่อทำการบีบอัด html, css, javascript อีกด้วย ตั้งกันไม่จบไม่สิ้นจริงๆ Downloadคุณสมบัติที่น่าสนใจ
  • Lazyload ปกติแล้วเราต้องติดตั้งปลั๊กอินเพิ่มเพื่อทำ lazyload image คือโหลดภาพเมื่อเลื่อนไปถึง แต่ทีนี้การใช้ปลั๊กอิน Lazyload แยกกันนั้น บางทีก็ตีกับปลั๊กอินแคชหรือปลั๊กอินที่ใช้บีบอัด html,css ทั้งหลาย ทำให้ทำงานไม่ได้ แต่ WP Rocket มีมาในตัวของมันเลย ตรงนี้ก็ตัดไป
  • Minify สำหรับการใช้ลดขนาด html, css นั้นมีมาในตัว ไม่ต้องลงอันอื่นเสริม แล้วไม่ต้องตั้งค่ามากมายด้วย และถึงไม่มีการตั้งค่ามากมายจำเพาะเจาะจง แต่กลับทำงานได้ดี แสดงว่าเขาเขียนมาให้มีประสิทธิภาพอยู่แล้ว และไม่ไปพังปลั๊กอินอื่นด้วย เช่น Facebook Comment เป็นต้น ผู้เขียนเคยจำใจต้องเลือกมาแล้ว แต่ใช้ WP Rocket มันจะรู้ว่าอันไหนควรปรับถึงแค่ไหน
  • CloudFlare มีการสนับสนุน CloudFlare ฟรี CDN มาในตัว ในขณะที่ตัวอื่นส่วนใหญ่จะสนับสนุนแต่ตัวเสียเงิน ไม่ก็ต้องลงแยกต่างหาก
  • Google Font แก้ปัญหาธีมที่มีการโหลด  Google Font
  • Ecommerce Friendly ทำการยกเว้นการแคชหน้าเว็บ ecommerce ที่สร้างจากปลั๊กอินยอดนิยมหลายตัว เช่น WooCommerce ทำให้ไม่มีปัญหาในการซื้อขายสินค้า
Basic Optionsจริงๆ แล้ว เฉพาะในส่วนของ Website นั้น ผู้เขียนตั้งค่าแค่นี้จริงๆ ค่ะ แค่หน้า Basic Options นี้อย่างเดียว  หากใครไม่ได้ใช้ CDN เช่น CloudFlare ก็ไม่จำเป็นต้องตั้งค่าในส่วนที่เหลืออีกก็ได้

Lazyload เป็นการเปิดการตั้งค่า Lazyload ให้กับภาพและวิดีโอที่เราแทรกในเว็บของเรา ช่วยทั้งทำให้การโหลดหน้าเร็วขึ้น และช่วยประหยัดแบนวิทให้กับคนอ่านด้วย
Files Optimisation  คือการย่อขนาดไฟล์  HTML, CSS, JavaScript โดย WP Rocket ได้เพิ่มในส่วนของ Google Font เข้าไปด้วย หากเว็บใครที่มีลูกเล่นเยอะๆ พบปัญหาว่าเปิดใช้งานในส่วนนี้แล้วการแสดงผลไม่ถูกต้อง ก็ให้ปิดออกค่ะ
Mobile Cache สร้างแคชสำหรับการเปิดเว็บในมือถือ โดยมีข้อแม้ว่าต้องไม่ใช้ปลั๊กอินโมบายเว็บต่างๆ ตามที่กล่าวในลิสต์
Clear Cache Lifespan คือการกำหนดระยะเวลาของการล้างแคชตามความเหมาะสมว่าเว็บเรามีความเคลื่อนไหว ของข้อมูลมากน้อยแค่ไหน และเรามีหน้าเว็บเยอะมั๊ย บางทีเยอะไปก็ทำให้กินพื้นที่ได้ ก็อาจจะล้างบ่อยขึ้น เป็น 12 ชั่วโมงครั้งก็ได้

Advanced Optionsอย่างที่เห็นด้านล่างว่า เราแทบไม่ได้ปรับแต่งอะไรเลย เพราะในหน้านี้ส่วนใหญ่เป็นการปรับแต่งแบบฮาร์ดคอร์ CSS และ JavaScript โดยตรง และเกี่ยวกับการเรียกสคริปสต์จากเว็บภาพนอก ซึ่งในเว็บเราก็ไม่มีอะไรมาก ส่วนใหญ่เป็น Google กับ Facebook ซึ่งก็ทำอะไรไม่ได้มากนัก

ส่วนที่ควรพิจารณาตั้งค่า คือ
Never Cache the following pages ตรงนี้เป็นหน้าที่เราไม่ต้องการให้แคช หน้าที่ไม่ค่อยมีคนเข้า เช่น หน้า Contact, Policy ส่วนหน้าของร้านค้าที่ใช้ปลั๊กอินเช่น WooCommerce นั้นระบบเขาเขียนมาให้ละเว้นโดยอัตโนมัติอยู่แล้วค่ะ หากใครใช้ปลั๊กอินที่ไม่อยู่ในรายชื่อ ก็ต้องใส่ลงไปเองนะคะ
Reducing the number of minified files in one file on: CSS, JS เป็น การสั่งให้ระบบบีบรวมไฟล์ CSS, JS เป็นไฟล์เดียว แต่มีข้อเสียคือ ถึงแม้จะทอสอบได้ Performance คะแนนสูง แต่ใช้เวลาในการโหลดนานกว่า คะแนน 90 ช้ากว่าคะแนน 80 เป็นต้น เพราะการโหลดไฟล์หลายไฟล์พร้อมกัน จะเร็วกวาการโหลดไฟล์ใหญ่ไฟล์เดียว ตัวอย่างเช่นเวลาเราโหลดโดยใช้โปรแกรม Internet Download Manager นั่นเอง

ส่วนที่เหลือด้านล่างก็เกี่ยว เนื่องกับข้อนี้หมด จริงๆ เหมาะกับคนที่ทำธีมหรือปรับแต่งธีมด้วยตัวเอง หรือมีความรู้พอสมควรที่พอจะรู้ว่าจะต้องโหลดไฟล์ไหนตอนไหนได้บ้าง และแต่ละธีมก็ไม่เหมือนกัน ตรงนี้เราก็ขอผ่านเช่นกันค่ะ

CDN
WP Rocket
  นั้นมาพร้อมกับการรองรับ CDN หลายเจ้าที่ให้เราสามารถตั้งค่าได้โดยอัตโนมัติ อย่างแท็บ CloudFlare ที่อยู่ใกล้ๆ กันนั้น ก็มาจากการเปิด CloudFlare ในแท็บ  CDN นี่เอง

CDN คือContent Delivery Network ที่เป็นเครือข่ายข้อมูลขนาดใหญ่กระจายอยู่ทั่วโลก โดยเขาจะเก็บไฟล์ต่างๆ ของเว็บเราไปสร้างแคชไว้ในระบบ ซึ่งเมื่อมีการเรียกเปิดจากตำแหน่งใหนในโลก ก็จะส่งข้อมูลที่ใกล้ที่สุดไปให้ ทำให้เวลาที่เช็คสปีดเน็ตจะเห็นผลที่ต่างกันชัดเจนมาก โดยเฉพาะประเทศที่เน็ตออกนอกช้า เช่น ไทยแลนด์

ส่วนคนที่ใช้ CloudFlare ก็ติ๊ก Enable CloudFlare แล้วก็กด Save Changes ไปก่อนนะคะ แล้วจะมีแท็บ ClouldFlare เพิ่มขึ้นมาชิดกันด้ายซ้าย


แท็บ CloudFlare นี้เขาก็จะให้เรากรอกข้อมูลต่างๆ เช่น CloudFlare API เขาจะบอกว่าหายังไง แล้วก็ใส่ Email ที่ลงทะเบียนไว้กับ CloudFlare และ โดเมน เรา ส่วนการตั้งค่าที่เหลือก็ตามด้านล่างก็ได้ค่ะ ทีนี้หากเราต้องการล้างข้อมูลแคชบน CloudFlare เราก็สามารถมากด Clear Cache ที่หน้านี้ได้เลยโดยไม่ต้องล็อกอินเข้า CloudFlare


Toolsเป็น ในส่วนของการ Clear Cache (ล้างแคชทั้งหมด) Preload cache (สร้างแคช) และการ Import/Export การตั้งค่าไว้ใช้งานกับเว็บอื่นๆ นั่นเองค่ะ


การเคลียร์แคช ล้างแคชปกติ นั้นปลั๊กอินจะตั้งไว้ให้เคลียร์อัตโนมัติเมื่อมีการ สร้าง อัพเดตบทความ อยู่แล้ว โดยจะล้างในหน้าที่มีการแก้ไขให้ หรือชี้ที่เมนู WP Rocket บน Toolbar แล้วเลือก
  • Clear Cache  เพื่อลบแคชทั้งหมด
  • Purge this URL เพื่อลบเฉพาะหน้าที่ดูอยู่
  • Preload cache สร้างแคชขึ้นมาอีกครั้งแบบไม่ต้องรอให้มีการเรียก

หรือจะ Clear Cache ในหน้าของ All Post ก็ได้เช่นกัน

สรุปจากการใช้งาน
บอก ได้เลยว่า WP Rocket เป็นปลั๊กอินที่ดีมากสำหรับปลั๊กอินแคชตัวหนึ่ง สมกับที่เป็นแบบเสียเงิน คือคุณสมบัติมันครบถ้วนดีจริงๆ เหมือนซื้อ 1 แต่ได้ถึง 3, 4, 5 และลดขั้นตอนการทำงายของเราไปได้เยอะ เราไม่ต้องลงปลั๊กอิน 2-3 ตัวเพื่อใช้งานร่วมกันให้ได้ผลลัพธ์เดียวนั้นทำได้ยากมาก โดยเฉพาะปลั๊กอินที่เกี่ยวกับการ Optimize แบบนี้ เพราะมักจะมีการทำงานที่กระทบกันเองและกระทบกับปลั๊กอินอื่นอยู่เสมอ ปรับมากก็พัง ปรับน้อยก็ไม่มีอะไรเปลี่ยนแปลง
นี่ก็เป็นผลจากการใช้ WP Rocket ร่วมกับ CloudFlare นะคะ ซึ่งถ้าผู้อ่านทดสอบกับโฮ้สต์ที่อยู่ในไทยโดยไม่ได้ใช้ CloudFlare หรือ CDN อื่นๆ ก็อาจจะใช้เวลามากกว่า เพราะเน็ตออกนอกเราช้านั่นเองค่ะ จะเห็นว่ามันไม่แสดงภาพในบทความ เป็นผลมาจาก Lazyload นั่นเองค่ะ แต่เราเปิดปกติก็จะเห็นค่ะ
ก่อนหน้านี้ใช้ W3 Total Cache + Autoptimize ส่วน Lazyload และ Facebook Comment ก็ต้องปิดเพราะได้รับผลกระทบ

gtmetrix
ส่วนรูปนี้คือใช้ CloudFlare ร่วมอีกแรง


หลังเปลี่ยนมาใช้ WP Rocket ตัวเดียว มีทุกอย่างครบ และสามารถใช้ Facebook Comment ได้

gtmetrix


toolspingdom แม้จะทำ Performance ได้ต่ำ แต่ทำเวลาได้ดีมาก
เทสชุดแรกที่ใช้ W3 Total Cache นั้นเราใช้ Hosteverdie นะคะ แต่เมื่อมาลองใช้การตั้งค่าเดียวกัน กับคนละโฮ้สต์คือ DigitalOcean ที่ ใช้อยู่ตอนนี้กลับได้ผลลัพธ์ที่ไม่เหมือกัน คือแย่กว่าเดิมมาก อันนี้จึงเป็นคำตอบว่า โฮ้สต์ก็มีส่วนอย่างมากเช่นกันค่ะ อันนี้ต้องขออภัยจริงๆ ที่ไม่ได้บันทึกก่อนและหลังของที่ DigitalOcean ไว้ เพราะถ้าจะมาทำตอนนี้ก็ต้องมีการเปลี่ยน DNS แล้วรออัพเดตอีก เพราะการใช้  CloudFlare ต้องชี้ DNS  ไปที่ CloudFlare ด้วยนั่นเอง ค่อนข้างวุ่นวายพอสมควร เลยขออธิบายพอแค่เห็นภาพแทน ที่เลือก W3 Total Cache เพราะเป็นตัวฟรีที่คุณสมบัติใกล้เคียงกับ WP Rocket ที่สุดแล้วนั่นเองค่ะ
ถ้าหากใครสนใจเรื่อง CloudFlare อาจจะลองเขียนให้ดูพอเป็นพื้นฐานนะคะ เพราะมันมีขั้น Advanced อีกเยอะเลยค่ะ
สำหรับคนที่ใช้ WP Rocket กับ CloudFlare แล้วเปิด Lazyload ภาพไม่มา ให้ปิดฟังชั่น Rocket Load บน CloudFlare ด้วยนะคะ
แนะนำที่เทสสปีด https://gtmetrix.com/, http://tools.pingdom.com/fpt/ แต่ละที่จะวัดและให้คะแนนไม่เหมือนกันนะคะ
ปลั๊กอินแคชอื่นๆ
ที่มา: http://www.wpthaiuser.com/wp-rocket/
« แก้ไขครั้งสุดท้าย: 23 มิถุนายน 2016, 16:56:56 โดย smf »