Google 新推出Background sync API


Background sync是Google新推出的Web API,可延遲用戶行為,直到用戶網絡連接穩定。這樣有助於保證用戶想要發送的數據就是實際發送的數據。

 

目前存在的問題

網絡是消磨用戶時間最多的途徑,時間浪費在網絡上等待網頁加載,網頁呈現等一些加載數據方面。

但是有很多時候,並不希望浪費時間,更期望達成是以下的體驗:1. 拿出手機;2. 實現用戶目標;3. 放回手機;4. 享受人生

然而,流暢的用戶體驗往往都會受糟糕的網絡而影響,常常會為用戶呈現空白屏幕或停滯不動的進度條,用戶最多能容忍10秒。盡管“Service workers”可通過加載緩存,來解決頁面問題,但當客戶端會發送多個數據時,會產生問題。

此刻,如果用戶點擊發送阪牛,必須盯着屏幕,直到信息提交完成,如果用戶嘗試導航或關閉頁面,則使用對話框提示用戶,進度還未完成,需要你耐心等待。如果用戶取消連接,則需要告訴用戶“抱歉,需要您重新執行操作。”有了Background Sync 所有的問題都迎刃而解。

解決方案

之前,當用戶使用即時聊天記錄,發送表情時,如果無網絡連接,一旦有網絡連接,信息就會立馬發送出去。后台異步沒有隨着Chrome的新版本一起發布,你需要設置:“//flags/#enable-experimental-web-platform-features”並重啟瀏覽器。

1. 打開App

2. 關閉網絡連接

3. 輸入信息

4. 返回主屏幕

5. 打開網絡連接

6. 后台就會發送信息

后台發送消息會提升性能。App不需要處理消息發送的問題,因此App會將消息直接加入到輸出流。

 

如何實現后台同步

真正的可擴展Web Style,可實現任何想要的功能。當用戶有網絡連接時,則立即觸發事件。

如推送消息,使用service worker作為事件目標,當頁面無法打開的時候,可幫助你打開,下面是為頁面注冊同步的代碼:

// Register your service worker:
navigator.serviceWorker.register('/sw.js');

// Then later, request a one-off sync:
navigator.serviceWorker.ready.then(function(swRegistration) {
  return swRegistration.sync.register('myFirstSync');
});
Then listen for the event in /sw.js:

self.addEventListener('sync', function(event) {
  if (event.tag == 'myFirstSync') {
    event.waitUntil(doSomeStuff());
  }
});
 

doSomeStuff()會返回成功標記,表明操作成功或失敗,一旦它被執行了,則表明同步工作。如果失敗,另外一個同步操作會被嘗試重新連接。

sync 標簽名必須是唯一標識的。

 

什么情況下使用后台同步?

可以在發送數據時使用調度,聊天,消息,郵件,文檔更新,設置更改時,上傳照片時,任何想要發送給服務器的數據都可以使用。即使頁面關閉或用戶跳轉到其他頁面,該頁面也會將數據存到Indexed DB,並且Service Worker會檢索到這些信息,並且發送。

漸進增強

並不是所有的瀏覽器都支持Background Sync,特別是Safari和Edge 不支持Servcie workers。漸進增強功可幫助實現該功能:

if ('serviceWorker' in navigator && 'SyncManager' in window) {
  navgiator.serviceWorker.ready.then(function(reg) {
    return reg.sync.register('tag-name');
  }).catch(function() {
    // system was unable to register for a sync,
    // this could be an OS-level restriction
    postDataFromThePage();
  });
} else {
  // serviceworker/sync not supported
  postDataFromThePage();
}

service workers 或background Sync 瀏覽器都不支持,就采取舊方法實現。

無論用戶的網絡連接狀態好還是差,使用Background Sync 都是最佳的解決方案,可在發送數據期間防止用戶跳轉或關閉頁面。

 

Background Sync 未來發展

Google預計2016年將background Sync  嵌入到Chrome中。功能上正在研究“periodic background sync”,支持時間段內的periodicsync 請求,受時間,電池狀態和網絡狀態。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM