This document describes the new caching system implemented for the businesses API to reduce the number of API calls and improve performance.
- Old:
/business- Fetched all businesses every time - New:
/business/modified-after- Fetches only businesses modified after a specific timestamp
- Added:
createdAtfield (ISO8601 timestamp) for business creation date - Added:
updatedAtfield (ISO8601 timestamp) for business modification date - Used for: Tracking when businesses were last modified for caching purposes
The new system implements a timestamp-based caching strategy:
-
First Time:
- Hits
/business/modified-afterwith the oldest possible timestamp (1970-01-01T00:00:00.000Z) - Stores encrypted business data locally
- Extracts the maximum
updatedAtdate from businesses and stores that timestamp locally
- Hits
-
Subsequent Calls:
- Uses the locally stored timestamp to fetch only new/modified businesses from
/business/modified-after - Merges new data with cached data
- Updates the timestamp to the latest
updatedAtdate from new businesses - Filters out deleted businesses (
isDeleted: true)
- Uses the locally stored timestamp to fetch only new/modified businesses from
cached_businesses: Encrypted business datalast_modified_timestamp: ISO8601 timestamp of last modification
- Business data is stored encrypted in localStorage using the same encryption key
- Only timestamps are stored in plain text (safe for localStorage)
- Raw encrypted data from API is stored without decryption
- Main function that implements the caching logic
- Automatically handles cache management
- Returns cached data if no new businesses exist
- Clears all cached business data
- Resets timestamp to oldest possible date
- Useful for testing or complete reset
- Added to BusinessList component (both desktop and mobile)
- Shows loading state with spinning animation
- Disabled during API calls
BusinessesContextnow includesforceRefreshBusinessesfunction- Maintains backward compatibility with existing components
- Reduced API Calls: Only fetches new/modified data
- Better Performance: Faster loading for returning users
- Offline Support: Works with cached data when API is unavailable
- Data Consistency: Automatically handles updates and deletions
- User Control: Manual refresh option available
// This automatically uses caching
const { businesses } = useBusinesses();import { clearBusinessesCache } from '../services/BusinessApi';
// Force refresh when needed
clearBusinessesCache();- If API fails, returns cached data if available
- Graceful fallback to cached data
- Console logging for debugging
- User-friendly error states maintained
- All business data remains encrypted in localStorage
- Only timestamps are stored in plain text
- Uses existing encryption keys and methods
- No sensitive data exposure
The caching system can be tested by:
- Loading the page (first API call)
- Refreshing the page (should use cache)
- Using the refresh button (force refresh)
- Checking localStorage for cached data
- Monitoring network requests in DevTools
- Cache expiration based on time
- Background sync for updates
- Cache size management
- Offline-first capabilities
- Use Case: Normal application usage
- Behavior: Only fetches businesses modified since last known timestamp
- Efficiency: Minimal API calls, fastest loading
- Use Case: User wants to check for new data
- Behavior: Uses existing timestamp to fetch only new/modified businesses
- Efficiency: Minimal API calls, ensures data is up-to-date
- Starting Point: Current cached timestamp (most efficient)
- Use Case: Testing, complete reset, or troubleshooting
- Behavior: Clears all cache and resets to 1970 (oldest possible)
- Efficiency: Maximum API calls, complete data refresh
- Starting Point: 1970-01-01T00:00:00.000Z (earliest possible date)