You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
415 lines
12 KiB
Markdown
415 lines
12 KiB
Markdown
# Android vs Web Platform Comparison
|
|
|
|
> Quick reference for understanding differences between Android and Web versions
|
|
> Last Updated: July 30, 2026
|
|
|
|
---
|
|
|
|
## 🔍 Platform Feature Comparison
|
|
|
|
| Feature | Android (Current) | Web (After Migration) | Implementation Effort |
|
|
|---------|-------------------|----------------------|----------------------|
|
|
| **Kiosk Mode** | ✅ Native Android kiosk mode | ⚠️ Browser fullscreen + kiosk flags | Low |
|
|
| **Auto-Start on Boot** | ✅ BootBroadcastReceiver | ⚠️ Browser autostart config | Low |
|
|
| **Wake Lock** | ✅ WakelockPlus plugin | ✅ Browser Wake Lock API | Low |
|
|
| **Screen Always On** | ✅ WindowManager flags | ✅ Wake Lock API | Low |
|
|
| **Background Service** | ✅ Foreground service | ❌ Not possible (tab must stay open) | N/A |
|
|
| **File Logging** | ✅ External storage | ✅ IndexedDB + download | Medium |
|
|
| **SignalR Real-time** | ✅ signalr_core | ✅ Same (WebSocket) | None |
|
|
| **Audio Playback** | ✅ just_audio | ⚠️ just_audio web or HTML5 Audio | Low |
|
|
| **Text-to-Speech** | ✅ flutter_tts | ⚠️ Web Speech API | Medium |
|
|
| **QR Scanner** | ✅ qr_code_scanner_plus | ⚠️ mobile_scanner (requires HTTPS) | Low |
|
|
| **Scheduled Tasks** | ✅ AlarmManager | ⚠️ JavaScript timers | Medium |
|
|
| **Offline Support** | ✅ Native app | ⚠️ PWA with Service Worker | Medium |
|
|
| **Push Notifications** | ✅ Firebase Cloud Messaging | ⚠️ Web Push API | Medium |
|
|
| **Network Detection** | ✅ connectivity_plus | ✅ Same (web support) | None |
|
|
| **Local Storage** | ✅ SharedPreferences | ✅ localStorage (same plugin) | None |
|
|
| **Multi-language** | ✅ Built-in | ✅ Built-in | None |
|
|
| **Updates** | ⚠️ Manual APK deployment | ✅ Instant (refresh page) | N/A |
|
|
| **Installation** | ⚠️ APK + ADB | ✅ Just open URL | N/A |
|
|
| **Security** | ✅ Full device control | ⚠️ Browser sandbox | N/A |
|
|
| **Crash Recovery** | ✅ Can restart automatically | ⚠️ Browser dependent | Low |
|
|
|
|
**Legend:**
|
|
✅ Fully Supported | ⚠️ Supported with Limitations | ❌ Not Supported
|
|
|
|
---
|
|
|
|
## 📦 Dependencies Comparison
|
|
|
|
### Android-Only (Remove for Web)
|
|
|
|
```yaml
|
|
# These will be removed
|
|
wakelock_plus: ^1.2.10 # Use Browser Wake Lock API instead
|
|
path_provider: ^2.1.5 # Use IndexedDB/localStorage instead
|
|
qr_code_scanner_plus: ^2.0.10+1 # Use mobile_scanner instead
|
|
```
|
|
|
|
### Web-Compatible (Keep)
|
|
|
|
```yaml
|
|
# These work on both platforms
|
|
provider: ^6.1.2 # ✅ State management
|
|
get_it: ^8.0.2 # ✅ Dependency injection
|
|
signalr_core: ^1.1.1 # ✅ Real-time communication
|
|
connectivity_plus: ^6.1.0 # ✅ Network monitoring
|
|
shared_preferences: ^2.3.5 # ✅ Local storage
|
|
flutter_svg: ^2.0.14 # ✅ SVG rendering
|
|
intl: ^0.19.0 # ✅ Internationalization
|
|
logger: ^2.4.0 # ✅ Logging framework
|
|
http: ^1.2.2 # ✅ HTTP requests
|
|
```
|
|
|
|
### Web-Specific (Add)
|
|
|
|
```yaml
|
|
# Add these for web support
|
|
mobile_scanner: ^3.5.2 # QR scanner with web support
|
|
indexed_db: ^0.3.0 # Structured data storage
|
|
universal_html: ^2.2.4 # Access to web APIs
|
|
js: ^0.6.7 # JavaScript interop
|
|
```
|
|
|
|
### Requires Testing/Replacement
|
|
|
|
```yaml
|
|
just_audio: ^0.9.42 # ⚠️ Has web support, test needed
|
|
flutter_tts: ^4.2.0 # ⚠️ Limited web support, use Web Speech API
|
|
```
|
|
|
|
---
|
|
|
|
## 🔧 Code Changes Summary
|
|
|
|
### Files That Need Changes
|
|
|
|
| File | Type of Change | Complexity |
|
|
|------|---------------|------------|
|
|
| `lib/main.dart` | Modify | Low - Add platform detection |
|
|
| `lib/services/logger_service.dart` | New File | Medium - Create web version |
|
|
| `lib/services/wakelock_service.dart` | New File | Low - Wrapper for web/mobile |
|
|
| `lib/services/text_to_speech_service.dart` | Modify | Medium - Add web implementation |
|
|
| `lib/services/audio_service.dart` | Modify | Low - Test or add web fallback |
|
|
| `lib/utilities/native_method_handler.dart` | Modify | Low - Add platform checks |
|
|
| `lib/view_models/screen_config_view_model.dart` | Modify | Medium - Add web lifecycle |
|
|
| `lib/services/connectivity_service.dart` | Modify | Low - Add IP detection for web |
|
|
| `lib/config/dependency_injection.dart` | Modify | Medium - Platform-aware DI |
|
|
| `web/index.html` | Create | Low - Standard web config |
|
|
| `web/manifest.json` | Create | Low - PWA manifest |
|
|
|
|
### Files That Don't Need Changes
|
|
|
|
| File Category | Files | Reason |
|
|
|---------------|-------|--------|
|
|
| **Models** | All `lib/models/*.dart` | Platform-agnostic Dart code |
|
|
| **Repositories** | `lib/repositories/*.dart` | Use standard HTTP/SignalR |
|
|
| **Constants** | `lib/constants/*.dart` | Pure Dart constants |
|
|
| **UI Widgets** | Most of `lib/views/*.dart` | Flutter renders same |
|
|
| **View Models** | Business logic in ViewModels | Dart code, no platform API |
|
|
|
|
### Files to Delete (Not Needed for Web)
|
|
|
|
| File | Reason |
|
|
|------|--------|
|
|
| `android/` folder | Android-specific native code |
|
|
| `ios/` folder | iOS-specific native code |
|
|
| All `.kt` files | Kotlin is Android-only |
|
|
| `qline_scripts/*.sh` | Deployment scripts for Android APK |
|
|
|
|
---
|
|
|
|
## 🚀 Deployment Comparison
|
|
|
|
### Android Deployment (Current)
|
|
|
|
```bash
|
|
# Build
|
|
flutter build apk --release
|
|
|
|
# Deploy to devices
|
|
cd qline_scripts
|
|
sh deploy_qline.sh -ipfile device_ips_all.txt -version 9.4
|
|
|
|
# Update (requires ADB connection)
|
|
adb install -r app-release.apk
|
|
```
|
|
|
|
**Pros:**
|
|
- Full control over device
|
|
- Works offline always
|
|
- No browser dependencies
|
|
|
|
**Cons:**
|
|
- Manual deployment process
|
|
- Requires physical access or ADB
|
|
- Slower update rollout
|
|
- Version management complex
|
|
|
|
### Web Deployment (After Migration)
|
|
|
|
```bash
|
|
# Build
|
|
flutter build web --release
|
|
|
|
# Deploy to Firebase (example)
|
|
firebase deploy
|
|
|
|
# Or deploy to own server
|
|
rsync -avz build/web/ user@server:/var/www/qline/
|
|
```
|
|
|
|
**Pros:**
|
|
- ✅ Instant updates (just refresh)
|
|
- ✅ Deploy once, available everywhere
|
|
- ✅ No APK management
|
|
- ✅ Central control
|
|
- ✅ Easy rollback
|
|
|
|
**Cons:**
|
|
- ⚠️ Requires internet for updates
|
|
- ⚠️ Browser must be configured
|
|
- ⚠️ HTTPS required for camera
|
|
|
|
---
|
|
|
|
## 🎯 Feature Parity Matrix
|
|
|
|
### Core Features
|
|
|
|
| Feature | Android | Web | Notes |
|
|
|---------|---------|-----|-------|
|
|
| Patient Queue Display | ✅ | ✅ | Identical |
|
|
| Real-time SignalR Updates | ✅ | ✅ | Identical |
|
|
| Audio Call Tones | ✅ | ⚠️ | Web: autoplay restrictions |
|
|
| TTS Announcements | ✅ | ⚠️ | Web: Web Speech API |
|
|
| Multi-language (EN/AR) | ✅ | ✅ | Identical |
|
|
| RTL Support | ✅ | ✅ | Identical |
|
|
| Weather Widget | ✅ | ✅ | Identical |
|
|
| Prayer Times Widget | ✅ | ✅ | Identical |
|
|
| RSS Feed Widget | ✅ | ✅ | Identical |
|
|
| Configuration via IP | ✅ | ⚠️ | Web: URL param or manual |
|
|
| Health Check Logging | ✅ | ⚠️ | Web: IndexedDB + download |
|
|
| Crash Logging | ✅ | ⚠️ | Web: Console + IndexedDB |
|
|
|
|
### Kiosk Features
|
|
|
|
| Feature | Android | Web | Notes |
|
|
|---------|---------|-----|-------|
|
|
| QR Code Scanner | ✅ | ⚠️ | Web: Requires HTTPS |
|
|
| Manual ID Entry | ✅ | ✅ | Identical |
|
|
| Ticket Generation | ✅ | ✅ | Identical |
|
|
| Language Selection | ✅ | ✅ | Identical |
|
|
| Queue Selection | ✅ | ✅ | Identical |
|
|
| Thank You Screen | ✅ | ✅ | Identical |
|
|
|
|
### System Features
|
|
|
|
| Feature | Android | Web | Notes |
|
|
|---------|---------|-----|-------|
|
|
| 24/7 Operation | ✅ | ⚠️ | Web: Browser must stay open |
|
|
| Auto-restart | ✅ | ⚠️ | Web: Can reload page |
|
|
| Boot on Startup | ✅ | ⚠️ | Web: Configure browser autostart |
|
|
| Crash Recovery | ✅ | ⚠️ | Web: Browser dependent |
|
|
| Memory Management | ✅ | ⚠️ | Web: Browser handles |
|
|
| Log Rotation | ✅ | ⚠️ | Web: Manual download needed |
|
|
|
|
---
|
|
|
|
## 💰 Cost Comparison
|
|
|
|
### Android Deployment
|
|
|
|
**Initial Costs:**
|
|
- Android TV boxes/displays: $100-300 per device
|
|
- One-time setup per device
|
|
- ADB deployment setup
|
|
|
|
**Ongoing Costs:**
|
|
- Manual deployment time
|
|
- Physical access for updates
|
|
- Maintenance visits
|
|
|
|
**Advantages:**
|
|
- One-time cost
|
|
- No hosting fees
|
|
- Full offline operation
|
|
|
|
### Web Deployment
|
|
|
|
**Initial Costs:**
|
|
- Thin clients/mini PCs: $150-400 per device (optional - can reuse existing)
|
|
- SSL certificate: Free (Let's Encrypt)
|
|
- Domain name: $10-15/year
|
|
|
|
**Hosting Options:**
|
|
- Firebase Hosting: Free (up to 10GB)
|
|
- Self-hosted: Server costs
|
|
- Cloud (AWS/Azure): $20-100/month
|
|
|
|
**Ongoing Costs:**
|
|
- Hosting: $0-100/month
|
|
- Minimal deployment time
|
|
- Remote updates (no visits)
|
|
|
|
**Advantages:**
|
|
- Instant updates
|
|
- Remote management
|
|
- Central monitoring
|
|
|
|
---
|
|
|
|
## ⚡ Performance Comparison
|
|
|
|
### Android
|
|
|
|
| Metric | Performance |
|
|
|--------|-------------|
|
|
| App Startup | Fast (2-3 seconds) |
|
|
| Memory Usage | 80-150 MB |
|
|
| CPU Usage | Low (5-10%) |
|
|
| Network | SignalR WebSocket |
|
|
| Rendering | Native Android |
|
|
| Wake Lock | Native, reliable |
|
|
| Audio Latency | Low |
|
|
| Camera Access | Direct, fast |
|
|
|
|
### Web (Expected)
|
|
|
|
| Metric | Performance |
|
|
|--------|-------------|
|
|
| Page Load | Fast (2-4 seconds first load) |
|
|
| Memory Usage | 100-200 MB (browser + app) |
|
|
| CPU Usage | Low-Medium (10-20% with browser) |
|
|
| Network | SignalR WebSocket (same) |
|
|
| Rendering | Chromium rendering engine |
|
|
| Wake Lock | Browser API, reliable on Chrome |
|
|
| Audio Latency | Low-Medium (browser dependent) |
|
|
| Camera Access | WebRTC, slight delay |
|
|
|
|
**Overall:** Web performance is comparable, with slightly higher memory usage due to browser overhead.
|
|
|
|
---
|
|
|
|
## 🔒 Security Comparison
|
|
|
|
### Android
|
|
|
|
**Pros:**
|
|
- Full control over device
|
|
- Can lock down Android completely
|
|
- No browser vulnerabilities
|
|
- Native app sandbox
|
|
|
|
**Cons:**
|
|
- Physical device access required for setup
|
|
- APK can be extracted/reverse engineered
|
|
- Must manage device security
|
|
|
|
### Web
|
|
|
|
**Pros:**
|
|
- HTTPS encryption
|
|
- Browser security features
|
|
- Easy SSL certificate management
|
|
- Remote security updates
|
|
|
|
**Cons:**
|
|
- Browser can be accessed
|
|
- JavaScript can be viewed
|
|
- Depends on browser security
|
|
- Users can close browser (without kiosk mode)
|
|
|
|
**Recommendation:**
|
|
- Both can be secured adequately
|
|
- Web requires HTTPS + browser kiosk mode
|
|
- Android requires device lockdown
|
|
|
|
---
|
|
|
|
## 📈 Migration Timeline
|
|
|
|
| Phase | Android (Maintain) | Web (Build) | Total Time |
|
|
|-------|-------------------|-------------|------------|
|
|
| **Phase 1: Setup** | 0 days | 1-2 days | 1-2 days |
|
|
| **Phase 2: Services** | 0 days | 3-5 days | 3-5 days |
|
|
| **Phase 3: Core Updates** | 0 days | 2-3 days | 2-3 days |
|
|
| **Phase 4: UI Updates** | 0 days | 2-3 days | 2-3 days |
|
|
| **Phase 5: Testing** | 1 day | 4-6 days | 5-7 days |
|
|
| **Phase 6: Deployment** | 0 days | 3-5 days | 3-5 days |
|
|
| **Phase 7: Kiosk Setup** | 0 days | 2-3 days | 2-3 days |
|
|
| **Phase 8: Documentation** | 0 days | 1-2 days | 1-2 days |
|
|
| **TOTAL** | 1 day | 22-31 days | **23-32 days** |
|
|
|
|
---
|
|
|
|
## 🎯 Decision Matrix
|
|
|
|
### Choose Android If:
|
|
|
|
- ✅ You need complete device control
|
|
- ✅ You have IT staff for physical deployment
|
|
- ✅ You want true offline operation
|
|
- ✅ You need guaranteed 24/7 uptime
|
|
- ✅ You don't need frequent updates
|
|
|
|
### Choose Web If:
|
|
|
|
- ✅ You want instant updates across all locations
|
|
- ✅ You want centralized management
|
|
- ✅ You have stable HTTPS hosting
|
|
- ✅ You want easier deployment
|
|
- ✅ You can use browser kiosk mode
|
|
- ✅ You want cross-platform support (future: tablets, desktops)
|
|
|
|
### Choose Both If:
|
|
|
|
- ✅ You want maximum flexibility
|
|
- ✅ You can maintain both codebases (with shared business logic)
|
|
- ✅ You want to test web in pilot locations first
|
|
- ✅ You need backup deployment option
|
|
|
|
---
|
|
|
|
## 📊 Recommendation
|
|
|
|
### For HMG_QLine Project:
|
|
|
|
**Recommended Approach:** **Gradual Migration**
|
|
|
|
1. **Phase 1 (Now):** Keep Android as primary
|
|
2. **Phase 2 (2-4 weeks):** Build web version
|
|
3. **Phase 3 (1 week):** Pilot test web in 2-3 locations
|
|
4. **Phase 4 (2 weeks):** Evaluate feedback
|
|
5. **Phase 5 (Ongoing):** Migrate locations gradually
|
|
|
|
**Reasoning:**
|
|
- ✅ No disruption to current operations
|
|
- ✅ Test web thoroughly before full rollout
|
|
- ✅ Keep Android as fallback
|
|
- ✅ Evaluate real-world performance
|
|
- ✅ Easy to roll back if issues arise
|
|
|
|
---
|
|
|
|
## 📞 Quick Reference
|
|
|
|
**Need detailed implementation?**
|
|
→ See [WEB_MIGRATION_GUIDE.md](WEB_MIGRATION_GUIDE.md)
|
|
|
|
**Need step-by-step checklist?**
|
|
→ See [WEB_MIGRATION_CHECKLIST.md](WEB_MIGRATION_CHECKLIST.md)
|
|
|
|
**Need project architecture?**
|
|
→ See [PROJECT_CONTEXT.md](PROJECT_CONTEXT.md)
|
|
|
|
**Need recent changes info?**
|
|
→ See [QUICK_SUMMARY.md](QUICK_SUMMARY.md)
|
|
|
|
---
|
|
|
|
**Last Updated:** July 30, 2026
|
|
**Status:** Migration not started (planning phase)
|
|
|
|
|