Push Messaging API memungkinkan kita mengirim notifikasi kepada pengguna bahkan ketika browser ditutup. Banyak pengembang ingin dapat menggunakan pesan ini untuk memperbarui dan menyinkronkan konten tanpa membuka browser, tetapi API telah satu batasan penting: Anda harus selalu menampilkan notifikasi untuk setiap satu pesan push diterima.
Kemampuan mengirim pesan push untuk menyinkronkan data di perangkat pengguna atau menyembunyikan notifikasi yang sebelumnya Anda tampilkan bisa sangat berguna bagi pengguna dan pengembang, namun mengizinkan aplikasi web untuk bekerja di latar belakang tanpa pengguna diketahui rentan terhadap penyalahgunaan.
Budget API, adalah API baru yang didesain untuk memungkinkan developer melakukan pekerjaan latar belakang terbatas tanpa memberi tahu pengguna, seperti push senyap atau menjalankan latar belakang pengambilan. Di Chrome 60 dan yang lebih baru, Anda dapat mulai menggunakan API ini dan Tim Chrome ingin mendapatkan masukan dari developer.
Untuk mengizinkan developer menggunakan resource pengguna di latar belakang, web memperkenalkan konsep anggaran menggunakan Budget API yang baru. Masing-masing situs akan diberikan sejumlah resource berdasarkan engagement pengguna yang untuk tindakan latar belakang, seperti {i>silent push<i}, di mana setiap operasi akan menghabiskan anggaran. Jika anggaran dibelanjakan, tindakan di latar belakang tidak dapat dilakukan lagi tanpa visibilitas tinggi. Agen pengguna akan bertanggung jawab untuk menentukan anggaran ditetapkan ke aplikasi web berdasarkan heuristiknya, misalnya alokasi anggaran dapat dikaitkan dengan keterlibatan pengguna. Setiap browser dapat memutuskannya sendiri secara heuristik.
TL;DR Dengan Budget API, Anda dapat mereservasi anggaran, menggunakan anggaran, dan mendapatkan daftar tentang sisa anggaran dan memahami biaya operasi latar belakang
Mencadangkan Anggaran
Pada Chrome 60 dan yang lebih baru, metode navigator.budget.reserve()
akan tersedia
tanpa penanda apa pun.
Metode reserve()
memungkinkan Anda meminta anggaran untuk operasi tertentu dan
fungsi tersebut akan mengembalikan boolean untuk
menunjukkan apakah anggaran dapat dipesan. Jika
anggaran telah direservasi, tidak perlu memberi tahu
pengguna tentang latar belakang Anda
Anda.
Pada contoh notifikasi push, Anda dapat mencoba mencadangkan anggaran untuk
"silent-push" dan jika reserve()
di-resolve dengan benar, operasi akan
diizinkan. Jika tidak, hasilnya akan salah (false) dan Anda harus menampilkan notifikasi
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);
});
Di Chrome 60, 'silent-push' adalah satu-satunya jenis operasi yang tersedia, tetapi Anda dapat menemukan daftar lengkap jenis operasi di spesifikasi. Selain itu, tidak ada cara mudah untuk meningkatkan anggaran untuk pengujian atau proses debug setelah digunakan, tetapi sebagai solusi sementara, Anda dapat membuat profil Anda di Chrome. Sayangnya, Anda tidak dapat menggunakan mode samaran untuk anggaran ini API akan mengembalikan anggaran nol dalam mode Samaran (meskipun ada bug yang menyebabkan error selama pengujian).
Anda hanya boleh memanggil reserve()
jika Anda ingin melakukan operasi yang
akan melakukan reservasi di masa mendatang. Perhatikan bahwa jika Anda memanggil fungsi reservasi
di atas, tetapi masih menampilkan notifikasi, anggaran akan tetap digunakan.
Satu kasus penggunaan umum yang tidak diaktifkan oleh reserve()
saja, adalah kemampuan untuk
menjadwalkan push senyap dari backend. Budget API memiliki API yang dapat diaktifkan
kasus penggunaan ini, tetapi masih dikerjakan
di Chrome dan saat ini
hanya tersedia di belakang flag dan / atau Uji Coba Origin.
API Anggaran dan Uji Coba Origin
Ada dua metode, getBudget()
dan getCost()
, yang dapat digunakan oleh aplikasi web
untuk merencanakan penggunaan anggaran mereka.
Di Chrome 60, kedua metode ini tersedia jika Anda mendaftar ke uji coba origin tetapi sebaliknya, untuk pengujian, Anda dapat menggunakannya secara lokal dengan mengaktifkan Fitur Platform Web eksperimental flag (Buka chrome://flags/#enable-Experimental-web-platform-features di Chrome).
Mari kita lihat cara menggunakan API ini.
Dapatkan Anggaran Anda
Anda dapat menemukan anggaran yang tersedia dengan metode getBudget()
. Beberapa browser
(seperti Chrome) akan mengalami 'peluruhan' anggaran seiring waktu, jadi untuk memberi Anda
visibilitas ini akan menampilkan array BudgetStates
, yang menunjukkan jumlah anggaran Anda
akan dilakukan pada waktu yang
berbeda pada masa mendatang.
Untuk menampilkan entri anggaran yang dapat kita jalankan:
navigator.budget.getBudget()
.then((budgets) => {
budgets.forEach((element) => {
console.log(\`At '${new Date(element.time).toString()}' \` +
\`your budget will be '${element.budgetAt}'.\`);
});
});
Entri pertama adalah anggaran Anda saat ini dan nilai tambahan akan muncul berapa anggaran Anda untuk berbagai titik di masa mendatang.
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'.
Salah satu manfaat memasukkan tunjangan anggaran di masa depan adalah bahwa pengembang dapat membagikan informasi ini ke backend untuk menyesuaikan perilaku sisi server (yaitu, hanya mengirim pesan push untuk memicu pembaruan saat klien memiliki anggaran untuk dorongan senyap).
Mendapatkan Biaya Operasi
Untuk mengetahui biaya operasi, memanggil getCost()
akan menampilkan
nomor yang menunjukkan jumlah anggaran maksimum yang akan dipakai jika Anda menghubungi
reserve()
untuk operasi tersebut.
Misalnya, kami dapat mengetahui kerugian jika Anda tidak menampilkan notifikasi menerima pesan push (yaitu biaya push diam), dengan kode:
navigator.budget.getCost('silent-push')
.then((cost) => {
console.log('Cost of silent push is:', cost);
})
.catch((err) => {
console.error('Unable to get cost:', err);
});
Pada saat penulisan ini, Chrome 60 akan mencetak:
Cost of silent push is: 2
Satu hal yang perlu disoroti dengan metode reserve()
dan getCost()
adalah
biaya aktual suatu operasi dapat kurang dari biaya yang ditampilkan oleh getCost()
.
Anda mungkin masih dapat mereservasi operasi jika anggaran saat ini lebih rendah
dari biaya yang ditunjukkan. Rincian spesifik dari spesifikasi
adalah sebagai berikut
mengikuti:
Itulah API saat ini di Chrome dan seiring web terus mendukung API baru yang memerlukan kemampuan untuk melakukan pekerjaan latar belakang, seperti pengambilan di latar belakang, Budget API dapat digunakan untuk mengelola jumlah operasi yang dapat Anda lakukan tanpa memberi tahu pengguna.
Saat Anda menggunakan API, harap berikan masukan di GitHub Repo atau melaporkan bug Chrome di crbug.com.