บทความ IT เจ๋งๆ
4 สุดยอด Browser APIs ที่คุณ (อาจ) ยังไม่เคยลองใช้งาน
05-ส.ค.-22
คัมภีร์เทพ IT
Browser APIs เป็น Features ที่สำคัญมากของ HTML ซึ่งรวมอยู่ใน Web Browser ของคุณ Web APIs เหล่านี้นอกจากมีประสิทธิภาพแล้วยังมีประโยชน์มากกว่าที่คิด และนี่ก็คือ 4 สุดยอด Browser APIs ที่คุณ (อาจ) ยังไม่เคยลองใช้งาน ซึ่งมีประโยชน์สำหรับคนที่เป็น Web Developer อย่างยิ่ง
Battery Status API (ซึ่งบางครั้งก็ถูกเรียกว่า Battery API) จะให้ข้อมูลเกี่ยวกับ Battery ของ Computer มันจะแสดงความจุของ Battery ที่เหลืออยู่และสถานะการ Charge นอกจากนี้มันยังประมาณการว่าจะใช้เวลานานเท่าใดในการ Charge จนเต็มหรือ Discharge Battery ซึ่งก็ขึ้นอยู่กับว่า กำลัง Charge หรือกำลัง Discharge
Battery Status API ไม่ใช่ 3rd Party Application คุณสามารถพบพวกมันได้ใน navigator โดยใน Built-in window.navigator Property ของ Navigator Object จะมี getBattery() Method อยู่
API นี้จะทำการตรวจสอบสถานะของ Battery ของ User อย่างรวดเร็ว และใช้มันเพื่อเข้าสู่ฟังก์ชัน Battery-Saving เมื่อ Battery ของ User เหลือน้อย เช่น ทำการ Kill บาง Background Processes ที่ทำให้เปลือง Battery
ตัวอย่างเช่น:
และนี่คือตัวอย่างของ Response สำหรับ Code ด้านบน
Web Storage API กำลังจะถูกเลิกใช้ใน HTML5 Specification และมี IndexedDB API ที่เข้ามาแทนที่ (อย่างไรก็ตาม Web Storage ยังคงได้รับการสนับสนุนจาก Browsers ยอดนิยมจำนวนหนึ่ง ซึ่งรวมถึง Safari และ Opera ของ Apple) ทั้ง Indexing, Transactions และ Sophisticated Querying Capabilities นับเป็นจุดเด่นเพียงบางส่วนของ IndexedDB ซึ่งถือว่าเป็นจุดเด่นที่เหนือกว่า Web Storage
IndexedDB จะช่วยให้คุณจัดเก็บ Object จำนวนมากในเครื่องของคุณ และดึงพวกมันมาใช้ โดยใช้ Data Access Protocols ที่มีความซับซ้อน
เราสามารถใช้ IndexedDB API ได้ทุกครั้งที่ต้องการจัดเก็บ Data สำหรับ User ภายในเครื่อง ซึ่งมันค่อนข้างจะซับซ้อนเกินไปสำหรับการจัดการภายในเครื่อง
เรายังสามารถสร้างการใช้งาน CRUD แบบเต็มรูปแบบได้ โดยใช้เพียง IndexDB เพื่อจัดเก็บ Data ภายในเครื่อง ซึ่งเป็นสิ่งที่เราสามารถใช้เมื่อจัดเก็บ Data ที่ซับซ้อนสำหรับ PWA
นี่คือวิธีที่เราสามารถเข้าถึง IndexDB:
หากต้องการทราบข้อมูลเพิ่มเติมเกี่ยวกับ API นี้ สามารถดูได้ที่นี่
คุณเคยสงสัยหรือไม่ว่า Websites ดัง ๆ Copy ข้อความไปยัง Clipboard ของคุณด้วยการคลิกเพียงปุ่มเดียวได้อย่างไร คำตอบคือ พวกเขากำลังใช้ Clipboard API
Clipboard API จะช่วยให้คุณสามารถอ่านจากและเขียนไปยัง System Clipboard กันคนละช่วงเวลาได้ เช่นเดียวกับการตอบสนองต่อ Clipboard Actions (Cut, Copy และ Paste)
เราสามารถดำเนินการต่าง ๆ ต่อไปนี้ โดยใช้ API นี้
เมื่อเรียกดู Web ด้วย Browser Tabs มันมีความเป็นไปได้ที่ Tab บางส่วน (หรือทั้งหมด) จะไม่สามารถเข้าถึงพร้อม ๆ กันได้
Page Visibility API เป็น Browser API ที่จะช่วยให้คุณได้เห็นว่า Browser Tabs ใดบ้างที่ทำงานอยู่ และ Tabs ใดบ้างที่ไม่ทำงาน
เราสามารถใช้ Page Visibility API ในการตรวจจับเมื่อ User ออกจากหรือเข้าสู่ Web Page ของคุณ เราสามารถใช้มันเพื่อดำเนินการบางอย่าง เช่น Update Data บางอย่างเมื่อ User กลับมาที่ Web Page หรือตรวจจับ Page ที่ออกจาก Applications อย่าง Quiz Apps
เราสามารถใช้ Event Listener พิเศษ เพื่อตรวจหาการเปลี่ยนแปลงใน Visibility Status ของ Page
และนี่ก็คือตัวอย่างของการใช้ การตรวจจับ Page Visibility:
อันที่จริงยังมี API ที่ยอดเยี่ยมตัวอื่น ๆ ที่คุณควรรู้จักไว้ ไม่ว่าจะเป็น Geolocation API, Web Animation API, Fullscreen API และ Canvas API ซึ่งเราสามารถทำอะไรได้มากมายด้วย APIs เหล่านี้
ที่มา: https://betterprogramming.pub/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
|
|
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
|
|
บทความล่าสุด