React-Native support?

[maxkomarychev]

Hi,

I have set up @datadog/browser-logs in react-native app according to the guide

but whenever I am calling log method I see this warning in console:

'logs.logger.info' not yet available, please call '.init()' first.

how can this library be used for react-native?

[kokliKo]

Hi,
Thanks for pinging us.
Yes, our library is not compatible with React Native. Given the differences between JS and React Native we will most likely have to build a new library from scratch.
We plan to work on it at some point but not in the short term unfortunately.

We'll keep you posted when we start working on React Native support.

Thank you!
Nicolas

[wmcbain]

@kokliKo For now is the recommended solution sending logs, trace events, etc manually? https://docs.datadoghq.com/getting_started/logs/?tab=ussite#sending-logs-manually

[maxkomarychev]

@kokliKo would you mind sharing what special does this sdk do which can't work in RN?
apart from not having very browser specific things like window it's pretty much normal js environment

[wmcbain]

@maxkomarychev youd have to do a lot of overrides in the package for certain things. Either through polyfills or patch-package.

[ncreated]

would you mind sharing what special does this sdk do which can't work in RN?
apart from not having very browser specific things like window it's pretty much normal js environment

Hey @maxkomarychev. Speaking on mobile specificities - we actively work on two native SDKs: dd-sdk-ios and dd-sdk-android. In order to deliver best quality on mobile, they incorporate many things that are not browser-related, to name a few:

• Runtime impact optimization - by leveraging multithreading and not performing heavy work on some environment constraints (like low battery not plugged into charger).
• Offline mode support - data can be still collected in offline and uploaded later even if the app was terminated or suspended.
• Data transfer optimization - mobile SDKs do not upload data on "expensive" connections (like cellular with "constrained" mode or when using WIFI routed through "expensive" mobile hotspot).
• Mobile-specific metadata - we enrich our mobile data with things like active radio technology (LTE, 3G, ...) or active network interfaces.
• Deep OS integrations - like uploading data from background jobs on Android when user dismisses the app from the foreground.

We want our answer to RN support to include (ideally all) above concepts.

[dhaniboy09]

Having the exact same error as @maxkomarychev
Does this also apply to regular React? My app is built with NextJS.

cc: @kokliKo

[maamounapprise]

@ncreated @bcaudan could we then use https://reactnative.dev/docs/native-modules-ios along side native datadog logging?

[ncreated]

@maamounapprise For what I see, this should work fine for you 👌. Following "Exporting Swift" section and given that the native Datadog iOS SDK already exposes its Logging interface to Objective-C (through Logger+objc.swift), you'd have to @import DatadogObjc in Objective-C file and define a set of RCT_EXTERN_ macros.

As mentioned, RN and wide cross-platform support is on our future list, so we don't focus on it right now. But I'd be very happy to see you trying it out in a RN project through Native Modules and coming back with the feedback 🙏.

[ryosuke-wakaba]

My solution of sending logs from React Native App is below.

https://docs.datadoghq.com/api/v1/logs/

    const url = "https://browser-http-intake.logs.datadoghq.com/v1/input/<client tokens>";
    fetch(url, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        "ddsource": "native-app",
        "ddtags": "env:develop",
        "message": "test",
        "service": "xxx-native-app"
      })
    })