348
Integrate Flipper
under review
Greg
Integrating Flipper would really help in debugging apps. Flipper is now baked into RN v0.62. Let's get this bad boy into the next expo SDK!
Activity Feed
Sort by
Fábio Alvarenga
Just linking it here, it's already on Expo's blog, Jakob Heuser provides a great initial integration: https://blog.expo.dev/developing-react-native-with-expo-and-flipper-8c426bdf995a
Evan Bacon
under review
Fernando Rojo
With Expo SDK 41, this should be achieved with a config plugin.
Seanmclem
Fernando Rojo: please elaborate
Fernando Rojo
This would be nice to allow remote debugging with Reanimated v2. At the moment, Reanimated 2 doesn't allow remote debugging, so you have to use the terminal console logs: https://github.com/software-mansion/react-native-reanimated/issues/1127#issuecomment-772868632
W
Wayne Dunkley
I have not yet used Flipper but I can definitely see a benefit for it. I have used React Native Debugger for all my debugging purposes for quite some time and it has been indispensable to my development process. But with the imminent official release of Reanimated 2, and its use of Turbo Modules, I have had to start looking for something else as I will no longer be able to use RND. I have currently turned to Reactotron for debugging but as this is not actively maintained I can't see me relying on this for the future. This brings me full circle back to Flipper. It appears that this will cover all of our development needs and from what I can tell will work with Turbomodules enabled and does not rely on remote debugging. For this reason, I strongly think that Flipper added to the roadmap. Because what use are having all these other amazing features added if we can't debug them??
Evan
Flipper would allow debugging JS with Turbomodules enabled - right now with Reanimated2 in use, Flipper is the only way to debug.
Anna Maste
I'm using React Query (https://react-query.tanstack.com/) pretty extensively and love it, but it doesn't have a plugin for react native debugger, only for Flipper. I'm sure there are other 3rd party libraries out there that are similar, so Expo support for Flipper would really open up things.
p
That will be Great
R
Rafael Morais
This would be amazing :) Please take this into consideration
Brent Vatne
which features of it are you most looking forward to using?
Greg
Brent Vatne:
- Crash Reporter
- Network Inspect
- Native Layout Inspect
- React DevTool & Live Editing
- Plug-ins
a. Redux Inspector
b. React Native Performance
David Richards
Brent Vatne: Hoping for an integrated debugging experience (obviously!) but tooling to get around the opacity of 'red box' error messaging.
Presently suffering from not being able to get a decent debugging environment. This is probably due to user error (incompetence).
R
Riley O.
Brent Vatne: Crash Reporter, Layout, Navigation (bookmarking deep links), and Network are top of my list. Also interested to see what people build as plugins!
Brent Vatne
Greg:
- 1: What are you hoping to use this for? You see JS crashes already in the form of red screens / logs in expo-cli. If you want native crash information you can look at device logs https://docs.expo.io/workflow/logging/#optional-manually-access-device-logs
- 2: This indeed would be useful!
- 3: What are you hoping to use native layout inspector for? You can inspect elements already within react native devtools, same as above https://docs.expo.io/workflow/debugging/#react-native-debugger
- 4, 5 are already available without Flipper: https://docs.expo.io/workflow/debugging/#react-native-debugger
Brent Vatne
Riley O.: See previous reply re: Crash Reporter, Layout, and Network. Re: Navigation - I'm not familiar with what Flipper does here, but I know that it doesn't do anything related to React Navigation yet (we build this at Expo) - see https://reactnavigation.org/blog/2020/02/06/react-navigation-5.0/#redux-devtools-integration for React Navigation integration into dev tools
Brent Vatne
David Richards: By debugging do you mean like being able to set breakpoints, pause, and step through code? Flipper doesn't provide this, but there does definitely need to be a better story for this than "remote" debugging via Chrome, and it's being worked on! Most other things it provides are already available via react-native-debugger or react-devtools (same thing basically, react-devtools is embedded in react-native-debugger)
David Richards
Brent Vatne: Thanks for your response and breaking down tool availability. I need to go back to the docs and study how to get a good testing environment set up.
R
Riley O.
Brent Vatne: Thanks for the info, Brent! Love how active you are in this ecosystem. In terms of Navigation, what are your thoughts on this: https://fbflipper.com/docs/features/navigation-plugin
Part of what I'm excited about is having all these tools in one spot. Also interested to see the performance while running Flipper vs the current tools.
Brent Vatne
Riley O.: oh that's neat. you can also do a similar thing from the command line using the
uri-scheme
package that @EvanBacon built, eg: npx uri-scheme open exp://127.0.0.1:19000/--/some-deep-link --ios --android
Emma Lejeck
Brent Vatne: Honestly I'm just looking forward to a truly
polished
set of dev tools. I can debug things with the current tools, but it's not particularly enjoyable. Flipper looks like it adds a lot of polish to the experience!Slapbox
Brent Vatne: One major issue I have with existing debugger options is that our app runs substantially differently when I use them. Not the frontend, but the backend logic can be INCREDIBLY difficult to debug with React-Native-Debugger. The behavior even changes between React-Native-Debugger and browser debugging.
Also, other issues with React-Native-Debugger, like if I have a file named someFeature.js, upon reloading the debugger creates a second reference to the same file, and then a third, and a fourth. I'm not sure what triggers that, but so I have to restart the debugger pretty often, otherwise I end up setting breakpoints in these zombie files that are never hit.
There are other issues too. So the gains are more than just the features gained - it's also the bugs that would be removed from the developer workflow.
I haven't used Flipper, but if it resolves just those issues it would save me an incredible amount of time and frustration.
Mickael Lecoq
Brent Vatne: database plugin (even if it is only supported on android) is very useful to have a look in sqlite db
Steve Moretz
Brent Vatne: Yeah it doesn't provide breakpoints that's stupid.The most important thing a debugger needs to do is debugging code.
Most people like me want this because reanimated 2 breaks the app on remote debugging.How about disabling reanimated 2 for remote debugging?
And get rid of the error for now.
Load More
→