Progressive Web App (PWA) คือเว็บแอปที่สร้างขึ้นและปรับปรุงด้วย API สมัยใหม่เพื่อมอบความสามารถที่เพิ่มขึ้นไปพร้อมกับการเข้าถึงผู้ใช้เว็บทุกคนบนอุปกรณ์ทุกเครื่องด้วยโค้ดฐานเดียว แอปเหล่านี้รวมการเข้าถึงที่กว้างขวางของเว็บแอปเข้ากับความสามารถที่หลากหลายของแอปเฉพาะแพลตฟอร์มเพื่อปรับปรุงประสบการณ์ของผู้ใช้
3 เสาหลักของการออกแบบ PWA
หากต้องการให้ PWA ใช้งานได้ดีเท่ากับแอปพลิเคชันเฉพาะแพลตฟอร์ม คุณต้องออกแบบให้ PWA มีประสิทธิภาพ เชื่อถือได้ และติดตั้งได้
ความสามารถ
เว็บแอปพลิเคชันมีความสามารถมากกว่าที่เคย และความสามารถเหล่านั้นจะเพิ่มขึ้นเรื่อยๆ เมื่อเร็วๆ นี้ ซอฟต์แวร์สําหรับเว็บได้เริ่มพัฒนาความสามารถที่ครั้งหนึ่งเคยเข้าถึงได้เฉพาะในแอปเฉพาะแพลตฟอร์มเท่านั้น ตัวอย่างเช่น ตอนนี้คุณสามารถสร้างแอปวิดีโอแชทในพื้นที่โดยใช้ WebRTC, ตำแหน่งทางภูมิศาสตร์ และการแจ้งเตือนแบบพุช จากนั้นทำให้แอปดังกล่าวติดตั้งได้ และใช้ WebGL และ WebVR เพื่ออนุญาตให้การสนทนาเปลี่ยนไปเป็นเวอร์ชวลเรียลลิตี การนำ WebAssembly มาใช้ช่วยให้นักพัฒนาซอฟต์แวร์เข้าถึงระบบนิเวศอื่นๆ ได้ เช่น C, C++ และ Rust รวมถึงนำฟีเจอร์เฉพาะแพลตฟอร์มที่มีมาหลายทศวรรษมาใช้กับเว็บ ตัวอย่างที่ยอดเยี่ยมของนักพัฒนาซอฟต์แวร์ที่ใช้ความสามารถใหม่ๆ ของเว็บคือ Squoosh.app ซึ่งเป็นเครื่องมือบีบอัดรูปภาพบนเว็บ
แม้ว่าความสามารถบางอย่างจะยังคงอยู่นอกเหนือขอบเขตของเว็บ แต่ API ใหม่และที่กำลังจะเปิดตัวก็ขยายความสามารถของเว็บอย่างต่อเนื่องด้วยฟีเจอร์ต่างๆ เช่น การเข้าถึงระบบไฟล์ การควบคุมสื่อ ป้ายแอป และการรองรับคลิปบอร์ดอย่างเต็มรูปแบบ ความสามารถทั้งหมดนี้สร้างขึ้นโดยใช้รูปแบบสิทธิ์ที่ปลอดภัยและเน้นผู้ใช้เป็นหลักของเว็บ ซึ่งช่วยให้ผู้ใช้ปลอดภัยและทำให้การใช้เว็บไซต์ใหม่ไม่น่ากลัว
เชื่อถือได้
Progressive Web App ที่เชื่อถือได้จะมอบประสบการณ์การใช้งานที่รวดเร็วและเชื่อถือได้ไม่ว่าจะใช้เครือข่ายใดก็ตาม ผู้ใช้สมควรได้รับแอปที่ตอบสนองต่อการโต้ตอบอย่างรวดเร็วและประสบการณ์ที่เชื่อถือได้
ความเร็วเป็นสิ่งสำคัญในการทำให้ผู้ใช้ใช้งานประสบการณ์ของคุณ อันที่จริงแล้ว เมื่อเวลาในการโหลดหน้าเว็บเพิ่มขึ้นจาก 1 วินาทีเป็น 10 วินาที ความน่าจะเป็นที่ผู้ใช้จะตีกลับจะเพิ่มขึ้น 123%
ข้อกังวลด้านประสิทธิภาพจะส่งผลต่อประสบการณ์ของผู้ใช้โดยรวม ไม่ใช่แค่onloadกิจกรรม ประสบการณ์ที่เชื่อถือได้จะทำให้ผู้ใช้ไม่สงสัยว่ามีการบันทึกการโต้ตอบกับแอปหรือไม่ การเลื่อนและภาพเคลื่อนไหวต้องลื่นไหล ผู้ใช้ต้องรู้สึกว่าแอปของคุณมีประสิทธิภาพดีพอๆ กับที่แอปมีประสิทธิภาพดีจริง
นอกจากนี้ แอปที่เชื่อถือได้ยังต้องใช้งานได้ไม่ว่าจะมีการเชื่อมต่อเครือข่ายหรือไม่ก็ตาม ผู้ใช้คาดหวังให้แอปโหลดได้อย่างรวดเร็วเมื่อเชื่อมต่อเครือข่ายช้าหรือไม่เสถียร หรือแม้กระทั่งเมื่อออฟไลน์ ผู้ใช้คาดหวังว่าเนื้อหาล่าสุดที่โต้ตอบด้วย เช่น แทร็กสื่อหรือตั๋วและแผนการเดินทาง จะพร้อมใช้งานและใช้งานได้แม้ว่าแอปจะมีปัญหาในการส่งคำขอไปยังเซิร์ฟเวอร์ก็ตาม เมื่อคำขอดำเนินการไม่ได้ ผู้ใช้คาดหวังว่าแอปจะแจ้งให้ทราบถึงปัญหาแทนที่จะดำเนินการไม่สำเร็จหรือขัดข้องโดยไม่มีการแจ้งเตือน
ติดตั้งได้
การทำ PWA ให้ติดตั้งได้จะย้าย PWA ออกจากเบราว์เซอร์และไปไว้ในหน้าต่างแบบสแตนด์อโลน ซึ่งจะเปลี่ยนวิธีที่ผู้ใช้คิดและโต้ตอบกับ PWA PWA ที่ติดตั้งไว้จะเปิดได้จากหน้าจอหลัก แถบแอป แถบงาน หรือชั้นวางของผู้ใช้ ผู้ใช้สามารถค้นหาแอปในอุปกรณ์และข้ามไปมาระหว่างแอปต่างๆ ด้วยตัวสลับแอป ซึ่งทำให้ผู้ใช้รู้สึกว่าแอปเป็นส่วนหนึ่งของอุปกรณ์ที่ติดตั้ง
การติดตั้ง PWA ยังทำให้ความสามารถใหม่ๆ พร้อมใช้งานด้วย เช่น แป้นพิมพ์ลัด ซึ่งปกติแล้วสงวนไว้สำหรับเบราว์เซอร์ นอกจากนี้ PWA ยังลงทะเบียนเพื่อรับเนื้อหาจากแอปพลิเคชันอื่นๆ หรือเป็นแอปพลิเคชันเริ่มต้นเพื่อจัดการไฟล์บางประเภทได้ด้วย
รับผลลัพธ์จาก PWA
การเปิดตัว PWA ไม่ได้ช่วยปรับปรุงประสบการณ์ของผู้ใช้เท่านั้น และยังช่วยปรับปรุงเมตริกและเพิ่มมูลค่าที่คุณได้รับจากบริการด้วย ตัวอย่างที่เห็นได้ชัดมีดังนี้
- PWA ของ Twitter ทําให้หน้าเว็บต่อเซสชันเพิ่มขึ้น 65%, ทวีตเพิ่มขึ้น 75% และอัตราตีกลับลดลง 20% ทั้งๆ ที่ลดขนาดแอปลงได้กว่า 97%
- หลังจากเปลี่ยนไปใช้ PWA แล้ว Nikkei ได้รับการเข้าชมจากการค้นหาทั่วไปเพิ่มขึ้น 2.3 เท่า การติดตามเพิ่มขึ้น 58% และผู้ใช้ที่ใช้งานอยู่รายวันเพิ่มขึ้น 49%
- Hulu แทนที่ประสบการณ์การใช้งานบนเดสก์ท็อปเฉพาะแพลตฟอร์มด้วย PWA และพบว่าการเข้าชมซ้ำเพิ่มขึ้น 27%
ดูข้อมูลเพิ่มเติมเกี่ยวกับประโยชน์ของการใช้ PWA ได้ที่วิธีที่ Progressive Web App ช่วยขับเคลื่อนธุรกิจให้ประสบความสำเร็จ