Code360 powered by Coding Ninjas X Naukri.com. Code360 powered by Coding Ninjas X Naukri.com
Table of contents
1.
Introduction
2.
JS API
3.
JAVA API
4.
Retries
5.
Caveats
6.
Frequently asked questions
6.1.
Define Headless JS.
6.2.
Write down the purpose of JS API.
6.3.
Define JAVA API.
6.4.
Explain the purpose of LinearCountingRetryPolicy.
6.5.
How to perform the retries in Headless JS?
7.
Key Takeaways
Last Updated: Mar 27, 2024

Headless JS React Native

Author Prachi Singh
1 upvote
Master Python: Predicting weather forecasts
Speaker
Ashwin Goyal
Product Manager @

Introduction

Headless JS is a technique to employ tasks in JavaScript while the user's app is in the background. It can be used, for example, to sync new data, handle push notifications, or play music.


Click on the following link to read further: Hooks in React JS

JS API

A task is an async function that users register on AppRegistry, in a way similar to writing React applications:

import { AppRegistry } from 'react-native';
AppRegistry.registerHeadlessTask('SomeTaskName', () =>
 require('SomeTaskName')
);
Get the tech career you deserve, faster!
Connect with our expert counsellors to understand how to hack your way to success
User rating 4.7/5
1:1 doubt support
95% placement record
Akash Pal
Senior Software Engineer
326% Hike After Job Bootcamp
Himanshu Gusain
Programmer Analyst
32 LPA After Job Bootcamp
After Job
Bootcamp

JAVA API

Users need to enhance HeadlessJsTaskService and override the getTaskConfig described below.

package com.your_application_name;
import android.content.Intent;
import android.os.Bundle;
import com.facebook.react.HeadlessJsTaskService;
import com.facebook.react.bridge.Arguments;
import com.facebook.react.jstasks.HeadlessJsTaskConfig;
import javax.annotation.Nullable;
public class MyTaskService extends HeadlessJsTaskService {
  @Override
  protected @Nullable HeadlessJsTaskConfig getTaskConfig(Intent intent) {
    Bundle extras = intent.getExtras();
    if (extras != null) {
      return new HeadlessJsTaskConfig(
          "SomeTaskName",
          Arguments.fromBundle(extras),
          5000, // timeout for the task
          false // optional: defines whether or not  the task is allowed in foreground. Default is false
        );
    }
    return null;
  }
}

Then, add the user’s service to the AndroidManifest.xml file.

Retries

By default, the headless JS task does not perform any retries. To do so, users need to create a HeadlessJsRetryPolicy and subject to a specific Error.

LinearCountingRetryPolicy is a way of implementing the HeadlessJsRetryPolicy that allows users to predict a maximum number of retries corresponding to a fixed delay between each attempt. If that does not suit users' needs, they can implement their HeadlessJsRetryPolicy. These policies can be passed as an extra argument to the HeadlessJsTaskConfig constructor with the code described below.

HeadlessJsRetryPolicy retryPolicy = new LinearCountingRetryPolicy(
 3, // Max number of retry attempts
 1000 // Delay between each retry attempt
);
return new HeadlessJsTaskConfig(
 'SomeTaskName',
 Arguments.fromBundle(extras),
 5000,
 false,
 retryPolicy
);

Caveats

  • The function passed to setTimeout does not always behave as expected. Instead, the process is called only when the application is relaunched. If you only need to wait, use the retry functionality.
  • By default, your app will crash if you try to run a task while the app is in the foreground. This prevents developers from shooting themselves in the foot by doing a lot of work on a job and slowing the UI. You can pass a fourth boolean argument to control this behaviour.
  • If you start your service from a BroadcastReceiver, call HeadlessJsTaskService.acquireWakeLockNow() before returning from onReceive().

Also see,  React Native Reanimated

Frequently asked questions

Define Headless JS.

Headless JS is a technique to employ tasks in JavaScript while the user's app is in the background.

Write down the purpose of JS API.

A task is an async function that users register on AppRegistry, similar to writing React applications.

Define JAVA API.

Users need to enhance HeadlessJsTaskService and override the getTaskConfig.

Explain the purpose of LinearCountingRetryPolicy.

LinearCountingRetryPolicy is a way of implementing the HeadlessJsRetryPolicy that allows users to predict a maximum number of retries corresponding to a fixed delay between each attempt.

How to perform the retries in Headless JS?

Users need to create a HeadlessJsRetryPolicy and subject to a specific Error.

Key Takeaways

Congratulations on finishing the blog!! After reading this blog, you will grasp the concept of the Headless JS - React Native.

If you are preparing yourself for the top tech companies, don't worry. Coding Ninjas has your back. Visit this link for a well-defined and structured material that will help you provide access to knowledge in every domain.

Happy Learning!!

Previous article
React Native Running IOS Apps
Next article
Running React Native Apps on Android
Live masterclass