react-native-reanimated
react-native-reanimated copied to clipboard
Name every worklet function
Summary
Currently, in case of unnamed worklets, such as
() => {
'worklet';
// some logic
}
function () {
'worklet'
// some logic
}
Those functions are named anonymous
and parsed as such on the Worklet Runtime. However, this is a pitfall for Reanimated. When the anonymous
function crashes and the stack trace is vague - it usually is, especially in production - the first suspicion is the error in Reanimated's core logic, since we don't know which function in particular has failed.
In case of a faulty logic in a third-party library this is double as harmful. It doesn't lead the creators of these libraries into the pit of success, since they might not be aware it's their code causing issues. Conversely, Reanimated maintainers receive a very obscure issue and engage in rather unpleasant debugging process - only to discover later the library's fault.
My idea is to:
- Add source library name to every worklet function.
- Add source file name to every worklet function.
- Add ID to every worklet function.
Test plan
- [x] Update the plugin test snapshots.
- [x] Add relevant test cases if not present already.
- [x] Try to recreate a crash for a third party library, compare the clarity of raised exceptions.
Before | After |
---|---|
Production developer environment | |
Sentry stack trace | |
Sentry stack traces are coming from Android. Unfortunately, regardless of these changes iOS Sentry stack traces look like this: