Refine slows down react native expo app
I logged it and turns out there are 3-4 re-renders happening. I am using refinedev/core and refinedev/react-hook-forms
3 Replies
Hi @Supa hot fire. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Based on the knowledge sources provided, there is no explicit documentation or report about Refine causing performance issues or excessive re-renders specifically in React Native Expo apps. However, there are several general insights about re-renders and performance optimization in React and with Refine:
- React Hook Form is designed to minimize unnecessary re-renders by isolating field updates and using an "uncontrolled first" approach, which should generally improve performance in forms compared to traditional controlled components. If you are seeing multiple re-renders, it may be due to how components are structured or how state/props are managed, rather than an inherent issue with Refine or React Hook Form itself. React Hook Form's proxy-based subscription model is specifically intended to reduce unrelated field re-renders and improve performance React Hook Form: Standout Features.
- Unnecessary re-renders can occur in React apps (including those using Refine) if components are not memoized or if functions/objects are re-created on each render. Using
The knowledge sources do not explicitly mention Refine causing slowdowns or excessive re-renders in React Native Expo apps. The general advice is to profile your components, use memoization techniques, and leverage React Hook Form's performance features. If the issue persists, you may want to isolate the problematic component or share a minimal reproduction for further investigation. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
React.memo, useCallback, and useMemo can help prevent this. For example, wrapping components with React.memo ensures they only re-render when their props change Optimize Performance with Props.
- Profiling and debugging: You can use React DevTools Profiler to identify which components are re-rendering and why. This can help you pinpoint the source of extra renders and optimize accordingly You can Profile Components in DevTools.
- React Native specifics: The knowledge sources do not provide details about React Native Expo-specific performance with Refine. If you are experiencing 3-4 re-renders, it may be worth checking if you are using any patterns (such as inline functions or objects, or not memoizing components) that could cause unnecessary updates, as these are common causes in React in general Common Problems with React Virtual DOM and How to Avoid Them.
Summary:The knowledge sources do not explicitly mention Refine causing slowdowns or excessive re-renders in React Native Expo apps. The general advice is to profile your components, use memoization techniques, and leverage React Hook Form's performance features. If the issue persists, you may want to isolate the problematic component or share a minimal reproduction for further investigation. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
<@541506908301819930> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
xenial-blackOP•5d ago
even things like useTable is exteremely slow in react native mobile