11 วิธีในการเพิ่มประสิทธิภาพเว็บไซต์อีคอมเมิร์ซของคุณเพื่อความรวดเร็ว

ในฐานะธุรกิจอีคอมเมิร์ซ การเพิ่มประสิทธิภาพไซต์ของคุณควรเป็นหนึ่งในความสำคัญสูงสุดของคุณ

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

อันที่จริง คุณจะสูญเสียผู้เข้าชม 20% หากพวกเขาพบความล่าช้าในการโหลดหน้าเว็บ 3 วินาที การศึกษาในปี 2016 โดย Aberdeen Group กล่าว

เร็วแค่ไหน? โดยเฉลี่ย เว็บไซต์ขายปลีกทั่วโลกที่ดำเนินการในปี 2560 ระหว่าง Black Friday ถึง 3 มกราคม จะสมบูรณ์และพร้อมใช้งานภายใน 2.5 วินาที ตามข้อมูลของบริษัทจัดการประสิทธิภาพดิจิทัล Dynatrace

ต่อไปนี้คือวิธีสำคัญบางประการเพื่อให้แน่ใจว่าเว็บไซต์ของคุณได้รับการปรับให้เหมาะสมสำหรับความเร็ว:

1. จำกัดจำนวนการค้นหา DNS

ทุกครั้งที่ไซต์อีคอมเมิร์ซของคุณโหลดขึ้น เบราว์เซอร์จะต้องค้นหาที่อยู่ IP ที่สอดคล้องกับชื่อโดเมนของคุณ สิ่งนี้เรียกว่าการค้นหา DNS (ระบบชื่อโดเมน)

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

คุณยังสามารถค้นหาผู้ให้บริการ DNS ที่เร็วขึ้น เปลี่ยนค่า TTL (time-to-live) เพื่อใช้ประโยชน์จากการแคช DNS หรือย้ายทรัพยากรให้มากที่สุดเท่าที่เป็นไปได้ไปยังเครือข่ายการจัดส่งเนื้อหา (เพิ่มเติมเกี่ยวกับเรื่องนี้ในภายหลัง)

2. ลงทุนในการค้นหาเว็บโฮสติ้งที่ดีขึ้น

เว็บโฮสติ้งที่เชื่อถือได้และรวดเร็วเป็นปัจจัยสำคัญต่อความเร็วของเว็บไซต์ของคุณ และไม่ใช่ว่าทุกโฮสต์เว็บจะถูกสร้างขึ้นมาเท่ากัน คุณจะต้องค้นหาบริการที่สามารถรองรับการเข้าชมเว็บและธุรกรรมที่เพิ่มขึ้นอย่างรวดเร็ว (เช่น ระหว่างการเปิดตัวผลิตภัณฑ์ขนาดใหญ่หรือช่วง Black Friday-to-CyberMonday)

ไม่มีชะตากรรมใดที่เลวร้ายสำหรับไซต์อีคอมเมิร์ซมากไปกว่าการที่ผู้เข้าชมไม่สามารถเข้าถึงได้ บริการโฮสติ้งที่ดีจะรับประกัน uptime 99.5% หรือสูงกว่า โฮสต์ระดับพรีเมียมจะรับประกันเวลาทำงานสูงถึง 99.99%

โดยปราศจากคำถาม คุณจะต้องการการรับรอง SSL และที่อยู่ IP เฉพาะ

3. บีบอัดรูปภาพของคุณ

รูปภาพคิดเป็น 50-75% ของน้ำหนักเว็บไซต์ทั้งหมดของคุณ แต่ที่น่าประหลาดใจคือ ประมาณ 45% ของเว็บไซต์อีคอมเมิร์ซ 100 อันดับแรกไม่สนใจที่จะบีบอัดรูปภาพ พวกเขาควรและคุณควร คุณสามารถเลือกการบีบอัดแบบไม่สูญเสียข้อมูลที่ลดขนาดไฟล์ของคุณโดยไม่ลดคุณภาพ

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

บีบอัดรูปภาพของคุณภายใน Photoshop หรือใช้โปรแกรมบีบอัดรูปภาพ เช่น TinyPNG หรือ Kraken.io

4. จัดลำดับความสำคัญการโหลดครึ่งหน้าบน

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

สำหรับคำแนะนำเกี่ยวกับวิธีการเปิดใช้งานการโหลดแบบ Lazy Loading ไปที่นี่

5. แคชหน้าของคุณ

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

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

ในการเปิดใช้งานการแคชของเบราว์เซอร์ คุณต้องแก้ไขส่วนหัว HTTP เพื่อตั้งเวลาหมดอายุให้นานขึ้นสำหรับไฟล์บางประเภท นี่คือคำแนะนำบางส่วนจากนักพัฒนาซอฟต์แวร์ของ Google

6. ลดการร้องขอ HTTP

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

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

7. ใช้การบีบอัด Gzip

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

การบีบอัด Gzip ช่วยให้เซิร์ฟเวอร์ของคุณสามารถบีบอัดไฟล์ไซต์ก่อนส่งกลับไปยังเบราว์เซอร์ ซึ่งช่วยลดเวลาในการถ่ายโอนได้อย่างมาก อันที่จริง gzip สามารถลดขนาดหน้าและสไตล์ชีตได้ถึง 90%!

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

8. ใช้ประโยชน์จากเครือข่ายการจัดส่งเนื้อหา

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

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

การเลือก CDN ที่ถูกต้องอาจเป็นเรื่องยาก เริ่มต้นด้วยคู่มือนี้

9. ลดขนาดโค้ดของคุณ

การลดขนาดเป็นกระบวนการลบอักขระที่ไม่จำเป็นทั้งหมด เช่น ช่องว่างและเส้นออกจากซอร์สโค้ดของคุณ โดยไม่กระทบต่อฟังก์ชันการทำงาน ทำให้เบราว์เซอร์โหลดหน้าเว็บได้เร็วขึ้น กระบวนการนี้เกี่ยวข้องกับไฟล์ HTML, CSS และ JavaScript และสามารถสร้างความแตกต่างอย่างมากในการเร่งความเร็วในการโหลดของคุณ การลดขนาดจะลดทั้งขนาดไฟล์ของคุณ ตลอดจนจำนวนไฟล์ที่จำเป็น

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

10. ใช้การโหลดแบบอะซิงโครนัส

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

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

11. ตรวจสอบความเร็วเว็บไซต์ของคุณอย่างต่อเนื่อง

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

PageSpeed ​​Insights ของ Google เป็นเครื่องมือที่ดีในการวิเคราะห์ความเร็วไซต์ของคุณบนมือถือและเดสก์ท็อป

มีเครื่องมือที่ยอดเยี่ยมอีกตัวสำหรับตรวจสอบความเร็วไซต์จาก Pingdom

โปรดจำไว้ว่ากฎทั่วไปนั้น: ทุกๆ วินาทีที่ไซต์ของคุณใช้เวลาในการโหลดนานขึ้น คุณจะสูญเสียผู้เข้าชม 10% ของคุณ อุ๊ย