Skip to content

Commit 60b2b51

Browse files
foghinahramos
authored andcommitted
add headless js guide
Summary: **Test plan (required)** Run the website, check everything renders. Closes #10325 Differential Revision: D4008427 Pulled By: bestander fbshipit-source-id: 2ba78d33efab2bf2267a806bfc8d3b0ec50f54f5
1 parent 44206a9 commit 60b2b51

3 files changed

Lines changed: 59 additions & 2 deletions

File tree

docs/HeadlessJSAndroid.md

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
---
2+
id: headless-js-android
3+
title: Headless JS
4+
layout: docs
5+
category: Guides (Android)
6+
permalink: docs/headless-js-android.html
7+
next: running-on-device-android
8+
previous: native-components-android
9+
---
10+
11+
Headless JS is a way to run tasks in JavaScript while your app is in the background. It can be used, for example, to sync fresh data, handle push notifications, or play music.
12+
13+
## The JS API
14+
15+
A task is a simple async function that you register on `AppRegistry`, similar to registering React applications:
16+
17+
```js
18+
AppRegistry.registerHeadlessTask('SomeTaskName', () => require('SomeTaskName'));
19+
```
20+
21+
Then, in `SomeTaskName.js`:
22+
23+
```js
24+
module.exports = async (taskData) => {
25+
// do stuff
26+
}
27+
```
28+
29+
You can do anything in your task as long as it doesn't touch UI: network requests, timers and so on. Once your task completes (i.e. the promise is resolved), React Native will go into "paused" mode (unless there are other tasks running, or there is a foreground app).
30+
31+
## The Java API
32+
33+
Yes, this does still require some native code, but it's pretty thin. You need to extend `HeadlessJsTaskService` and override `getTaskConfig`, e.g.:
34+
35+
```java
36+
public class MyTaskService extends FbHeadlessJsTaskService {
37+
38+
@Override
39+
protected @Nullable HeadlessJsTaskConfig getTaskConfig(Intent intent) {
40+
Bundle extras = intent.getExtras();
41+
if (extras != null) {
42+
return new HeadlessJsTaskConfig(
43+
"SomeTaskName",
44+
Arguments.fromBundle(extras),
45+
5000);
46+
}
47+
return null;
48+
}
49+
}
50+
```
51+
52+
Now, whenever you [start your service](https://developer.android.com/reference/android/content/Context.html#startService(android.content.Intent)), e.g. as a periodic task or in response to some system event / broadcast, JS will spin up, run your task, then spin down.
53+
54+
## Caveats
55+
56+
* By default, your app will crash if you try to run a task while the app is in the foreground. This is to prevent developers from shooting themselves in the foot by doing a lot of work in a task and slowing the UI. There is a way around this.
57+
* If you start your service from a BroadcastReceiver, make sure to call `HeadlessJsTaskService.acquireWakelockNow()` before returning from `onReceive()`.

docs/NativeComponentsAndroid.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ title: Native UI Components
44
layout: docs
55
category: Guides (Android)
66
permalink: docs/native-components-android.html
7-
next: running-on-device-android
7+
next: headless-js-android
88
previous: native-modules-android
99
---
1010

docs/RunningOnDeviceAndroid.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ layout: docs
55
category: Guides (Android)
66
permalink: docs/running-on-device-android.html
77
next: signed-apk-android
8-
props: native-components-android
8+
previous: headless-js-android
99
---
1010

1111
## Prerequisite: USB Debugging

0 commit comments

Comments
 (0)