Research: Redux Toolkit 2.x selected for state management
- Completed Redux vs Zustand vs Jotai comparison - Redux Toolkit selected (9.2/10 score) - Best for complex state (family structure, permissions) - Best for offline sync (RTK Query, optimistic updates) - Largest ecosystem (most resources, tutorials, examples) - Best developer experience (time-travel debugging) - 100% code sharing between React Native and React Trade-offs: - More boilerplate (clearer structure) - Steeper learning curve (better patterns) - Larger bundle 60KB vs 3KB (negligible impact) Updated tech stack decisions and README Next: Authentication system design (JWT with recovery phrases)
This commit is contained in:
goose
parent
735df1f15d
commit
195ba2ec4e
4 changed files with 911 additions and 30 deletions
|
|
@ -51,6 +51,29 @@
|
|||
|
||||
---
|
||||
|
||||
### 4. State Management: Redux Toolkit
|
||||
**Decision**: Redux Toolkit 2.x for React Native + React
|
||||
|
||||
**Score**: 9.2/10
|
||||
|
||||
**Rationale**:
|
||||
- **Best for complex state**: Family structure, multi-person profiles, permissions
|
||||
- **Built-in normalization**: createEntityAdapter for efficient data management
|
||||
- **Best for offline sync**: RTK Query for server state, optimistic updates, background sync
|
||||
- **Largest ecosystem**: Most resources, tutorials, examples, production deployments
|
||||
- **Best developer experience**: Time-travel debugging, predictable state updates
|
||||
- **TypeScript**: Excellent support, full type safety
|
||||
- **Code sharing**: 100% between React Native and React
|
||||
|
||||
**Trade-offs**:
|
||||
- More boilerplate: More code, but clearer structure
|
||||
- Steeper learning curve: More concepts, but better patterns
|
||||
- Larger bundle: 60KB vs 3KB (negligible impact on 50-100MB app)
|
||||
|
||||
**Reference**: [2026-02-14-state-management-research.md](./2026-02-14-state-management-research.md)
|
||||
|
||||
---
|
||||
|
||||
## Technology Stack Summary
|
||||
|
||||
### Backend
|
||||
|
|
@ -63,44 +86,43 @@
|
|||
### Mobile (iOS + Android)
|
||||
- **Framework**: React Native 0.73+
|
||||
- **Language**: TypeScript
|
||||
- **Health Sensors**: react-native-health, react-native-google-fit
|
||||
- **State Management**: Redux Toolkit 2.x
|
||||
- **Data Fetching**: RTK Query 2.x
|
||||
- **Navigation**: React Navigation
|
||||
- **Health Sensors**:
|
||||
- react-native-health (iOS HealthKit)
|
||||
- react-native-google-fit (Android Health Connect)
|
||||
- **QR Scanning**: react-native-camera
|
||||
- **Encryption**: react-native-quick-crypto
|
||||
- **Persistence**: Redux Persist 6.x (AsyncStorage)
|
||||
- **HTTP**: Axios
|
||||
|
||||
### Web
|
||||
- **Framework**: React 18+
|
||||
- **Language**: TypeScript
|
||||
- **State Management**: Redux Toolkit 2.x
|
||||
- **Data Fetching**: RTK Query 2.x
|
||||
- **Routing**: React Router
|
||||
- **Charts**: Recharts
|
||||
- **Persistence**: Redux Persist 6.x (localStorage)
|
||||
- **HTTP**: Axios
|
||||
|
||||
### Shared (Monorepo)
|
||||
- **Language**: TypeScript
|
||||
- **State**: Redux/Zustand (TBD)
|
||||
- **State Management**: Redux Toolkit 2.x
|
||||
- **Reducers**: Shared reducers (user, family, encryption)
|
||||
- **Selectors**: Shared selectors (Reselect 5.x)
|
||||
- **API**: Axios
|
||||
- **Encryption**: AES-256-GCM, PBKDF2
|
||||
- **Validation**: Zod
|
||||
- **Date**: date-fns
|
||||
- **Utilities**: Shared package
|
||||
|
||||
---
|
||||
|
||||
## Still To Be Decided
|
||||
|
||||
### 1. State Management (Priority: High)
|
||||
|
||||
**Options**:
|
||||
- Redux (mature, large ecosystem)
|
||||
- Zustand (simple, modern)
|
||||
- Jotai (atomic, minimal)
|
||||
|
||||
**Considerations for Normogen**:
|
||||
- 70-80% code sharing between mobile and web
|
||||
- Complex state (family structure, multi-person profiles)
|
||||
- Offline synchronization
|
||||
- Encrypted data caching
|
||||
|
||||
---
|
||||
|
||||
### 2. Authentication Strategy (Priority: High)
|
||||
### 1. Authentication Strategy (Priority: High)
|
||||
|
||||
**Options**:
|
||||
- JWT (stateless, scalable)
|
||||
|
|
@ -108,7 +130,7 @@
|
|||
- Passkey/WebAuthn (passwordless, modern)
|
||||
|
||||
**Considerations for Normogen**:
|
||||
- Zero-knowledge password recovery
|
||||
- Zero-knowledge password recovery (from encryption.md)
|
||||
- Token revocation strategy
|
||||
- Multi-factor authentication (future)
|
||||
- Integration with client-side encryption keys
|
||||
|
|
@ -116,7 +138,7 @@
|
|||
|
||||
---
|
||||
|
||||
### 3. Database Schema (Priority: High)
|
||||
### 2. Database Schema (Priority: High)
|
||||
|
||||
**Collections to Design**:
|
||||
- Users (authentication, profiles)
|
||||
|
|
@ -133,7 +155,7 @@
|
|||
|
||||
1. Rust Framework: Axum (COMPLETED)
|
||||
2. Mobile/Web Framework: React Native + React (COMPLETED)
|
||||
3. State Management: Redux vs Zustand
|
||||
3. State Management: Redux Toolkit 2.x (COMPLETED)
|
||||
4. Authentication: JWT with recovery phrase
|
||||
5. Database Schema: Design MongoDB collections
|
||||
6. Create POC: Health sensor integration test
|
||||
|
|
@ -143,14 +165,13 @@
|
|||
|
||||
## Next Research Priority
|
||||
|
||||
**Research Question**: Which state management library (Redux vs Zustand) is best for Normogen's encrypted health data platform?
|
||||
**Research Question**: How to implement zero-knowledge authentication with JWT and recovery phrase support?
|
||||
|
||||
**Considerations**:
|
||||
- 70-80% code sharing between React Native and React
|
||||
- Complex state (family structure, multi-person profiles)
|
||||
- Offline synchronization
|
||||
- Encrypted data caching
|
||||
- TypeScript support
|
||||
- Bundle size (mobile)
|
||||
- Zero-knowledge password recovery (from encryption.md)
|
||||
- Token revocation strategy
|
||||
- Multi-factor authentication (future)
|
||||
- Integration with client-side encryption keys
|
||||
- Family member access control
|
||||
|
||||
**Estimated Research Time**: 1-2 hours
|
||||
**Estimated Research Time**: 2-3 hours
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue