ดัชนีความเร็ว: มันคืออะไร & วิธีเพิ่มประสิทธิภาพเว็บไซต์ของคุณสำหรับมัน
เผยแพร่แล้ว: 2021-08-24ดัชนีความเร็ว (SI) เป็นตัวชี้วัดที่น่าสนใจเมื่อพิจารณาความเร็วของหน้า เป็นเครื่องบ่งชี้ประสิทธิภาพของหน้าเว็บของคุณโดยสิ้นเชิง แต่จะแตกต่างอย่างสิ้นเชิงจากเมตริกที่เน้นผู้ใช้เป็นศูนย์กลาง เช่น First Contentful Paint และ Largest Contentful Paint SI ระบุว่าไซต์ของคุณโหลดครึ่งหน้าบนได้เร็วเพียงใด หรือพูดอีกอย่างก็คือ เมื่อเนื้อหาทั้งหมดภายในวิวพอร์ตของผู้ใช้มองเห็นได้ทั้งหมด เมื่อดูที่เวลาในการโหลดหน้าเว็บของคุณ คุณไม่น่าจะถูกลงโทษหรือได้รับรางวัลสำหรับดัชนีความเร็วของคุณ นั่นไม่ใช่เหตุผลที่จะเพิกเฉย เนื่องจากเป็นเมตริกเดียว เมตริกนี้เป็นหนึ่งในไม่กี่รายการที่รวมเมตริกอื่นๆ หลายรายการ และสามารถให้แนวคิดที่ชัดเจนเกี่ยวกับความเร็ว ประสิทธิภาพ และประสิทธิภาพโดยรวมของไซต์ของคุณ
สมัครสมาชิกช่อง Youtube ของเรา
ดัชนีความเร็วคืออะไร?
Lighthouse ซึ่งเป็นแกนหลักของ Google สำหรับ PageSpeed Insights จะพิจารณาเมตริกประสิทธิภาพหลายตัวเพื่อให้คะแนนไซต์ของคุณ ดัชนีความเร็ว (SI) เป็นหนึ่งในนั้น และรายงานจะแสดงเวลาเป็นวินาทีแทนที่จะเป็นมิลลิวินาทีเหมือนกับเมตริกอื่นๆ Google ให้คำจำกัดความ SI ว่า "เนื้อหาของหน้าเว็บปรากฏให้เห็นได้เร็วเพียงใด"
สวยตรงไปตรงมาใช่มั้ย?
ดัชนีความเร็วไม่คำนึงถึงสคริปต์ส่วนหลังหรือการโหลดอื่นๆ ที่ไม่ได้ทาสี พวกเขาส่งผลกระทบต่อมันแม้ว่า SI เป็นเพียงการวัดระยะเวลาที่ผู้ใช้จะเห็นเนื้อหาของคุณทั้งหมด นั่นคือนักเตะ อย่างเต็มที่ . แม้ว่าเมตริกอื่นๆ เช่น LCP จะถูกวัดเมื่อมีการแสดงเนื้อหาส่วนใหญ่ ดัชนีความเร็วจะพิจารณาเนื้อหาใดๆ และทั้งหมด ที่ควรแสดงตามจริง
นี่ไม่ใช่การวัดความเร็วหน้าเว็บโดยรวม ที่คำนึงถึงเมื่อเบราว์เซอร์แสดงองค์ประกอบทั้งหมด รวมถึงสคริปต์และองค์ประกอบที่มองไม่เห็นซึ่งส่งผลต่อประสิทธิภาพการทำงาน อย่างไรก็ตาม หากคุณต้องการมาตรวัดที่ดีว่าเมื่อใดที่ ผู้ใช้ ของคุณ รับรู้หน้าเว็บที่จะโหลดอย่างสมบูรณ์ SI คือตัวชี้วัดที่ควรดู เนื่องจากผู้ใช้เป็นศูนย์กลาง SI จึงเป็นตัวบ่งชี้ที่ดีของความสมบูรณ์ของไซต์โดยรวม รวมทั้งเป็นพื้นฐานสำหรับประสบการณ์ผู้ใช้ (UX) ของไซต์ของคุณ
วิธีวัดดัชนีความเร็ว
เช่นเดียวกับเมตริกประสิทธิภาพของเว็บไซต์ส่วนใหญ่ เครื่องมืออันดับต้นๆ ที่ใช้คือ PageSpeed Insights ของ Google เครื่องมือนี้เป็นหนึ่งในผลลัพธ์ที่เจาะจงที่สุดเช่นกัน มันค่อนข้างสำคัญแม้ไซต์ที่รวบรวมไว้ดีที่สุด PageSpeed Insights มักให้ ข้อมูลห้องปฏิบัติการ สำหรับไซต์ของคุณ โดยพิจารณาจากการรวบรวม 28 วันที่ผ่านมา อย่างไรก็ตาม หากคุณมีผู้เข้าชมที่ส่งข้อมูลกลับไปยัง Google ผ่าน Chrome เพียงพอ คุณก็จะได้รับ ข้อมูลภาคสนาม จากรายงานด้วย ไม่ใช่ทุกไซต์ที่จะได้รับสิ่งนี้

อย่างที่คุณเห็น ความเร็วของตัววัดเหล่านี้ส่วนใหญ่เป็นสีเขียว นี่แสดงว่าพวกเขา "ดี" เห็นได้ชัดว่าคุณต้องการไซต์ของคุณ อย่างไรก็ตาม ดัชนีความเร็วคือ 4.0 วินาทีและสีส้ม เป็นเวลานานสำหรับผู้ใช้ที่จะรอดูทุกอย่างในครึ่งหน้าบน
คะแนนดัชนีความเร็วที่ดีคืออะไร?
PageSpeed Insights ใช้คะแนนต่อไปนี้เพื่อจัดอันดับดัชนีความเร็วของไซต์และรหัสสีตามลำดับ:
- สีเขียว (ดี) – 0 ถึง 3.4 วินาที
- ส้ม (ปานกลาง) – 3.4 ถึง 5.8 วินาที
- สีแดง (ช้า) – เกิน 5.8 วินาที
ดังที่เราได้กล่าวไว้ก่อนหน้านี้ PageSpeed Insights มี ความ สำคัญ อย่าง ยิ่งในการวัดผล หากคุณอยู่ในสีส้มหรือสีแดง คุณอาจต้องการใช้เครื่องมือเช่น GTmetrix หรือการทดสอบความเร็วของ Pingdom เพื่อดูว่าข้อมูลแบบเรียลไทม์แสดงอะไร เรารู้สึกว่าเป็นการดีที่สุดที่จะทดสอบไซต์ของคุณโดยใช้เครื่องมือหลายอย่างในช่วงเวลาต่างๆ กันเพื่อให้ได้ภาพที่ดีที่สุดของประสิทธิภาพโดยรวม
วิธีเพิ่มประสิทธิภาพคะแนนดัชนีความเร็วของคุณ
คุณสามารถดำเนินการหลายขั้นตอนเพื่อเพิ่มประสิทธิภาพคะแนนดัชนีความเร็วของคุณ หากคุณพยายามเพิ่มประสิทธิภาพไซต์ของคุณทุกครั้งสำหรับการเพิ่มความเร็วหน้าเว็บ (หรือในทางเทคนิคแล้วลดลง) คุณก็มีแนวโน้มว่าจะส่งผลต่อคะแนน SI ของคุณด้วยเช่นกัน เราจะแสดงวิธีการสองสามวิธีในการกำหนดเป้าหมายเวลา SI ของคุณโดยเฉพาะ เพื่อให้หน้าเว็บของคุณโหลดโดยเร็วที่สุดเพื่อให้ผู้เยี่ยมชมได้รับประสบการณ์ที่ดีที่สุด
ลดทรัพยากรการบล็อกการแสดงผล
โดยเฉพาะอย่างยิ่ง การลดเวลาดำเนินการ JavaScript ของคุณเป็นวิธีหนึ่งในการเพิ่มคะแนนดัชนีความเร็วของคุณ ทรัพยากรการบล็อกการแสดงผลคือสคริปต์และโค้ดที่ป้องกันไม่ให้ส่วนอื่นๆ ของเว็บไซต์ของคุณโหลดโดยมีความสำคัญกว่า แทนที่จะโหลดองค์ประกอบต่าง ๆ ของไซต์พร้อมกัน บางองค์ประกอบจะหยุดองค์ประกอบอื่นทั้งหมดจนกว่าจะเสร็จสิ้น

และนั่นจะลดดัชนีความเร็วของเว็บไซต์ของคุณ ในการแก้ไขปัญหานี้ คุณสามารถเลื่อนเวลาของสคริปต์และบิตของโค้ดจำนวนเท่าใดก็ได้ที่โหลดจนกว่าองค์ประกอบที่มองเห็นได้ทาสีลงใน DOM แล้ว การระบุผู้กระทำผิดนั้นค่อนข้างง่าย เนื่องจากคุณสามารถใช้เครื่องมือ Chrome Dev เพื่อดูไซต์ของคุณขณะโหลด และเครื่องมือจะระบุสิ่งที่กำลังหยุดองค์ประกอบจากการเรนเดอร์
นอกจากนี้ ผู้ใช้ WordPress สามารถใช้ปลั๊กอินแคช (หรือปลั๊กอินเพิ่มประสิทธิภาพไซต์) เช่น W3 Total Cache หรือ WP Rocket เพื่อจัดการกับสิ่งนี้ บ่อยครั้งที่ปลั๊กอินเหล่านี้มีการสลับอย่างง่ายเพื่อเลื่อนทรัพยากรการบล็อกการแสดงผล

ผู้ใช้ Divi ก็มีข้อได้เปรียบหลักในการบล็อกทรัพยากรดังกล่าว เนื่องจากตัวเลือกธีมช่วยให้คุณสามารถสลับการเลื่อนเวลา CSS ที่บล็อกการแสดงผลได้ เช่นเดียวกับสคริปต์ jQuery ยิ่งไปกว่านั้น ฟีเจอร์ Critical CSS ของธีมยังแบ่งโค้ดขนาดใหญ่ที่อาจทำให้เนื้อหาในไซต์ของคุณล่าช้า และทำให้โหลดได้เร็วกว่าที่ควรจะเป็น แม้ว่าบางส่วนจะเป็นการสลับ Divi จะเปิดใช้งานอื่นๆ โดยอัตโนมัติ การติดตั้ง Divi ควรช่วยให้คะแนน SI ของคุณทันทีในกรณีส่วนใหญ่
ลดงานเธรดหลักของไซต์ของคุณ
เช่นเดียวกับทรัพยากรการบล็อกการแสดงผล คุณสามารถคอขวดประสิทธิภาพของไซต์ของคุณโดยการโหลดองค์ประกอบต่างๆ ที่ใช้กำลังการประมวลผลมากจากเซิร์ฟเวอร์ของคุณ การลดขนาดเหล่านั้นสามารถช่วยผลักดันไซต์ไปยังเบราว์เซอร์ได้เร็วยิ่งขึ้น
วิธีแก้ปัญหาที่ง่ายที่สุดคือการ หยุดใช้ JavaScript มากเกินไป GTmetrix ทำให้ดีที่สุด:
โดยทั่วไป ยิ่งหน้าของคุณมี JavaScript มากเท่าใด กระบวนการแยกวิเคราะห์/คอมไพล์ก็จะยิ่งนานขึ้น ส่งผลให้ผู้ใช้ต้องรอนานขึ้นเพื่อดูเนื้อหาและโต้ตอบกับเพจของคุณ
เราตระหนักดีว่านี่อาจไม่ใช่เรื่องง่าย คุณได้ออกแบบไซต์ให้ทำงานในลักษณะบางอย่าง อย่างไรก็ตาม อาจมีโค้ดที่ไม่ได้ใช้ซึ่งคุณสามารถตัดทอนได้ และคุณอาจเพิ่มประสิทธิภาพ JavaScript ของบุคคลที่สามที่คุณกำลังโหลดเข้าสู่ไซต์ของคุณได้ นอกจากนี้ ลดขนาด JavaScript ของคุณ
ด้านบนของการตรวจสอบ JS อย่าลืมย่อขนาด CSS และ HTML ของคุณ สิ่งนี้จะช่วยบรรเทาความเครียดของเธรดหลักได้มากขึ้น ปลั๊กอินแคชและการเพิ่มประสิทธิภาพมักมีตัวเลือกเหล่านี้ด้วย
ผู้ใช้ Divi กลับมามีส่วนร่วมอีกครั้ง เนื่องจากธีมจะย่อขนาดและแยก CSS และ JavaScript ออกเป็นชิ้นขนาดพอดีคำโดยอัตโนมัติเพื่อปริมาณงานที่รวดเร็วยิ่งขึ้น ขจัดความจำเป็นในการโฟกัสจำนวนมากจากเธรดหลักของคุณ
คำถามที่พบบ่อยเกี่ยวกับดัชนีความเร็ว
ดัชนีความเร็วเป็นแนวคิดง่ายๆ ที่มีการแตกสาขาที่ซับซ้อน เราต้องการตอบคำถามที่พบบ่อยเกี่ยวกับ SI เพื่อช่วยคุณเพิ่มประสิทธิภาพเว็บไซต์ของคุณให้ดีที่สุดเท่าที่คุณจะทำได้
ดัชนีความเร็วเหมาะสมกับประสิทธิภาพโดยรวมของเว็บไซต์ฉันอย่างไร
ดัชนีความเร็วเป็นตัวชี้วัดเดียว เป็นตัวบ่งชี้ที่ดีมากสำหรับประสิทธิภาพของเว็บไซต์ของคุณในด้านต่างๆ เนื่องจากจะพิจารณาเนื้อหาครึ่งหน้าบนที่มองเห็นได้ทั้งหมด คุณจึงสามารถใช้เป็นมาตรวัดสำหรับไม่เพียงแต่ผู้ใช้รับรู้ถึงการโหลดเท่านั้น แต่ยังรวมถึงค่าประมาณคร่าวๆ ว่าไซต์ของคุณทำอะไรในพื้นที่ต่างๆ จำนวนมาก
จริงๆ แล้วมันไม่ได้ให้ข้อมูลมากมายเกี่ยวกับสิ่งที่คุณทำในเว็บไซต์ของคุณ มันสามารถถูกมองว่าเป็นตัวชี้วัดที่จับได้ทั้งหมด ซึ่ง GTmetrix ทำให้มันเป็น “เกณฑ์มาตรฐานโดยรวมที่มีประโยชน์สำหรับการประเมินประสิทธิภาพของเว็บไซต์ของคุณอย่างครบถ้วน”
ฉันควรเน้นที่คะแนนดัชนีความเร็วโดยเฉพาะหรือไม่
คงไม่ใช่หรอกมั้ง
แม้ว่าจะเป็นประโยชน์อย่างมากในการวัดประสิทธิภาพไซต์ของคุณ แต่การเน้นไปที่ปัญหาอื่นๆ ที่ละเอียดยิ่งขึ้น เช่น First Contentful Paint (FCP), Largest Contentful Paint (LCP), Time to First Byte (TTFB) และ First Input Delay (FID) นั้นมีมากมาย สำคัญกว่า. คุณสามารถดำเนินการหลายขั้นตอนเพื่อปรับปรุงแต่ละขั้นตอน ซึ่งจะช่วยปรับปรุงดัชนีความเร็วของคุณ และเมื่อนำมาเป็นเกณฑ์เปรียบเทียบ คุณจะเห็นว่าการเพิ่มประสิทธิภาพของคุณทำงานผ่าน SI ได้ดีเพียงใด
บทสรุป
การเพิ่มประสิทธิภาพความเร็วของหน้าเป็นการต่อสู้ที่ไม่มีวันจบสิ้นซึ่งเจ้าของเว็บไซต์ต่อสู้ คุณต้องสร้างสมดุลระหว่างการใช้งาน ประสบการณ์ และประสิทธิภาพ และการค้นหาความสมดุลนั้นอาจเป็นเรื่องยาก เมื่อการทดสอบแสดงผลคะแนนต่างๆ มากมายในองค์ประกอบต่างๆ มากมาย อาจเป็นเรื่องยากที่จะทราบว่าจะใส่พลังงานและทรัพยากรของคุณไปที่ใด ดัชนีความเร็วสามารถช่วยในเรื่องนั้นได้ เนื่องจากเป็นเมตริกเดียวที่แสดงให้เห็นว่าไซต์ของคุณทำงานได้ดีเพียงใดในขณะที่คุณปรับเปลี่ยนส่วนอื่นๆ ที่เฉพาะเจาะจงมากขึ้นของประสิทธิภาพของไซต์
คุณทำอะไรเพื่อเพิ่มประสิทธิภาพดัชนีความเร็วของเว็บไซต์ของคุณในช่วงหลายปีที่ผ่านมา
บทความภาพโดย HappyDrawing / shutterstock.com
