Wprowadzenie do interfejsu Budget API

Interfejs Push Messaging API umożliwia wysyłanie powiadomień do użytkowników nawet wtedy, gdy przeglądarka jest zamknięta. Wielu programistów chce używać tych komunikatów do aktualizowania i synchronizowania treści bez otwierania przeglądarki, ale interfejs API ma jedno ważne ograniczenie: należy zawsze wyświetlać powiadomienie o każdej odebranej wiadomości push.

Możliwość wysłania wiadomości push w celu synchronizowania danych na urządzeniu użytkownika lub ukrycia wcześniej wyświetlanego powiadomienia może być bardzo przydatna dla użytkowników i programistów, ale pozwala też aplikacji internetowej działać w tle, o niej nie wiedząc, że jest to szkodliwe.

Budżet API to nowy interfejs API, który umożliwia programistom wykonywanie ograniczonych działań w tle bez powiadamiania użytkownika, takich jak dyskretne przesyłanie czy pobieranie w tle. Ten interfejs API jest dostępny w Chrome w wersji 60 i nowszych, a zespół Chrome chętnie pozna opinie deweloperów.

Aby umożliwić deweloperom korzystanie z zasobów użytkownika w tle, platforma internetowa wprowadza koncepcję budżetu za pomocą nowego interfejsu Budget API. Każda witryna otrzyma na podstawie zaangażowania użytkowników ilość zasobów, którą może wykorzystać na działania w tle, na przykład dyskretne przesyłanie, gdzie każda operacja spowoduje zużycie budżetu. Po wykorzystaniu budżetu nie można już wykonywać działań w tle, jeśli nie są widoczne dla użytkowników. Klient użytkownika będzie odpowiadać za określanie budżetu przypisanego do aplikacji internetowej na podstawie jej heurystyki. Na przykład limit budżetu może być powiązany z zaangażowaniem użytkowników. Każda przeglądarka może samodzielnie określać własne ustawienia heurystyczne.

TL;DR: interfejs Budget API umożliwia rezerwowanie i wykorzystywanie budżetu, uzyskiwanie listy pozostałych środków i sprawdzanie kosztów operacji w tle

Rezerwacja budżetu

W Chrome 60 i nowszych wersjach metoda navigator.budget.reserve() jest dostępna bez flag.

Metoda reserve() umożliwia przesłanie żądania budżetu na potrzeby określonej operacji i zwraca wartość logiczną, która wskazuje, czy budżet można zarezerwować. Jeśli budżet został zarezerwowany, nie trzeba powiadamiać użytkownika o pracy.

W przykładzie powiadomień push możesz spróbować zarezerwować budżet na operację „silent-push”, a jeśli reserve() przyjmie wartość „true” (prawda), operacja będzie dozwolona. W przeciwnym razie zwróci wartość false (fałsz) i trzeba wyświetlić powiadomienie.

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);
});

W Chrome 60 „silent-push” to jedyny dostępny typ operacji, ale znajdziesz pełną listę typów operacji w specyfikacji. Nie ma też prostego sposobu na zwiększenie budżetu na potrzeby testowania lub debugowania po jego zastosowaniu, ale jako tymczasowe obejście możesz utworzyć nowy profil w Chrome. Niestety w tym przypadku nie można użyć trybu incognito, ponieważ interfejs Budget API zwraca w trybie incognito budżet wynoszący 0 (choć podczas testowania występuje błąd, który powoduje błąd).

Wywołuj reserve() tylko wtedy, gdy zamierzasz wykonać operację, którą chcesz w przyszłości wykonać. Zwróć uwagę, że jeśli w przykładzie powyżej wywołano element „Zarezerwuj”, ale nadal wyświetli się powiadomienie, budżet będzie nadal używany.

Jednym z typowych przypadków użycia, których nie włącza sam interfejs reserve(), jest możliwość zaplanowania dyskretnego przekazania z backendu. Budżet API ma interfejsy API, które umożliwiają ten przypadek użycia, ale wciąż nad nimi pracujemy w Chrome i obecnie są dostępne tylko za flagami lub w okresie próbnym źródła.

Wersje próbne interfejsu Budget API i Origin API

Aplikacja internetowa ma 2 metody: getBudget() i getCost(), których może używać do planowania wykorzystania budżetu.

W Chrome 60 obie te metody są dostępne, jeśli zarejestrujesz się w okresie próbnym źródła. Poza tym do testowania możesz używać ich lokalnie, włączając flagę eksperymentalnych funkcji platformy internetowej (otwórz chrome://flags/#enable-experimental-web-platform-features w Chrome).

Zobaczmy, jak korzystać z tych interfejsów API.

Sprawdź swój budżet

Możesz sprawdzić dostępny budżet, korzystając z metody getBudget(). W niektórych przeglądarkach (np. Chrome) budżet będzie się z czasem „obniżać”. Aby zapewnić pełną widoczność, zwracana jest tablica BudgetStates, która wskazuje, jaki budżet będzie mieć w przyszłości.

Aby wyświetlić listę pozycji budżetu, które możemy uruchomić:

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

Pierwszy wpis będzie stanowił aktualny budżet, a dodatkowe wartości wskażą jego wartość na różnych etapach w przyszłości.

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'.

Jedną z korzyści związanych z uwzględnieniem przyszłych limitów budżetu jest to, że deweloperzy mogą udostępniać te informacje swojemu backendowi, aby dostosowywać działanie po stronie serwera (np. wysyłać wiadomość push w celu aktywowania aktualizacji tylko wtedy, gdy klient ma budżet na ciche przesyłanie).

Sprawdź koszt operacji

Aby dowiedzieć się, ile kosztuje operacja, wywołanie metody getCost() zwróci liczbę wskazującą maksymalną kwotę, która zostanie zużyta po wywołaniu w tej operacji funkcji reserve().

Możemy na przykład poznać koszt niewyświetlania powiadomienia o otrzymaniu wiadomości push (tj. koszt cichych wiadomości push), korzystając z tego kodu:

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

W momencie tworzenia tekstu Chrome 60 wydrukuje:

Cost of silent push is: 2

W przypadku metod reserve() i getCost() rzeczywisty koszt operacji może być niższy niż koszt zwracany przez funkcję getCost(). Możesz nadal zarezerwować operację, jeśli Twój bieżący budżet jest niższy od podanego kosztu. Szczegółowe informacje w specyfikacji są takie:

To obecny interfejs API w Chrome, a internet nadal obsługuje nowe interfejsy API, które wymagają możliwości wykonywania działań w tle, takich jak pobieranie w tle, więc można za jego pomocą zarządzać liczbą operacji, które można wykonać bez powiadamiania użytkownika.

Korzystając z tego interfejsu, przesyłaj opinie o repozytorium GitHub lub zgłaszaj błędy w Chrome na stronie crbug.com.