บทความ IT เจ๋งๆ
8 Browser APIs ที่ไม่ค่อยมีคนรู้จัก แต่อาจมีบทบาทในอนาคต
11-ธ.ค.-20
คัมภีร์เทพ IT
ในขณะที่การพัฒนา Website เติบโตขึ้นเรื่อย ๆ Browser Vendors ก็พยายามติดตามการพัฒนาที่รวดเร็วเหล่านั้นเช่นกันและพัฒนา API ใหม่ ๆ อย่างต่อเนื่องเพื่อให้สามารถนำ Function การใช้งานที่ใหม่กว่าไปใช้ใน Web Application ของคุณ แต่ก็ยังมี API บางตัวที่ผู้คนไม่รู้จักมากนัก และนี่ก็คือ 8 Browser APIs ที่ไม่ค่อยมีคนรู้จัก แต่อาจมีบทบาทในอนาคต
API นี้จะช่วยให้คุณสามารถ Run Web Application บนหลาย ๆ Tabs ได้เพื่อเข้าถึงและช่วยในการแบ่งปัน Resources แม้ว่าอาจเป็นเรื่องแปลกสำหรับ Web Applications ทั่วไปในชีวิตประจำวันที่ Run บนหลาย ๆ Tabs แต่ก็มีกรณีการใช้งานขั้น Advance ที่คุณจำเป็นต้อง Run หลาย Browser Tabs ของ Web Application และพยายาม Sync มันไว้ ซึ่ง API นี้มีประโยชน์ในกรณีเหล่านั้น
แม้ว่า API อย่าง SharedWorker, BroadcastChannel, localStorage, sessionStorage, postMessage, unload handler สามารถใช้เพื่อจัดการ การ Communicate และการ Synchronize ของ Tab ได้ โดยพวกมันต่างก็มีข้อบกพร่องและต้องการวิธีแก้ไขปัญหาซึ่งจะลดความสามารถในการ Maintain Code ซึ่ง Web Locks API พยายามทำให้กระบวนการนี้ง่ายขึ้นโดยการนำ Solution ที่เป็นมาตรฐานมาใช้มากขึ้น
แม้ว่าจะสามารถใช้งานพวกมันได้ตั้งแต่ใน Chrome 69 แล้ว แต่ก็ยังไม่มีการรองรับการใช้งานพวกมันใน Browsers หลัก ๆ เช่น Firefox และ Safari
หมายเหตุ: คุณควรรู้แนวทางของคุณผ่าน Concepts ต่าง ๆ เช่น deadlocks เพื่อหลีกเลี่ยงปัญหาเมื่อใช้ API นี้
ในฐานะของ Web Developer อาจมีหลายกรณีที่คุณต้องติดตั้ง External Libraries เพื่อจัดการกับการ Detect Elements ต่าง ๆ เช่น ใบหน้า ข้อความ และ Barcodes ในรูปภาพ นั่นเป็นเพราะไม่มี Web Standard API ให้ Developer ใช้งาน
ทีมงานของ Chrome กำลังพยายามเปลี่ยนแปลงสิ่งนี้ ด้วยการจัดเตรียม Shape Detection API ไว้ให้ใน Chrome Browsers และทำให้มันเป็น Web Standard
แม้ว่า Feature นี้จะอยู่ในช่วงทดลอง แต่ก็สามารถเข้าถึงได้ในเครื่องของคุณโดยเปิดใช้งาน #enable-experimental-web-platform-features Flag ใน chrome://flags
Payment Request API จะช่วยให้ทั้งลูกค้าและผู้ขายสามารถดำเนินขั้นตอนการชำระเงินได้อย่างราบรื่นยิ่งขึ้น แนวทางใหม่นี้จะกำจัดแบบฟอร์มการชำระเงินและปรับปรุงประสบการณ์การชำระเงินของผู้ใช้ได้เป็นอย่างดี ด้วยการรองรับของ Apple Pay และ Google Pay ทำให้ API นี้ถูกคาดหวังว่าจะเป็นส่วนสำคัญในแวดวง E-Commerce
นอกจากนี้ เนื่องจาก Credentials ได้รับการจัดการใน Browser ลูกค้าจึงสามารถเปลี่ยนจาก Mobile เป็น Desktop Browsers ได้ง่ายขึ้นและยังคงเข้าถึงข้อมูลบัตรของตัวเองได้ API นี้ยังอนุญาตให้สามารถ Customize ได้ในส่วนของผู้ขาย คุณสามารถระบุวิธีการชำระเงินที่รองรับและบัตรที่รองรับ รวมทั้งยังสามารถระบุตัวเลือกการจัดส่งตามที่อยู่สำหรับจัดส่งได้อีกด้วย
เป็นเรื่องปกติที่คุณจะพบว่าใน PC ของคุณ มี Tab แปลก ๆ ประมาณ 20 Tabs เปิดอยู่ใน Browser คุณอาจเคยมีเพื่อนที่เพิ่งปิด Tab ไปกว่า 100 Tabs หลังจากแก้ไข Bug ปัจจุบัน Browsers ได้เริ่ม Implement Features เพื่อจัดกลุ่ม Tab ของคุณให้เป็นระเบียบมากขึ้น
ด้วยความช่วยเหลือของ Page Visibility API จะทำให้คุณสามารถตรวจสอบได้ว่า Web Page ของคุณมีการใช้งานอยู่หรือไม่ กล่าวอีกนัยหนึ่งคือ คุณสามารถดูได้ว่า User มีการดู Tab ที่มี Web Page ของคุณอยู่หรือไม่
แม้ว่าจะดูเหมือนเป็นเรื่องง่าย ๆ แต่มันก็มีประสิทธิภาพอย่างมากในการเพิ่มประสบการณ์การใช้งาน Website มีการใช้งานในหลายกรณีที่สามารถใช้ API นี้ได้
- Download ส่วนที่เหลือของ Application Bundle Resources และ Media Resources ในขณะที่ Browser Tab กำลัง Inactive อยู่ วิธีนี้จะช่วยให้คุณใช้ Idle Time ได้อย่างมีประสิทธิภาพ
- หยุด Video ชั่วคราวเมื่อ User ทำการ Minimize Tab หรือเปลี่ยนไปใช้ Tab อื่น
- หยุด Image Slideshow/Carousal ชั่วคราวเมื่อ Tab กำลัง Inactive อยู่
แม้ว่าที่ผ่านมา Developer จะใช้ Events ต่าง ๆ เช่น blur และ focus บน Window แต่พวกมันก็ไม่ได้บอกว่า Page ของคุณถูกซ่อนไว้จาก User จริง ๆ ซึ่ง Page Visibility API จะช่วยแก้ปัญหานี้ได้
Browser API นี้สามารถเข้ากันได้เป็นอย่างดีกับ Browsers ส่วนใหญ่
Source: MDN Docs
Web Share API จะช่วยให้คุณสามารถ Share พวก Links, Text และ Files ไปยัง Apps อื่น ๆ ที่ติดตั้งบน Devices ในลักษณะเดียวกับ Apps ที่มาพร้อมเครื่อง API นี้สามารถช่วยเพิ่มการมีส่วนร่วม (Engagement) ของ User กับ Web Application ของคุณ
ตั้งแต่กลางปี 2020 API นี้มีให้บริการเฉพาะบน Safari และบน Android ใน Chromium forks เท่านั้น และ MDN มีรายละเอียดเพิ่มเติมเกี่ยวกับ Browser Compatibility
The native Share interface. Screenshot by the author.
Progressive Web Apps กำลังเปลี่ยนแปลงวิธีที่เราเข้าใจ Applications โดยมอบประสบการณ์การใช้งาน App ที่เสมือนจริงใน Web Form โดย Website StateOfJS ได้ระบุว่า User ประมาณ 48.2% เคยใช้ PWA และ 45.5% ของ User ทราบว่า PWAs คืออะไร นี่แสดงให้เห็นว่า PWAs มีผลกระทบที่มากเพียงใด
แม้ว่า PWAs จะมี Features ที่เหมือนกับที่มีใน Device อยู่มากมาย แต่ก็ไม่มีวิธีรับ Files จาก Apps ที่มาพร้อมเครื่อง API นี้จะช่วยให้คุณรับ Links, Text และ Files จาก Applications อื่น ๆ ที่มาพร้อมเครื่อง มีการรองรับการใช้งานพวกมันใน Chrome 76 ขึ้นไปสำหรับ Android เท่านั้น คุณสามารถอ่านเพิ่มเติมเกี่ยวกับ API นี้ได้ที่นี่
7. The Push API
Push API จะช่วยให้ Web Applications สามารถรับ Messages ที่ส่งถึงพวกมันจาก Server ไม่ว่า Apps จะกำลังถูกใช้งานอยู่หรือไม่ก็ตาม มันสามารถทำงานได้แม้ App จะไม่ถูก Load บน Browser ก็ตาม สิ่งนี้จะช่วยให้ Developer สามารถส่ง Asynchronous Notifications ไปยัง User ได้อย่างทันท่วงที แต่ทางที่ดีก็ควรได้รับ Permission จาก User ก่อนที่จะใช้ API
เป็นที่ทราบกันดีว่า การทำงานกับ Cookies นั้นค่อนข้างช้าเนื่องจากมันเป็นแบบ Synchronous แต่ Cookie Store API ก็สามารถให้เข้าถึง HTTP Cookies แบบ Asynchronous นอกจากนี้ API นี้ยังเปิดเผย HTTP Cookies เหล่านี้แก่ Service Workers อีกด้วย
แม้ว่าจะมี Helper Libraries ในการอำนวยความสะดวกในการดำเนินการทั่วไปทั้งหมดกับ Cookie ก็ตาม แต่ด้วยการใช้ Cookie Store API ก็จะทำให้ง่ายและมีประสิทธิภาพมากขึ้น ในบางครั้ง API นี้ก็ถูกเรียกว่า Async Cookies API
คุณสามารถอ่านเพิ่มเติมเกี่ยวกับ API นี้ได้ที่นี่
ที่มา: https://medium.com/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
|
|
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
|
|
บทความล่าสุด