ทำไมต้องพัฒนา PWA สำหรับ Magento eCommerce Store ของคุณ?

เผยแพร่แล้ว: 2020-04-10

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

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

สถิติเกี่ยวกับ กปภ

Starbucks PWA ได้เพิ่มผู้ใช้งานรายวัน 2 เท่า คำสั่งซื้อบนเดสก์ท็อปมีอัตราใกล้เคียงกับมือถือ

George แบรนด์เสื้อผ้าในสหราชอาณาจักรพบว่า Conversion เพิ่มขึ้น 31%, อัตราตีกลับที่ต่ำกว่า 2 เท่า และการดูหน้าเว็บเพิ่มขึ้น 20% หลังจากอัปเกรดเป็น PWA กปภ.เร็วกว่าไซต์เดิม 3.8 เท่า

กปภ. คืออะไร?

กปภ. คืออะไร

แอปพลิเคชันเว็บโปรเกรสซีฟคือแอปพลิเคชัน JavaScript ที่ทำงานบนเว็บเบราว์เซอร์มือถือ กล่าวง่ายๆ ก็คือ PWA คือเว็บแอปหรือหน้าเว็บที่ให้รูปลักษณ์ของแอปพลิเคชันมือถือทั่วไปขณะทำงานบนเว็บเบราว์เซอร์ คุณลักษณะ JS ขั้นสูงที่ใช้ในการสร้าง PWA เหล่านี้ให้หน้าเว็บที่รวดเร็วเป็นพิเศษพร้อมกับประสบการณ์ผู้ใช้ที่ได้รับการปรับปรุง การมีส่วนร่วมของผู้เข้าชมที่ดีขึ้น และอัตรา Conversion ที่สูง กปภ. เชื่อมช่องว่างระหว่างหน้าเว็บและแอปพลิเคชันมือถือทั่วไป คุณสามารถบันทึกแอปพลิเคชันเว็บโปรเกรสซีฟบนเดสก์ท็อปของคุณ เช่น แอป Android หรือ iOS ที่มาพร้อมเครื่อง PWA เชื่อมต่อกับแบ็กเอนด์ผ่าน API แบ็กเอนด์สร้างขึ้นจากฐานข้อมูล, FTP, แผงการดูแลระบบ, Cpanel และแค็ตตาล็อก ในขณะที่ฟรอนต์เอนด์ที่แยกส่วนกันประกอบด้วยทุกอย่างที่ลูกค้าเห็นและโต้ตอบด้วย

PWA ส่วนหน้าดึงข้อมูลเช่นรายละเอียดผลิตภัณฑ์จากเซิร์ฟเวอร์และส่งข้อมูลเช่นรายการรถเข็นไปยังเซิร์ฟเวอร์ผ่าน API

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

เทคโนโลยีทั่วไปที่ใช้ในการพัฒนา Progressive Web Applications ได้แก่

พนักงานบริการ

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

แคช API

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

การแจ้งเตือนทางเว็บ

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

รายการแอปบนเว็บ

Web App Manifest เป็นไฟล์ JSON ที่บอกเบราว์เซอร์มือถือเกี่ยวกับ PWA และควรตอบสนองอย่างไรเมื่อติดตั้งบนเดสก์ท็อปหรืออุปกรณ์มือถือของผู้ใช้

ทำไมต้องพัฒนา PWA สำหรับ Magento eCommerce Store ของคุณ?

Magento เป็นหนึ่งในแพลตฟอร์มที่ต้องการมากที่สุดสำหรับการพัฒนาแอปพลิเคชันอีคอมเมิร์ซ ในปีพ.ศ. 2561 แพลตฟอร์มนี้ได้เพิ่มขนนกอีกชิ้นหนึ่งไว้ในหมวกด้วยการแนะนำสตูดิโอการประปาส่วนภูมิภาค

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

ต่อไปนี้คือข้อดีบางประการของการพัฒนา PWAs ของแอปพลิเคชัน Magento ของคุณ:

PWA สำหรับร้านค้าอีคอมเมิร์ซวีโอไอพีของคุณ

ประโยชน์ M-commerce

ตอนนี้ผู้คนชอบใช้อุปกรณ์พกพาในการช็อปปิ้งเป็นประจำ ตามรายงานระบุว่า 28% ของอีคอมเมิร์ซใช้มือถือในปี 2019 และผู้คน 1.6 พันล้านคนใช้อุปกรณ์มือถือของตนในการจับจ่ายทั่วโลก ความชอบในการซื้อสินค้าผ่านมือถือทำให้เกิด M-commerce หรือการค้าบนมือถือ อย่างไรก็ตาม ไม่ใช่ว่าทุกธุรกิจจะสามารถพัฒนาแอปพลิเคชันบนมือถือได้หลังจากพัฒนาร้านอีคอมเมิร์ซแล้ว นี่คือที่ที่แอปพลิเคชัน กปภ. มีประโยชน์ แอปพลิเคชัน PWA นำเสนอโซลูชันที่คุ้มค่าในการรับแอปบนอุปกรณ์เคลื่อนที่สำหรับไซต์อีคอมเมิร์ซของคุณและประหยัดค่าใช้จ่ายในการพัฒนาแอป การบำรุงรักษา และค่าใช้จ่ายอื่นๆ ได้มาก

ไม่มีปัญหาเรื่องการจำกัดอุปกรณ์และการติดตั้งที่รวดเร็ว

PWA ทั้งหมดเขียนด้วย HTML, CSS และ JS เช่น มีการเชื่อมต่อเว็บ ดังนั้นผู้ใช้จึงสามารถเข้าถึง กปภ. ได้ทางเว็บเบราว์เซอร์ เว็บเบราว์เซอร์หลักๆ ทั้งหมด เช่น Google Chrome, Mozilla Firefox และ Safari รองรับ PWA

นอกจากนี้ กปภ. ยังช่วยประหยัดเวลาของคุณในการติดตั้งแอพ ต่างจากแอป iOS หรือ Android ดั้งเดิม คุณสามารถวาง PWA บนหน้าจอได้ด้วยการแตะเพียงไม่กี่ครั้ง นอกจากนี้ PWA ยังใช้พื้นที่น้อยกว่ามาก ทั้งแอปเนทีฟหรือแอปข้ามแพลตฟอร์ม กล่าวโดยย่อ กปปส. ขจัดข้อจำกัดด้านอุปกรณ์เนื่องจากลูกค้าของคุณสามารถเรียกดูร้านค้าของคุณได้อย่างง่ายดาย PWA ให้อำนาจคุณในการโหลดและแชร์ Magento e-commerce ของคุณบนอุปกรณ์ใด ๆ ในทุกระบบปฏิบัติการหลัก

อ่านเพิ่มเติม: Magento 2 PWA -Progressive Web Apps Installation Guide

ประสิทธิภาพที่ดีขึ้น

Google ระบุว่า "ผู้ใช้ 53% จะละทิ้งไซต์หากใช้เวลาในการโหลดนานกว่า 3 วินาที และหลังจากโหลดแล้ว ผู้ใช้คาดหวังว่าไซต์จะเร็ว ไม่มีการเลื่อนที่กระตุก หรือการตอบสนองช้า” เนื่องจาก PWA ใช้ประโยชน์จากพนักงานบริการ ซึ่งเป็นไฟล์ JS ที่ทำงานแยกจากเธรดของเบราว์เซอร์หลักและควบคุมการแคชของเนื้อหาอย่างแข็งขัน พวกมันจึงให้ความเร็วและประสิทธิภาพที่ดีกว่าแอปที่มาพร้อมเครื่องแบบเดิมมาก

อัตราการแปลงที่สูงขึ้น

กระแสของผู้ใช้ทั่วไปในการช็อปปิ้งผ่านแอพ Android คือ:-

เปิด Google PlayStore-> ค้นหาแอป-> คลิกติดตั้ง-> ยอมรับการอนุญาต-> ดาวน์โหลดและรอ-> ใช้

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

ให้โหมดออฟไลน์

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

เป็นมิตรกับ SEO สูง

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

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

เป็นมิตรกับรายได้

สุดท้ายแต่ไม่ท้ายสุด กปปส. ประหยัดเงินได้มาก ซึ่งคุณต้องใช้ในแอปพลิเคชันดั้งเดิมหรือข้ามแพลตฟอร์ม ค่าธรรมเนียมครั้งเดียวใน Google Play Store เพื่ออัปโหลดแอปคือ $25 ค่าธรรมเนียมการทำธุรกรรม ไม่ว่าจะขายแอพหรือชำระเงินภายในแอพผ่านแพลตฟอร์ม Google Play มีค่าธรรมเนียมการทำธุรกรรม 30%

ขณะอยู่ใน App Store ของ Apple คุณต้องจ่าย 99 ดอลลาร์ต่อปีสำหรับสิทธิ์ในการเผยแพร่และบำรุงรักษาแอปพลิเคชัน Apple ยังรับค่าคอมมิชชั่น 30% ในการขายแอพและการซื้อภายในแอพ การประปาส่วนภูมิภาคช่วยประหยัดค่าใช้จ่ายนี้ได้

แบรนด์ที่ได้รับประโยชน์จากการประปาส่วนภูมิภาค

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

แบรนด์ที่ได้รับประโยชน์จากการประปาส่วนภูมิภาค

ทวิตเตอร์

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

  • เพิ่มขึ้น 65% ในหน้าต่อเซสชัน
  • ส่งทวีตเพิ่มขึ้น 75%
  • อัตราตีกลับลดลง 20%

Uber

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

Flipkart

ในปี 2558 Flipkart นำกลยุทธ์เฉพาะมือถือมาใช้ บริษัทสังเกตเห็นผลลัพธ์ที่ไม่พึงประสงค์หลังจากปิดไซต์บนอุปกรณ์เคลื่อนที่และมุ่งเน้นไปที่แอปบนอุปกรณ์เคลื่อนที่เท่านั้น หลังจากนำ PWA มาใช้แล้ว Flipkart ได้เพิ่มเวลาบนไซต์เป็นสามเท่า ตอนนี้ผู้ใช้ใช้เวลาเฉลี่ย 3.5 นาทีใน Flipkart Lite เทียบกับ 70 วินาทีในเวอร์ชันก่อนหน้า นอกจากนี้ยังมีอัตราการมีส่วนร่วมอีกครั้งที่สูงขึ้น 40% และอัตรา Conversion ที่สูงขึ้น 70%

อาลีบาบา

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

Forbes

Forbes บริษัทด้านสื่อระดับโลกที่น่าเชื่อถือที่สุดรายหนึ่งยังได้ว่าจ้าง PWA สำหรับคุณสมบัติการโหลดที่รวดเร็วและรวดเร็ว ประสบการณ์เบราว์เซอร์มือถือแบบดั้งเดิมของพวกเขาใช้เวลาโหลดโดยเฉลี่ย 3 ถึง 12 วินาที ตอนนี้เมื่อติดตั้งเทคโนโลยี PWA ก็ 0.8 วินาที

เดอะวอชิงตันโพสต์

ใช่คุณได้ยินถูกต้อง หนังสือพิมพ์ชั้นนำแห่งหนึ่งของอเมริกาก็เลือกใช้ กปภ. การเข้าชมเกือบ 55% มาจากอุปกรณ์เคลื่อนที่ กปภ. อนุญาตให้เผยแพร่บทความมากกว่า 1,000 บทความต่อวัน โดยมีเวลาโหลดเฉลี่ย 400 มิลลิวินาที นอกจากนี้ยังมีผู้ใช้การค้นหาบนมือถือเพิ่มขึ้น 63% ที่กลับมาภายใน 7 วัน

สรุปได้ว่า Progressive Web Application สำหรับร้านค้าอีคอมเมิร์ซ Magento สามารถปรับปรุงการมีส่วนร่วมของผู้ใช้และรายได้จากการขายได้อย่างมาก ดังนั้น การจ้างบริษัทพัฒนาอีคอมเมิร์ซที่ให้บริการพัฒนา กปภ. จึงเป็นแนวคิดที่ยอดเยี่ยมสำหรับธุรกิจของคุณ