PostHog / posthog-react-native-session-replay

Session Replay for React Native
MIT License
7 stars 0 forks source link

Sporadic vertical shift glitch on Android #12

Open joaqo opened 3 days ago

joaqo commented 3 days ago

Hi! This works flawlessly except for a sporadic vertical shift glitch on Android. Sporadically the whole screen shifts up and down for a few milliseconds. I think it gets more triggered when I interact with any react navigation component. Could be caused by safe areas, as I think the vertical shift corresponds with the size of the top safe area.

The diagnosis was quite simple, if I install this library the glitch happens on some Android devices (Pixel 6a for example), if I uninstall it the issue is resolved. I think it only happens on some Android devices because on the other devices (older ones) the package doesn't even get installed as the android sdk version requirements are too new.

Attaching my current package.json and a video of the glitch. package.json

https://github.com/user-attachments/assets/d05040a3-9bc6-43e3-ae64-79dce125fa2f

marandaneto commented 3 days ago

hello @joaqo thanks for the issue. Can you try to disable for example maskAllTextInputs and maskAllImages and see if it helps? So we can narrow down the masking feature. The other test is to increase the androidDebouncerDelayMs from 1000 to eg 3000 and see if it helps. Read more about the configs here. Does it happen on other screens without a listview?

joaqo commented 3 days ago

Hi, thanks for the help!

I already had those settings disabled, tried increasing androidDebouncerDelayMs to 3000 (had it at 500) and it improved considerably in how often it happens, but its still present.

Does it happen on other screens without a listview?

I am not sure, as most of my views have lists and the glitch is sporadic, but its very possible that it doesn't.

These are my current posthog settings:

 { host: "https://us.i.posthog.com",
  // disabled: __DEV__,
  enableSessionReplay: Platform.OS === "ios",  // I turned this on an android for the tests ofcourse
  sessionReplayConfig: {
    // Whether text inputs are masked. Default is true.
    // Password inputs are always masked regardless
    maskAllTextInputs: false,
    // Whether images are masked. Default is true.
    maskAllImages: false,
    // Capture logs automatically. Default is true.
    // Android only (Native Logcat only)
    captureLog: true,
    // Whether network requests are captured in recordings. Default is true
    // Only metric-like data like speed, size, and response code are captured.
    // No data is captured from the request or response body.
    // iOS only
    captureNetworkTelemetry: true,
    // Deboucer delay used to reduce the number of snapshots captured and reduce performance impact. Default is 500ms
    androidDebouncerDelayMs: 500,
    // Deboucer delay used to reduce the number of snapshots captured and reduce performance impact. Default is 1000ms
    iOSdebouncerDelayMs: 1000,
  },
marandaneto commented 3 days ago

@joaqo which version of the SDK? androidDebouncerDelayMs is 1000 by default now to avoid the performance hit. there were a few improvements in the latest versions, so maybe try using the latest version?

joaqo commented 3 days ago

I'm was using

    "posthog-react-native": "^3.3.6",
    "posthog-react-native-session-replay": "^0.1.5",

Just updated to 0.1.6 and set the debounce to 1000ms. It improved quite a bit, but the issue is still present although more sporadically.