การหลีกเลี่ยงภัยพิบัติ CMS: วิธีปรับปรุงประสิทธิภาพของเว็บไซต์

เผยแพร่แล้ว: 2022-04-15

ไม่มีใครชอบที่จะ… รอ… รอ …. รอ

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

สถิติประสิทธิภาพของเว็บไซต์ต่อไปนี้น่าจะสร้างความกลัวให้กับนักพัฒนาและวิศวกรของเว็บไซต์ทุกคน ไม่ต้องพูดถึงทีมการตลาดแบรนด์ของคุณ:

  • ผู้ใช้หนึ่งในสองคนจะละทิ้งไซต์หากใช้เวลาในการโหลดนานกว่าสี่วินาที ที่มา: บีบีซี
  • ความล่าช้า 1 วินาทีส่งผลให้ความพึงพอใจของผู้ใช้ลดลง 16% ที่มา: LoadStorm
  • การเข้าชมไซต์บนมือถือ 53 เปอร์เซ็นต์จะถูกละทิ้งหากหน้าเว็บใช้เวลาในการโหลดนานกว่าสามวินาที ที่มา: Google

บางทีคุณอาจสังเกตเห็นว่าประสิทธิภาพของเว็บไซต์ไม่ดีเมื่อคุณตรวจสอบเมตริกประสิทธิภาพ Core Web Vitals ของ Google แต่ไม่แน่ใจว่าจะแก้ไขอย่างไร

เมื่อธุรกิจของคุณอยู่ในสายงาน คุณไม่สามารถส่งธุรกิจใหม่ไปที่อื่นและทำให้แบรนด์ของคุณเสื่อมเสียได้ด้วยการให้ระบบจัดการเนื้อหา (CMS) มอบประสบการณ์ดิจิทัลที่ไม่ดี

ด้านล่างนี้ เราจะวิเคราะห์สาเหตุของการชะลอตัวที่พบบ่อยห้าประการและวิธีปรับปรุงประสิทธิภาพของเว็บไซต์โดยใช้ CMS ที่คล่องตัว เช่น WordPress VIP

อย่างแรก จะเกิดอะไรขึ้นเมื่อคุณโหลดเว็บแอปพลิเคชัน

เป็นการถามครั้งใหญ่สำหรับเบราว์เซอร์ใดๆ ก็ตาม ซึ่งต้องเร่งความเร็วในทันที โดยดำเนินการหลายอย่างในหน่วยมิลลิวินาที นี่คือ Mozilla มารยาทที่ผอม:

  1. เบราว์เซอร์ไปที่เซิร์ฟเวอร์ DNS และค้นหาที่อยู่จริงของเซิร์ฟเวอร์ที่เว็บไซต์ใช้งาน
  2. เบราว์เซอร์ส่งข้อความคำขอ HTTP ไปยังเซิร์ฟเวอร์เพื่อขอให้ส่งสำเนาของเว็บไซต์ไปยังไคลเอนต์ ข้อความนี้และข้อมูลอื่นๆ ทั้งหมดที่ส่งระหว่างไคลเอนต์และเซิร์ฟเวอร์ จะถูกส่งผ่านการเชื่อมต่ออินเทอร์เน็ตของคุณโดยใช้ TCP/IP
  3. หากเซิร์ฟเวอร์อนุมัติคำขอของลูกค้า เซิร์ฟเวอร์จะส่งข้อความ "200 OK" ไปให้ลูกค้า ซึ่งหมายความว่า "แน่นอน คุณสามารถดูเว็บไซต์นั้นได้! นี่แหละ” จากนั้นจึงเริ่มส่งไฟล์ของเว็บไซต์ไปยังเบราว์เซอร์เป็นชุดของชิ้นส่วนเล็กๆ ที่เรียกว่าแพ็กเก็ตข้อมูล
  4. เบราว์เซอร์จะรวบรวมส่วนเล็กๆ ให้เป็นหน้าเว็บที่สมบูรณ์และแสดงให้คุณเห็น

หมายเหตุ: แน่นอนว่ามันไม่ง่ายอย่างนี้ มีขั้นตอนเล็กๆ มากมายระหว่างแต่ละขั้นตอน สำหรับตอนนี้ มาดูเหตุผลหลักห้าประการที่ “ความช้า” เกิดขึ้น และวิธีที่ WordPress VIP CMS ของเราบรรเทาลง

ดังนั้น อะไรเป็นสาเหตุของประสบการณ์การท่องเว็บที่ช้า

ผู้ร้าย 1. ขาด PoP และ CDN

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

สิ่งนี้หมายความว่าอย่างไรสำหรับการสมัครของคุณ?

เมื่อมีการเริ่มต้นคำขอเครือข่ายจากขั้นตอนที่ 2 ด้านบน คำขอจะผ่านข้ามเครือข่ายหลายรายการ ฮ็อพเป็นศัพท์เกี่ยวกับเครือข่ายคอมพิวเตอร์ที่อ้างถึงจำนวนเราเตอร์ที่แพ็กเก็ตส่งผ่าน จากต้นทางไปยังปลายทาง

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

คำตอบของ WordPress VIP :

CDN ของ WordPress VIP เป็นเครือข่ายระดับโลกของ PoP ระดับขอบและต้นทางที่ให้บริการไซต์ของคุณแก่ลูกค้าทั่วโลก อย่างรวดเร็ว มีประสิทธิภาพ และเชื่อถือได้มากที่สุด ความพร้อมใช้งานที่แปลเป็นภาษาท้องถิ่นนี้จะเกิดขึ้นโดยอัตโนมัติทันทีที่เซิร์ฟเวอร์ Edge ของเราได้รับแจ้งเนื้อหาใหม่จากแอปพลิเคชันของคุณ ซึ่งหมายความว่าไม่มีการกำหนดค่าเพิ่มเติมที่จะจัดการโดยทีมของคุณ ซึ่งช่วยให้พวกเขามุ่งเน้นไปที่งานอื่นๆ

ผู้ร้าย 2. สื่อที่ไม่เหมาะสม

ภาพคุณภาพสูงที่ทุกคนถ่ายด้วยอุปกรณ์พกพารุ่นล่าสุดนั้นสวยงามมาก! นั่นคือ จนกว่าจะถูกใช้เป็นรูปขนาดย่อในหน้าแรกของคุณ

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

คำตอบของ WordPress VIP :

แอปพลิเคชันบน WordPress VIP จะได้รับสิทธิประโยชน์ทั้งหมดจากรูปภาพที่แคชขอบโดยอัตโนมัติ และการปรับขนาดรูปภาพอัตโนมัติบนรูปภาพที่อัปโหลด นอกจากนี้ ยังสามารถปรับขนาดรูปภาพได้ทันที

ผู้ร้าย 3. Javascript และ CSS . ที่ไม่ได้รับการปรับแต่ง

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

เพื่อแก้ไขปัญหานี้ การพัฒนา Javascript และ CSS สมัยใหม่มักใช้การลดขนาดและการต่อข้อมูล

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

คำตอบของ WordPress VIP :

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

ไฟล์ที่ย่อเล็กสุดและต่อกันแล้วจะถูกแคชไว้เป็นเวลา 15 วัน หรือจนกว่าจะตรวจพบการเปลี่ยนแปลง

ผู้ร้าย 4. การใช้แคชไม่ดี

แคชเป็นที่เก็บข้อมูลชั่วคราวพิเศษเพื่อเพิ่มความเร็ว สิ่งที่พวกเขาเร่งขึ้นขึ้นอยู่กับประเภทของแคช

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

คำตอบของ WordPress VIP :

WordPress VIP ใช้การแคชหลายประเภท:

  • แคชอ็อบเจ็กต์ —ใช้สำหรับจัดเก็บข้อมูลระดับแอปพลิเคชัน ซึ่งจะช่วยดึงข้อมูลได้อย่างรวดเร็วและมีประสิทธิภาพโดยไม่ต้องกดฐานข้อมูลของคุณ กล่าวโดยย่อ ออบเจ็กต์แคชป้องกันการคำนวณและ/หรือการสืบค้นข้อมูลจำนวนมากจากการใช้เวลาเชื่อมต่ออันมีค่า
  • แคชการ สืบค้น — การแคช หน่วยความจำที่มีน้ำหนักเบาของการสืบค้นฐานข้อมูล ใน WordPress ข้อความค้นหาโพสต์ใดๆ ก็ตามที่ใช้ WP_Query API จะได้รับประโยชน์อย่างมากจากการแคชรูปแบบนี้
  • แคช ของเพจ —ที่เก็บข้อมูลสำหรับหน้าที่วาดโดยสมบูรณ์ ซึ่งจัดเก็บไว้ในตำแหน่ง Edge PoP แต่ละตำแหน่ง นี่เป็นแคชระดับแรกที่ผู้ใช้ส่วนใหญ่ที่เข้าชมแอปพลิเคชันของคุณพบ แคชของเพจช่วยให้ CDN ของเราสามารถให้บริการเนื้อหาที่แปลเป็นภาษาท้องถิ่นโดยที่แอปพลิเคชันของคุณไม่ต้องเรียกใช้โค้ดใดๆ

ทั้งหมดนี้ทำงานสอดคล้องกันเพื่อลดเวลาตอบสนองคำขอ

ปัญหา 5. ความอิ่มตัวของการเชื่อมต่อฐานข้อมูล

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

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

ความอิ่มตัวของการเชื่อมต่ออาจเกิดขึ้นอย่างรวดเร็วและสุ่ม ทำให้วินิจฉัยสาเหตุได้ยาก

คำตอบของ WordPress VIP :

ในฐานะที่เป็นส่วนหนึ่งของแพ็คเกจบริการวีไอพีของ WordPress เรามอบการเข้าถึง New Relic ซึ่งช่วยให้สามารถวินิจฉัยและตรวจสอบปัญหาที่อาจเกิดขึ้นเช่นเดียวกับข้างต้น ซึ่งจะช่วยประหยัดเวลาของทีม ค่าใช้จ่าย และปัญหาในการรักษาความปลอดภัยเครื่องมือและทรัพยากรเพิ่มเติมเมื่อนับวินาที

สรุปแล้ว

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

เรียนรู้เพิ่มเติมเกี่ยวกับ WordPress VIP ที่นี่

ผู้เขียน

Michael Chan วิศวกรซอฟต์แวร์อาวุโส WordPress VIP