GithubHelp home page GithubHelp logo

ptzagk / react-native-sync-adapter Goto Github PK

View Code? Open in Web Editor NEW

This project forked from ferrannp/react-native-sync-adapter

0.0 0.0 0.0 226 KB

Schedule background data synchronization using React Native.

License: MIT License

JavaScript 12.84% Java 77.71% Python 9.45%

react-native-sync-adapter's Introduction

react-native-sync-adapter

Circle CI npm version

Intelligent Job-Scheduling port to React Native: Scheduling data background synchronizations that run in your JavaScript.

Read a broader introduction in the following post: React Native and Native Modules: The Android SyncAdapter

Requirements

  • React Native 0.36+

Pros

Under the hood, this library uses a SyncAdapter:

  • Android will trigger a sync using our syncFlexTime to decide when is the best moment to do so (battery efficiency)
  • No need to worry about internet connection
  • No need to worry about the user restarting the device
  • Compatible with all Android versions supported by RN (4.1+)

Caveats

No iOS support:

  • To run tasks on the background using JavaScript, this library uses Headles JS which is currently supported only on Android. You can vote for the related issue here

App in the foreground:

  • Syncs will only trigger if the app is not in the foreground. Check out the blog post mentioned above to read more about this and how to mitigate it

Getting started

yarn add react-native-sync-adapter

Installation

react-native link react-native-sync-adapter

Manual Android required step

Open up the string.xml file of your Android project. You need to add the following (just change the content):

<string name="app_name">YourAppName</string>
<string name="rnsb_sync_account_type" translatable="false">your.android.package.name</string>
<string name="rnsb_content_authority" translatable="false">your.android.package.name.provider</string>

This will override the default values from the library and make them unique for your app.

Usage

You need to register a task with a specific name and only with this specific name: TASK_SYNC_ADAPTER. You should do it in the same place where you register your app:

AppRegistry.registerComponent('MyApp', () => MyApp);
AppRegistry.registerHeadlessTask('TASK_SYNC_ADAPTER', () => TestTask);

Then, on your top most component:

import SyncAdapter from 'react-native-sync-adapter';

...

componentDidMount() {
  SyncAdapter.init({
    syncInterval,
    syncFlexTime,
  });
}

...

That is all!

API

init

Schedules background syncs within your app.

Object: {
  syncInterval: number;
  syncFlexTime: number;
}
  • syncInterval: The amount of time in seconds that you wish to elapse between periodic syncs
  • syncFlexTime: The amount of flex time in seconds before syncInterval that you permit for the sync to take place. Must be less than syncInterval

A good example could be syncInterval: 12 * 60 * 60 (12 hours) and syncFlexTime: 0.5 * 60 * 60 (30 minutes).

Notice that syncFlexTime only works for Android 4.4+, for older versions, that value will be ignored and syncs will be always exact.

Running example

You can try this library running the example app:

cd example && yarn && npm start

Then just run:

react-native run-android

Be careful: The installed app will trigger a sync around every minute (so it is easy to see that is working). If you debug the app, you should be able to see the HeadlessJS ouputing: Headless JS task was fired! (remember not to have the app on the foreground). After you try it, I recommend to uninstall the app so you don't harm your device battery life.

react-native-sync-adapter's People

Contributors

ferrannp avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.