IndexedDB-based Local Caching for Performance Enhancement

[neozhu]

Description

This PR implements an IndexedDB-based caching mechanism to improve the performance of the application by reducing unnecessary backend requests. The caching mechanism includes:

1. Expiration Feature: Added an expiration parameter in window.indexedDbStorage to enable automatic cleanup of expired cached data.
2. New Method in IndexedDbCache.cs: Introduced public async Task<T> GetOrSetAsync<T>(string dbName, string key, Func<Task<T>> factory, string[]? tags = null, TimeSpan? expiration = null) to facilitate caching logic. This method:
   • First attempts to retrieve data from IndexedDB.
   • Falls back to the server backend if the data is missing or expired.
   • Updates the cache in IndexedDB after fetching from the backend.

Changes

Code Highlights

1. IndexedDbCache.cs

   • Added GetOrSetAsync method for retrieving or setting cached data with expiration.
   • Example usage:

     var result = await IndexedDbCache.GetOrSetAsync(
         "MyDatabase",
         "MyKey",
         async () => await FetchDataFromBackend(),
         expiration: TimeSpan.FromMinutes(30)
     );

2. window.indexedDbStorage

   • Enhanced to support the expiration parameter.
   • Automatically removes expired items during retrieval operations.

Benefits

• Performance: Reduces server load and network latency by serving data locally.
• Flexibility: Supports configurable expiration times for cached items.
• Offline Mode Preparation: Sets a foundation for implementing offline mode in future updates.

Example

// Example usage in JavaScript
const storage = window.indexedDbStorage;
storage.setItem('test-key', { value: 'test-data' }, { expiration: 60000 }); // Expire in 60 seconds
const data = await storage.getItem('test-key');
if (!data) {
    // Fetch from server if not available or expired
    const serverData = await fetch('/api/data');
    storage.setItem('test-key', serverData, { expiration: 60000 });
}

// Example usage in C#
// This example demonstrates using the Query method to retrieve tenant data with caching.
// If the data exists and has not expired, it is retrieved from IndexedDB.
// Otherwise, the data is fetched from the server backend and updated in the cache.

Tenants = await ApiClientServiceProxy.QueryAsyncAsync(
    "multitenant",                     // Name of the IndexedDB database
    () => ApiClient.Tenants.GetAsync(), // Factory function to fetch data from the backend
    tags: null,                         // Optional tags for grouping cache items
    expiration: TimeSpan.FromMinutes(60) // Cache expiration time
);