ข้อมูลเบื้องต้นเกี่ยวกับ Budget API

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

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

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

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

TL;DR Budget API ช่วยให้คุณสงวนงบประมาณ ใช้งบประมาณ ดูรายการงบประมาณที่เหลือ และทำความเข้าใจต้นทุนของการดำเนินการเบื้องหลัง

การจองงบประมาณ

ใน Chrome 60 ขึ้นไป คุณจะใช้เมธอด navigator.budget.reserve() ได้โดยไม่มีการแฟล็ก

เมธอด reserve() ช่วยให้คุณของบประมาณสำหรับการดำเนินการที่เฉพาะเจาะจง และจะแสดงบูลีนเพื่อระบุว่าจะจองงบประมาณได้หรือไม่ หากมีการจองงบประมาณไว้แล้ว ก็ไม่จำเป็นต้องแจ้งให้ผู้ใช้ทราบเกี่ยวกับงานที่ทำอยู่เบื้องหลัง

ในตัวอย่างข้อความ Push คุณอาจพยายามสงวนงบประมาณสำหรับการดำเนินการ "การพุชแบบเงียบ" ได้ และหาก reserve() แก้ไขด้วยค่า "จริง" ระบบจะอนุญาตการดำเนินการดังกล่าว มิเช่นนั้นจะแสดงค่าเท็จและคุณจะต้องแสดงการแจ้งเตือน

self.addEventListener('push', event => {
 const promiseChain = navigator.budget.reserve('silent-push')
   .then((reserved) => {
     if (reserved) {
       // No need to show a notification.
       return;
     }

     // Not enough budget is available, must show a notification.
     return registration.showNotification(...);
   });
 event.waitUntil(promiseChain);
});

ใน Chrome 60 "การพุชแบบเงียบ" เป็นการดำเนินการประเภทเดียวที่ใช้ได้ แต่คุณสามารถดูรายการประเภทการดำเนินการทั้งหมดในข้อกำหนดได้ และเมื่อใช้ Chrome แล้วคุณจะเพิ่มงบประมาณสำหรับการทดสอบหรือการแก้ไขข้อบกพร่องไม่ได้ง่ายๆ เมื่อนำมาใช้ แต่วิธีแก้ปัญหาชั่วคราวคือคุณสามารถสร้างโปรไฟล์ใหม่ใน Chrome ได้ คุณใช้โหมดไม่ระบุตัวตนเพื่อวัตถุประสงค์นี้ไม่ได้ เนื่องจาก Budget API จะแสดงงบประมาณเป็น 0 ในโหมดไม่ระบุตัวตน (แม้ว่าจะมีข้อบกพร่องที่ทำให้เกิดข้อผิดพลาดในระหว่างการทดสอบ)

คุณควรเรียกใช้ reserve() เฉพาะเมื่อคุณต้องการดำเนินการตามที่คุณจองไว้ในอนาคตเท่านั้น โปรดทราบว่าหากคุณเรียก "จอง" ในตัวอย่างด้านบน แต่ยังคงแสดงการแจ้งเตือน งบประมาณจะยังคงถูกใช้

กรณีการใช้งานทั่วไปที่ไม่ได้เปิดใช้โดย reserve() เพียงอย่างเดียวคือความสามารถในการกำหนดเวลาพุชแบบไม่มีเสียงจากแบ็กเอนด์ Budget API มี API ที่จะเปิดใช้กรณีการใช้งานนี้ได้ แต่ยังอยู่ใน Chrome และขณะนี้ยังคงใช้งานได้หลังการแฟล็กและ / หรือช่วงทดลองใช้จากต้นทาง

Budget API และช่วงทดลองใช้จากต้นทาง

มี 2 วิธี ได้แก่ getBudget() และ getCost() ซึ่งเว็บแอปสามารถใช้ เพื่อวางแผนการใช้งบประมาณ

ใน Chrome 60 คุณใช้ทั้ง 2 วิธีนี้ได้หากคุณลงชื่อสมัครใช้ช่วงทดลองใช้จากต้นทาง แต่หากต้องการทดสอบ ก็ใช้ในเครื่องได้โดยการเปิดใช้แฟล็กฟีเจอร์แพลตฟอร์มเว็บทดลอง (เปิด chrome://flags/#enable-experimental-web-platform-features ใน Chrome)

มาดูวิธีใช้ API เหล่านี้กัน

ดูงบประมาณ

คุณจะดูงบประมาณที่มีอยู่ได้โดยใช้เมธอด getBudget() บางเบราว์เซอร์ (เช่น Chrome) งบประมาณจะ 'ลดลง' เมื่อเวลาผ่านไป ดังนั้นเพื่อให้คุณดูข้อมูลได้ ทั้งหมดจึงแสดงผลอาร์เรย์ BudgetStates ซึ่งระบุงบประมาณที่จะ ใช้จ่ายในแต่ละช่วงเวลาในอนาคต

วิธีแสดงรายการงบประมาณที่เราแสดงได้มีดังนี้

navigator.budget.getBudget()
.then((budgets) => {
  budgets.forEach((element) => {
    console.log(\`At '${new Date(element.time).toString()}' \` +
      \`your budget will be '${element.budgetAt}'.\`);
  });
});

รายการแรกจะเป็นงบประมาณปัจจุบัน และค่าเพิ่มเติมจะแสดงงบประมาณที่จุดต่างๆ ในอนาคต

At 'Mon Jun 05 2017 12:47:20' you will have a budget of '3'.
At 'Fri Jun 09 2017 10:42:57' you will have a budget of '2'.
At 'Fri Jun 09 2017 12:31:09' you will have a budget of '1'.

ข้อดีอย่างหนึ่งของการรวมงบประมาณที่ใช้ได้ในอนาคตคือ นักพัฒนาแอปแชร์ข้อมูลนี้กับแบ็กเอนด์เพื่อปรับลักษณะการทํางานของฝั่งเซิร์ฟเวอร์ได้ (เช่น ส่งข้อความ Push เพื่อทริกเกอร์การอัปเดตเฉพาะเมื่อลูกค้ามีงบประมาณสําหรับการพุชเงียบเท่านั้น)

รับต้นทุนของการดำเนินการ

หากต้องการทราบค่าใช้จ่ายของการดำเนินการ การเรียกใช้ getCost() จะแสดงตัวเลขที่ระบุจำนวนงบประมาณสูงสุดที่จะต้องใช้หากคุณเรียกใช้ reserve() สำหรับการดำเนินการดังกล่าว

เช่น เราจะดูค่าใช้จ่ายในการไม่แสดงการแจ้งเตือนเมื่อคุณได้รับข้อความพุช (กล่าวคือ ค่าใช้จ่ายในการพุชแบบไม่มีการแจ้งเตือน) โดยใช้รหัสต่อไปนี้

navigator.budget.getCost('silent-push')
.then((cost) => {
  console.log('Cost of silent push is:', cost);
})
.catch((err) => {
  console.error('Unable to get cost:', err);
});

ในขณะที่เขียน Chrome 60 จะพิมพ์:

Cost of silent push is: 2

สิ่งหนึ่งที่ควรเน้นเมื่อใช้เมธอด reserve() และ getCost() คือต้นทุนจริงของการดำเนินการอาจน้อยกว่าต้นทุนที่แสดงผลโดย getCost() คุณจะยังจองการดำเนินการได้หากงบประมาณปัจจุบันน้อยกว่าค่าใช้จ่ายที่ระบุไว้ รายละเอียดเฉพาะจากข้อกำหนดเป็นดังนี้

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

เมื่อคุณใช้ API โปรดแสดงความคิดเห็นเกี่ยวกับ GitHub Repo หรือรายงานข้อบกพร่องของ Chrome ที่ crbug.com