บทเรียน WP Rocket ในการปรับความเร็วเว็บไซต์

บทเรียน WP Rocket ในการปรับความเร็วเว็บไซต์
David Kaufmann
บทเรียน SEO
7 min read

การปรับความเร็วในการโหลดของหน้าสำคัญมากขึ้นสำหรับอิทธิพลต่อการจัดอันดับเครื่องมือค้นหาและแน่นอน บนประสบการณ์ของผู้ใช้กับเว็บไซต์ของเรา ภายในระบบนิเวศ WordPress plugins ที่แตกต่างอยู่ร่วมกันเป็นเวลาหลายปี เช่น WP Super Cache, W3 Total Cache, Swift Performance และ WP Rocket

เราต้องการรวบรวมคู่มือฉบับสมบูรณ์เกี่ยวกับอันหลังเพื่อไม่ให้คุณหลงทางในตัวเลือกมากมายและได้ประสิทธิภาพที่ดีที่สุดจากความเร็วในการโหลดเว็บไซต์ ไป!

WP Rocket คืออะไร?

WP Rocket เป็น plugin ที่ถือกำเนิดเป็นโซลูชันสำหรับการปรับ cache ที่แตกต่างใน WordPress วันนี้มันคือมากกว่ามาก และเราสามารถปรับไม่เพียง cache แต่แทบทุกอย่างที่เกี่ยวข้องกับการปรับประสิทธิภาพการโหลดเว็บไซต์

เพื่อแสดงผลกระทบ ดู ประสิทธิภาพของเว็บไซต์ของเราเองพร้อมและไม่มี WP Rocket:

ผลลัพธ์ GTMetrix
ผลลัพธ์ GTMetrix

ทำไมใช้ WP Rocket?

แม้เราพูดว่ามีทางเลือกอื่นสำหรับการปรับ WPO และทุกคนเสรีที่จะใช้สิ่งที่เห็นว่าเหมาะสม ในกรณีของเรา เรามีความชอบพิเศษสำหรับ WP Rocket อินเทอร์เฟซที่ใช้ง่ายที่ทำงานด้วยการคลิก checkbox ตัวเลือกหลายอย่างที่เสนอสำหรับการกำหนดค่า cache และการโหลดทรัพยากร ทำให้ WP Rocket เป็นที่ชอบของเราในตัวเลือกทั้งหมด

เมนูหลัก WP Rocket

สมมติว่าเราไม่มีปัญหาในการติดตั้ง WP Rocket มาเริ่มอธิบายอินเทอร์เฟซและตัวเลือกที่แตกต่างที่มีสำหรับการปรับ เมื่อคุณคลิกแท็บ dashboard หน้าจอต่อไปนี้ปรากฏ:

เมนูหลัก wp rocket
เมนูหลัก wp rocket

ข้อความต้อนรับและตัวเลือกที่เราสามารถทิ้งในตอนแรก แต่ที่เราจะอธิบายที่นี่

บัญชีของฉัน

หากคุณซื้อ WP Rocket กล่อง "ดูบัญชีของฉัน" จะนำคุณไปยังหน้าผู้ใช้ WP Rocket เพื่อให้เมื่ออยู่ที่นั่น คุณสามารถทำให้สมบูรณ์และตรวจสอบทุกอย่างที่เกี่ยวข้องกับโปรไฟล์ผู้ใช้: ข้อมูล การออกใบเรียกเก็บเงิน ฯลฯ

RocketCDN

RocketCDN เป็นบริการ CDN ที่ WP Rocket เสนอเมื่อค่อนข้างไม่นาน เป้าหมายคือให้เครื่องมือที่จำเป็นในการบรรลุประสิทธิภาพที่ดีที่สุดโดยไม่ต้องหาโซลูชันนอก plugin มีบริการ CDN อื่น ที่ได้รับความนิยมมากและมีประสิทธิภาพเช่น Cloudflare หรือ Amazon CloudFront

การสมัครสมาชิกรายเดือนของ wprocket cdn
การสมัครสมาชิกรายเดือนของ wprocket cdn

สถานะของฉัน

ภายในตัวเลือกนี้เรามีสองสวิตช์ในการเปิดใช้:

  • Rocket Tester: เป็นโปรแกรมการปรับปรุงของ WP Rocket สำหรับการทดสอบเวอร์ชัน BETA คุณต้องติดต่อพวกเขาผ่านอีเมล

  • Rocket Analytics: คุณยอมรับแบ่งปันข้อมูลประสิทธิภาพ WordPress แบบไม่ระบุตัวตนกับทีมพัฒนาเพื่อช่วยปรับปรุง WP Rocket

มีน้อยที่จะพูดที่นี่ นี่เป็นการตัดสินใจส่วนตัวที่ไม่ควรส่งผลต่อประสิทธิภาพ

การกำหนดค่า Cache ใน WP Rocket

ถึงเวลาเข้าตัวเลือกการกำหนดค่าและเราจะเริ่มกับ cache:

ตัวเลือก cache wp rocket
ตัวเลือก cache wp rocket

ในแท็บที่สองของ plugin เราสามารถเห็นตัวเลือก cache ที่เสนอ จำได้ว่าใน WP Rocket เรากำลังปรับ cache ของหน้าและตามที่เราจะเห็นตอนนี้ เรายังมีตัวเลือกสำหรับผู้ใช้ที่ login แต่เราต้องระวังกับตัวเลือกนี้

Mobile Cache

ปกติเมื่อเราพูดถึงมือถือ เรายังรวมแท็บเล็ต แต่คราวนี้เรากำลังพูดถึงเฉพาะอุปกรณ์มือถือ WP Rocket ตรวจจับผ่าน user agent ว่าเรากำลังเรียกดูจากสมาร์ทโฟน

เราจะเปิดใช้ตัวเลือกนี้เสมอ เพราะ โดยทั่วไป การออกแบบเดสก์ท็อปและมือถือแตกต่าง เว้นแต่ เราไม่มีเวอร์ชัน responsive ตัวเลือกนี้จะเปิดใช้เสมอ เพื่อให้ชัดเจน ทำไมเราต้องการให้บริการ 2 เวอร์ชัน cached หากการออกแบบเหมือนกัน? กล่าวอีกนัย หากเราไม่มีเวอร์ชันมือถือ เราไม่ต้องการให้ cache นี้ถูกจัดการต่างกัน ใช่ไหม?

นี่คือที่เพิ่มข้อยกเว้น เมื่อเรามีเวอร์ชันมือถือพร้อมทรัพยากรหรือองค์ประกอบที่โหลดเฉพาะในเวอร์ชันนั้น เราจะบันทึกไฟล์แยก

ตัวอย่าง:

  • เรามีโฆษณาที่บนมือถือโหลด JS ที่เวอร์ชันเดสก์ท็อปไม่มี

ในกรณีนี้เราจะบันทึกไฟล์แยกสำหรับมือถือ

User Cache

User cache เป็นตัวเลือกที่ WP Rocket ให้สำหรับผู้ใช้ที่เรียกดูในขณะที่ login

cache ผู้ใช้ที่ login
cache ผู้ใช้ที่ login

โดยเปิดใช้ตัวเลือกนี้ เราสามารถเสนอเวอร์ชัน cache ที่เป็นรายบุคคลสำหรับผู้ใช้แต่ละคน สิ่งที่ดีที่สุดคือเปิดใช้หากผู้ใช้ login แต่คุณต้องระวังเป็นพิเศษว่าหน้าใดที่ cached และไม่ใช่ เพราะหากผู้ใช้ป้อนข้อมูลส่วนตัว (ตัวอย่างเช่น ข้อมูลธนาคาร) การเก็บใน cache อาจทำให้เราเกิดปัญหาทางกฎหมาย

วิธียกเว้นหน้าจาก cache?

หากต้องการหลีกเลี่ยงปัญหาประเภทนี้ สิ่งที่ดีที่สุดคือไปยังหน้าที่ต้องการยกเว้นโดยตรงและในตัวเลือก WP Rocket (sidebar หรือด้านล่าง) เลือก "never cache this page"

วิธียกเว้นหน้าจาก cache
วิธียกเว้นหน้าจาก cache

Cache Lifespan

ในส่วนนี้เราเพียงต้องระบุระยะเวลาที่ต้องการสำหรับไฟล์ cache ที่สร้าง คือ WP Rocket สร้างไฟล์บันทึกเวอร์ชันของหน้า และไฟล์นี้จะเป็นที่ส่งไปยังผู้ใช้เมื่อเข้าเว็บไซต์

ผ่านตัวจัดการกระบวนการ (CRON) ไฟล์ที่สร้างที่เกินระยะเวลาที่ระบุจะถูกลบและใหม่จะถูกสร้าง

สิ่งที่ต้องคำนึง

WP Rocket คำนึงถึงกระบวนการบางอย่างในการลบและสร้างไฟล์ cache ใหม่ ซึ่งเป็นดังนี้:

  • การสร้างรายการ หน้า หมวดหมู่ taxonomies หรือการแก้ไขใหม่

  • การสร้างและแก้ไขโมดูลใหม่ widgets หรือองค์ประกอบใดของเว็บไซต์

  • เมื่อการกำหนดค่า WP Rocket ที่ส่งผลต่อ frontend ถูกเปลี่ยน

มิฉะนั้น คุณต้องจำว่าการเก็บไฟล์ cache ใช้พื้นที่บนเซิร์ฟเวอร์และพื้นที่นี้จำกัด ก็แนะนำให้ล้าง cache จาก WP Rocket เพื่อให้อัปเดตและไม่มีไฟล์ที่ไม่จำเป็นอีกต่อไป

สำหรับเวลา คุณสามารถทิ้งค่าเริ่มต้น

การปรับไฟล์ใน WP Rocket

หลังจากผ่านการกำหนดค่า cache โดยย่อ ถึงเวลาทำงานบนการปรับไฟล์ การปรับไฟล์ทำเพื่อทำให้การโหลดและการเรนเดอร์ HTML เบาขึ้น เราสามารถทำงานบนการปรับนี้อย่างไร?

ในหลายวิธี:

  • โดยลดน้ำหนักไฟล์

  • โดยลบไฟล์ที่ไม่จำเป็น และ

  • โดยดำเนินการไฟล์ก้าวหน้าเมื่อต้องการ

การปรับไฟล์ CSS, JS และ HTML
การปรับไฟล์ CSS, JS และ HTML

ไฟล์ CSS

ไฟล์ CSS รับผิดชอบส่วนภาพของเว็บไซต์ แผ่นสไตล์ที่ให้รูปร่าง สี และสไตล์แก่ WordPress ของเรา ในด้านนี้ การออกแบบที่น่าสนใจอาจไม่เป็นการออกแบบที่ปรับ เพราะผู้ออกแบบเมื่อสร้าง CSS อาจไม่ปฏิบัติตามกฎการปรับพื้นฐานชุด

ในปัญหาที่พบบ่อยที่สุดที่เรามักพบกับแผ่นสไตล์คือ:

  • ไฟล์ CSS หนัก

  • ไฟล์ CSS ที่โหลดบนหน้าที่ไม่ใช้สไตล์เหล่านั้น

  • ไฟล์ CSS ที่สร้างไม่ดี

  • โหลด CSS ภายนอกมากเกินไป

  • ใช้ @import ในการนำแผ่นสไตล์ภายนอก

สรุป มีโลกของปฏิบัติที่บ่อยใช้ที่ไม่แนะนำสำหรับการปรับการออกแบบที่ดี แต่มาดูสิ่งที่ WP Rocket เสนอ

Minify ไฟล์ CSS

ตัวเลือกนี้มุ่งหวังลดน้ำหนักของไฟล์ CSS โดยลบช่องว่างและตัวขึ้นบรรทัดใหม่ WP Rocket ใช้งานโดยเปิดใช้ checkbox

เคล็ดลับ SEO Alive: เมื่อใดที่เราดำเนินการ เป็นไอเดียดีที่จะลองโหลดเว็บไซต์เพื่อดูว่าทุกอย่างถูกต้อง ทำในโหมดไม่เก็บประวัติของเบราว์เซอร์

ปรับ minify wprocket
ปรับ minify wprocket

กระบวนการแสดงในภาพต่อไปนี้ที่ดึงจากเครื่องมือ minifier.org

minify css
minify css

รวมไฟล์ CSS

คุณสมบัตินี้ดำเนินการประเภท "copy and paste" ของโค้ดจาก CSS หนึ่งไปยังอีกอันเพื่อหลีกเลี่ยงการโหลดไฟล์ CSS หลายอันและมีเพียงหนึ่ง

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

สิ่งที่อุดมคติคือโหลดโค้ดที่ใช้โดย URL ตรวจสอบกล่องและทดสอบกับเครื่องมือเช่น GTMETRIX เพื่อดูว่าคุณปรับปรุงความเร็วในการโหลด

ประโยชน์ของ การรวมไฟล์ CSS คือลด requests ไปยังเซิร์ฟเวอร์

ปรับการโหลด CSS

WP Rocket ถูกอัปเดตคำนึงถึงคำแนะนำที่ให้โดยเครื่องมือ Google ต่างๆ สำหรับการปรับความเร็วในการโหลด หากเรามีประสบการณ์กับเครื่องมือเหล่านี้ เราแน่นอนพบกับคำเตือน "Eliminate render-blocking resources" โดยเปิดใช้ check นี้ เราป้องกัน CSS จากการบล็อกการโหลดโดยทำให้โหลดแบบ asynchronous

คือ การเรนเดอร์ HTML ไม่หยุดเมื่อต้องดาวน์โหลดไฟล์ CSS ไฟล์นี้โหลดในพื้นหลัง ป้องกันกระบวนการโหลดจากการหยุด ดังนั้นคุ้มค่าเปิดใช้

ไฟล์ JS (JavaScript)

JavaScript เป็นหนึ่งในปัญหาใหญ่ที่ Google พบเมื่อประมวลผล HTML โดยไม่เข้าลึกในประเภทภาษานี้ WP Rocket ออกแบบ 5 การกระทำพื้นฐานในการปรับไฟล์ประเภทนี้ มาดู!

Remove jQuery Migrate

jQuery Migrate เป็น JavaScript library ที่อนุญาตความเข้ากันได้กับโค้ด jQuery ที่พัฒนาสำหรับเวอร์ชัน jQuery ก่อน 1.9 library นี้มาเนทีฟใน WordPress แต่แทบไม่มีการใช้ (plugins บางตัวอาจต้องการ)

ด้วยการกระทำนี้ เราต้องการหลีกเลี่ยง request ที่ไม่จำเป็นและการโหลด JS ที่จะไม่ใช้ ปิดใช้และเรียกดูผ่านเว็บไซต์เพื่อดูว่าทุกอย่างทำงานถูกต้อง!

Minify ไฟล์ JavaScript

เช่นเดียวกับที่อธิบายกับไฟล์ CSS การกระทำนี้จะถูกใช้กับไฟล์ JS ลดขนาดของไฟล์ JS เล็กน้อย

รวมไฟล์ JavaScript

อีกการกระทำคล้ายกับโมดูลปรับ CSS จำได้ว่าเมื่อเราเปิดใช้ checkboxes เหล่านี้เราต้องยืนยันว่าทุกอย่างทำงานเหมือนเดิม

โหลดไฟล์ JavaScript แบบ deferred

การโหลด deferred ของ js
การโหลด deferred ของ js

check บนการกระทำนี้ทำสองการปรับปรุงในประสิทธิภาพ:

  • เพิ่มแอตทริบิวต์ "defer" ให้ JS เพื่อป้องกันการเรนเดอร์ HTML จากการหยุดเนื่องจากการโหลด JS ด้วยการกระทำนี้ ดาวน์โหลดควบคู่และดำเนินการที่ปลายของการประมวลผล HTML

  • ย้าย JS ที่บล็อกการเรนเดอร์เริ่มต้น

WP Rocket เตือนเราว่าการเปิดใช้ประเภทนี้อาจทำให้เกิดปัญหา ด้วยเหตุนี้แนะนำโหมดปลอดภัยเพื่อหลีกเลี่ยงปัญหาการโหลดขององค์ประกอบที่จำเป็นสำหรับการแสดงที่ถูกต้องของหน้า

โหมด jquery ปลอดภัย
โหมด jquery ปลอดภัย

Delay JavaScript execution

อีกตัวเลือกในการเลื่อนการดำเนินการของ JavaScript ที่ไม่จำเป็นจนกว่าผู้ใช้โต้ตอบกับหน้า การกระทำนี้ดูเหมือนไม่สำคัญมาก แต่อนุญาตให้เราได้เวลาสำหรับการโหลดที่จะเกิดเร็วขึ้น การโต้ตอบสามารถเป็น click, scroll, mouse movement...

การปรับ Media

ในแท็บนี้ เราจะครอบคลุมการปรับองค์ประกอบสำคัญในขั้นตอนแรกของการปรับ WPO เรากำลังพูดถึงรูปภาพ วิดีโอ iframes และองค์ประกอบที่สร้างใน WordPress ที่ฟังก์ชันอย่างน้อยเป็นที่น่าสงสัย

การปรับ media wp rocket
การปรับ media wp rocket

Lazyload

การกระทำที่จำเป็นในการปรับความเร็วในการโหลดใด ฟังก์ชัน Lazyload ทำให้องค์ประกอบเช่นรูปภาพ วิดีโอ และ iframes ไม่โหลดจนกว่าจำเป็นในการแสดง

ขอผมให้ตัวอย่าง เมื่อเราเลื่อน รูปภาพโหลด ลองนึกภาพว่าการโหลดหน้านี้จะเป็นอย่างไรหากรูปภาพ 30 อันโหลดทั้งหมดในครั้งเดียว โดยเฉพาะหากผู้ใช้ยังไม่ดูในตอนแรก

Emoji

เบราว์เซอร์รวมอีโมจิของตัวเองแล้ว ดังนั้นเราสามารถประหยัด request ที่ทำหากเราไม่เปิดใช้ check นี้ คำแนะนำของผมคือคุณเปิดใช้

เนื้อหาที่ฝัง

ป้องกันคนอื่นจากการฝังเนื้อหาจากเว็บไซต์ของคุณและยังป้องกันคุณจากการฝังเนื้อหาจากเว็บไซต์ที่ไม่ได้รับอนุญาต requests ที่ทำกับ JS นี้ลด

ความเข้ากันได้ WebP

WebP เป็นรูปแบบที่ค่อนข้างใหม่ที่ Google แนะนำประมาณ 2010 สำหรับการบีบอัด lossy ของกราฟิก 24-bit บนเว็บ ปรับปรุงการให้ทรัพยากรเหล่านี้เพื่อเร่งการโหลด

ปัจจุบันไม่ใช่ทุกเบราว์เซอร์รองรับ ดังนั้นคุณต้องระวังและรู้ว่าเบราว์เซอร์ใดที่ผู้ใช้ใช้เมื่อทำงานกับรูปแบบนี้ เปิดใช้ตัวเลือกนี้หากคุณทำงานกับรูปภาพ WebP

ความเข้ากันได้ webp
ความเข้ากันได้ webp

การกำหนดค่า Cache Preloading

เราต้องเข้าใจดีว่าไฟล์ cache ของ WP Rocket ถูกสร้างอย่างไรเพื่อเข้าใจฟังก์ชัน Preload

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

cache preloading ใน wprocket
cache preloading ใน wprocket

Preload Cache

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

sitemap เป็นไฟล์ที่สร้างที่ URL ของเว็บไซต์ของเราถูกแสดง กับ plugins เช่น "Rank Math" หรือ "Yoast" เราสามารถสร้างได้ง่าย หากต้องการเห็น วิธีสร้าง sitemap กับ Rank Math ที่นี่เราแสดง

preload กับ rank math sitemap
preload กับ rank math sitemap

นี่คือฟังก์ชันที่ WP Rocket รวมในเวอร์ชันล่าสุด เป้าหมายคือคาดการณ์การโหลดของ "หน้าถัดไปที่ผู้ใช้จะเยี่ยม" เมื่อเลื่อนเคอร์เซอร์เหนือ การโหลดหน้าก่อนล่วงหน้าเกิดในกรณีที่ผู้ใช้คลิกลิงก์

WP Rocket ใช้ฟังก์ชันนี้ที่ plugins เฉพาะเช่น "Flying Pages" ใช้งานแล้วในการปรับปรุงความคล่องในการนำทางภายในเว็บไซต์ (ประสบการณ์ผู้ใช้) ที่กล่าวว่า นี่ไม่ใช่ปัจจัยที่ปรับปรุงเวลาในการโหลด และคุณจะไม่เห็นการปรับปรุงในเมตริกเครื่องมือ WPO audit

DNS Request Preloading

DNS request preloading สะดวกมากเมื่อเราใช้ทรัพยากรบุคคลที่สามเช่น YouTube, Facebook ฟอนต์หรือ iframes ที่เราขอบ่อย

การ preload DNS requests
การ preload DNS requests

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

ตามที่เราเห็นในตัวอย่าง จำเป็นเพียงใช้ชื่อโดเมน //youtube.com //facebook.com

การแก้ DNS ใช้เวลาประมาณ 20 ถึง 120 มิลลิวินาที ตามที่ GTMETRIX บ่งชี้ เบราว์เซอร์จะไม่ดาวน์โหลดอะไรจาก host จนกว่ากระบวนการนี้สมบูรณ์

dns lookup
dns lookup

Preload Fonts

การ preload ฟอนต์ต้องการขั้นตอนก่อน คือดาวน์โหลดฟอนต์และมีบนเซิร์ฟเวอร์ของเรา เมื่ออยู่ที่นั่น เราสามารถทำการกระทำเดียวกันที่ทำกับ cache preload ทำเวอร์ชันที่เร็วกว่ามากของไฟล์ฟอนต์และให้แก่ผู้ใช้เมื่อเชื่อมต่อหน้า

การ preload ฟอนต์
การ preload ฟอนต์

เมื่อฟอนต์ถูก host เราจะระบุ WP Rocket เส้นทางที่แม่นยำของฟอนต์ที่ใช้ แนะนำไม่ให้ใช้ฟอนต์ที่แตกต่างมากเกินไปบนหน้าของเราเพราะต้องการการดาวน์โหลดที่แตกต่าง สังเกตด้วยว่า requests ไปยังเซิร์ฟเวอร์ทำกับการแปรที่แตกต่างของฟอนต์ ขอผมอธิบาย:

  • ฟอนต์ Bold --> 1 request

  • ฟอนต์ขีดเส้นใต้ --> 1 request

  • ฟอนต์ตัวพิมพ์ใหญ่ --> 1 request

การกำหนดค่ากฎขั้นสูงของ WP Rocket

กฎขั้นสูงกับ wprocket
กฎขั้นสูงกับ wprocket

ไม่ cache URL เหล่านี้

มี URL บางอันที่เนื่องจากความเฉพาะ เราไม่ต้องการให้บันทึกเวอร์ชัน cached จากแท็บนี้ WP Rocket อนุญาตให้เราป้อนรายการ URL ที่ไม่ต้องการให้ cached

ไม่ cache cookies เหล่านี้

WP Rocket ให้เครื่องมือควบคุมอีกอันนอกเหนือจากทำโดย URL plugins หลายอันทำงานกับ cookies ของตัวเองหรือเราสามารถติดตั้งของเราเองในการระบุผู้ใช้บางคน มีหลายวิธีในการใช้ไฟล์เล็กเหล่านี้

ด้วย WP Rocket เราสามารถหยุด cache URL ที่ระบุโดย ID cookie เมื่อดาวน์โหลดในเบราว์เซอร์ของผู้ใช้ ดังนั้นกำหนดเองประเภทของ URL ที่ต้องการให้ cached เพิ่มเติม

ไม่ cache user agents เหล่านี้

user agent เป็นฟิลด์บรรยายภายในโปรโตคอล HTTP ใช้ให้ข้อมูลเกี่ยวกับอุปกรณ์ที่ทำ request รู้ข้อมูลนี้ เราสามารถป้องกันหน้า cached จากการส่งไปยัง user agents เหล่านี้

ตัวอย่างเช่น หนึ่งใน user agents ของ Google คือ Googlebot ดังนั้นโดยบ่งชี้ในส่วนนี้ของเว็บ ทุกครั้งที่เข้าเว็บไซต์ของเราเราจะเสนอหน้าโดยไม่มี cache

ล้าง URL เหล่านี้เสมอ

ตัวเลือกนี้น่าสนใจมากสำหรับประเภท URL ที่ตัวอย่างเช่น คุณสนใจในการให้ไฟล์ cache ลบเสมอเมื่ออัปเดต

ตัวอย่างเช่น ผมมี URL ที่มีผลกีฬาและสิ่งที่ผมไม่ต้องการคือส่งเวอร์ชัน cached ให้ผู้ใช้ เพราะผลถูกอัปเดตบ่อยมาก

ล้าง url เสมอ
ล้าง url เสมอ

Cache query strings เหล่านี้

Query strings เป็นข้อมูลที่ถูกส่งเมื่อทำ request ไปยังหน้าเว็บผ่าน URL

ปกติระบุโดยสัญลักษณ์เครื่องหมายคำถาม "?" และโดยทั่วไป WP Rocket ไม่ cache URL ประเภทนี้ ในตัวเลือกนี้เราสามารถบังคับให้ทำ

การกำหนดค่าฐานข้อมูลกับ WP Rocket

ตามที่เราพูดซ้ำตลอดบทความ WP Rocket หยุดเป็นแค่ plugin cache เพื่อกลายเป็น plugin ในการปรับความเร็วในการโหลดของเว็บไซต์ ในส่วนการกำหนดค่านี้ เราสามารถเจาะลึกการปรับฐานข้อมูล

การปรับฐานข้อมูล wordpress
การปรับฐานข้อมูล wordpress

ขณะที่เราทำงานบนเนื้อหาภายใน WordPress เราสร้างประเภทอื่นของข้อมูลที่ไม่มีประโยชน์และทำร้ายประสิทธิภาพของเว็บไซต์ของเรา สำหรับนี้ WP Rocket ให้เครื่องมือนี้ในการล้างที่ค่อนข้างละเอียด

Post cleanup

ตามที่เราเห็นในภาพ มี 3 องค์ประกอบที่อาจใช้พื้นที่ในฐานข้อมูลโดยไม่สนใจ เมื่อเราอัปเดตเนื้อหา เวอร์ชันก่อนหน้าถูกบันทึก auto-draft ของสิ่งที่เรากำลังแก้ไขก็ถูกสร้าง และรายการที่ทิ้ง

หากเราลบองค์ประกอบเหล่านี้ เราจะปลดปล่อยพื้นที่ในฐานข้อมูล

Comments cleanup

ส่วนนี้สำคัญเพราะบางครั้งฐานข้อมูลของเราเต็มไปด้วยความคิดเห็น "spam" ด้วยเหตุนี้ WP Rocket แนะนำตัวเลือกนี้ในการล้างองค์ประกอบประเภทนี้

wp rocket comments cleanup
wp rocket comments cleanup

Transients Cleanup

เมื่อเรากำลังทำงานใน WordPress องค์ประกอบ transient บางอย่างถูกสร้างที่เราสามารถลบโดยไม่มีปัญหาเพราะจะถูกสร้างใหม่

Database Cleanup

ทั้งจุดนี้และจุดถัดไป ผมแนะนำทำ backup ของฐานข้อมูล เพราะแม้ว่าไม่ควรเกิดอะไร การเข้าลึกกว่าในการกระทำภายในฐานข้อมูลมีความเสี่ยงเสมอ ดังนั้นไม่เป็นไอเดียแย่ในการทำ backup

ปรับฐานข้อมูล
ปรับฐานข้อมูล

การเปิดใช้ check นี้จะดำเนินการล้างของตารางฐานข้อมูล กระบวนการนี้สามารถอัตโนมัติ

การกำหนดค่า CDN กับ WP Rocket

ก่อนเจาะลึกในการกำหนดค่า CDNs กับ WP Rocket ผมต้องการ อธิบายว่า CDN คืออะไรและทำไมใช้

CDN คืออะไร?

CDN (Content Delivery Network) เป็นบริการที่วัตถุประสงค์คือ ปรับปรุงความเร็วในการโอนเนื้อหาให้ผู้ใช้ ในการทำเช่นนี้ สร้างเครือข่ายการกระจายเนื้อหาในเซิร์ฟเวอร์ที่แตกต่างทั่วโลกเพื่อย่อเวลาในคำขอทรัพยากรของผู้ใช้ คือ หากผู้ใช้อยู่ใน Brazil CDN เสนอเนื้อหาที่ host บนเซิร์ฟเวอร์ใกล้กว่าเซิร์ฟเวอร์ web hosting จริง

cdn ทำงานอย่างไร
cdn ทำงานอย่างไร

ภาพดึงจากหน้า WP Rocket

CDN ทำงานอย่างไร?

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

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

การกำหนดค่า cdn wp rocket
การกำหนดค่า cdn wp rocket

RocketCDN

WP Rocket ให้เราความเป็นไปได้ในการจ้าง CDN ที่ราคา 7.99 ดอลลาร์ต่อเดือน น้อยกว่า 7 ยูโร

CDN

เมื่อเราจ้าง CDN เราได้ข้อมูลในการใช้ หนึ่งในองค์ประกอบที่ให้คือ CNAME แม้ว่าหากไม่ได้ให้ เราสามารถได้

CNAME เป็นประเภทของ DNS record ที่แมป ชื่อโดเมนต้นทางไปยังชื่อโดเมนเป้าหมาย

cdn cname กับ wprocket
cdn cname กับ wprocket

ในการใช้ฟังก์ชันนี้เราเพียงต้องบ่งชี้ CNAME นั้นและบอกสำหรับไฟล์ใดที่เราต้องการ

ยกเว้นไฟล์จาก CDN

ตัวเลือกถัดไปตามที่คาด คือยกเว้นไฟล์ที่เราไม่ต้องการให้ผ่าน CDN

การปรับฟังก์ชัน WordPress Heartbeat

WordPress heartbeat เป็นการโอนข้อมูลควบคุมในการสร้างการสื่อสารระหว่าง backend และ frontend ของ WordPress และเซิร์ฟเวอร์ กระบวนการประเภทนี้สามารถเป็นหนึ่งในเหตุผลที่คุณอาจประสบความช้าใน WordPress

api heartbeat wordpress
api heartbeat wordpress

ในบรรดาการกระทำที่อาจถูกจำกัด:

  • การบันทึกอัตโนมัติและการแก้ไขในตัวแก้ไขโพสต์

  • การแจ้งเตือนในแผงผู้ดูแล WordPress

  • ข้อมูลเกี่ยวกับใครกำลังแก้ไข

  • ข้อมูล real-time

หาก WordPress ของเราทำงานถูกต้อง ผมไม่แนะนำทำอะไร ในจุดนี้ แต่หากเราสังเกตความช้า เราสามารถลองจำกัดกิจกรรมในตัวเลือกที่แตกต่าง

การกำหนดค่า Add-ons WP Rocket

มีองค์ประกอบบางอย่างเช่น scripts Google Analytics และ Facebook ที่เพียงเปิดใช้ในส่วนการกำหนดค่านี้เราสามารถได้เวอร์ชัน cache และปรับปรุงประสิทธิภาพ การกระทำนี้ตอบสนองโดยตรงต่อหนึ่งในคำขอที่ปกติบ่งชี้ใน audits ความเร็วในการโหลดเช่น Pagespeed "Leverage browser caching"

addons สำหรับ wprocket
addons สำหรับ wprocket

การปรับรูปภาพ

การปรับรูปภาพเป็นกระบวนการที่เนื่องจากความซับซ้อนอาจมีคู่มือของตัวเอง WP Rocket เสนอ plugin อิสระในการทำงานกับทรัพยากรเหล่านี้ จาก WP Rocket เราสามารถเข้าถึงการดาวน์โหลดเวอร์ชัน "ฟรี"

การปรับรูปภาพกับ imagify
การปรับรูปภาพกับ imagify

เครื่องมือ WP Rocket

การกำหนดค่า WP Rocket สามารถบันทึกและนำเข้าเพื่อหลีกเลี่ยงการต้องใช้เวลาในกระบวนการนี้อีก ยังให้ตัวเลือกในการทำ "Rollback" คือกลับไปในแง่เวอร์ชันที่ติดตั้ง

เครื่องมือ wp rocket
เครื่องมือ wp rocket

บทเรียน WP Rocket

ในการจบคู่มือ WP Rocket นี้ plugin เองให้วิดีโอชุดที่ให้ข้อมูลเกี่ยวกับการกระทำที่แตกต่างที่ดำเนินการและวิธีการ

บทเรียน wp rocket
บทเรียน wp rocket

บทสรุป

ตามที่คุณเห็น WP Rocket มากกว่า plugin cache เรามีในมือชุดที่สมบูรณ์ในการปรับความเร็วและประสิทธิภาพของเว็บไซต์ของเรา ดังนั้นตอนนี้สิ่งที่ต้องทำคือลองตัวเลือกที่แตกต่าง รออะไรในการทำให้ WordPress ของคุณบิน?

คุณรู้จัก WP Rocket? คุณปรับปรุงประสิทธิภาพได้ด้วยคู่มือนี้? คุณมีคำถาม? เรารอคุณในความคิดเห็น!

โดย: David Kaufmann

David Kaufmann

ในช่วง 10+ ปีที่ผ่านมา ผมหมกมุ่นกับ SEO อย่างสมบูรณ์ — และพูดตรง ๆ ก็ไม่อยากให้เป็นแบบอื่น

อาชีพของผมก้าวขึ้นไปอีกระดับเมื่อทำงานเป็นผู้เชี่ยวชาญ SEO อาวุโสที่ Chess.com — หนึ่งใน 100 เว็บไซต์ที่มีผู้เข้าชมมากที่สุดในอินเทอร์เน็ต การทำงานในระดับนี้สอนสิ่งที่ไม่มีหลักสูตรหรือประกาศนียบัตรใดสอนได้

จากประสบการณ์นี้ ผมก่อตั้ง SEO Alive — เอเจนซีสำหรับแบรนด์ที่จริงจังกับการเติบโตแบบออร์แกนิก และเพราะหาเครื่องมือที่จัดการทั้งโลกคลาสสิกและยุค AI ได้ดีไม่ได้ ผมจึงสร้าง SEOcrawl ขึ้น หากคุณกำลังมองหาพาร์ตเนอร์ SEO มากประสบการณ์ที่รักสาขานี้ — ยินดีพูดคุยครับ!

→ อ่านบทความทั้งหมดของ David
บทความเพิ่มเติม: David Kaufmann

ค้นพบเนื้อหาเพิ่มเติมของผู้เขียนคนนี้