Dr.Carrot Mobile

For Each Optimization Task, Follow These Steps:

1. Audit Current Implementation:
- Use React DevTools Profiler to identify performance issues and note it
- Check the network calls and redux state changes using reactotron tool

2. Implement Optimization:
- Apply the specific optimization techniques which we have in guide_line.md (see attach file)
- Test the changes thoroughly
- Measure performance improvements
- Document the changes made

3. Verify Improvements:
- Run performance tests before and after
- Check for any regressions
- Ensure functionality remains intact
- Update documentation

4. Code Quality Checks:
- Run ESLint and fix warnings
- Ensure TypeScript strict mode compliance
- Follow consistent naming conventions
- Add proper error handling

5. Testing:
- Test on both iOS and Android
- Test on low-end devices
- Verify offline functionality
- Check memory usage

Common Optimization Patterns:
- React.memo for component memoization
- useCallback for event handlers
- useMemo for expensive calculations
- FlatList optimization with proper props
- Redux selectors with createSelector
- Image optimization with FastImage
- Network caching for API responses
- Memory cleanup in useEffect

Performance Metrics to Track:
- Component render count
- Memory usage
- Bundle size
- App startup time
- Screen transition time
- API response time

Files to Always Check:
- Remove console.log statements
- Fix ESLint warnings
- Add proper TypeScript types
- Implement error boundaries
- Add loading states

Before Committing:
- Test on real devices
- Check for memory leaks
- Verify no breaking changes
- Update documentation

Note: Each task should be completed independently and thoroughly tested before moving to the next one. Document all changes and performance improvements for future reference.