@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.6 → 0.2.8

package/dist/utils/lazy-loading.js

@@ -0,0 +1,415 @@
+import React from 'react';
+
+// Lazy loading utilities for code splitting and dynamic imports
+export interface LazyLoadConfig {
+  enabled;
+  preloadThreshold;
+  cacheSize;
+  retryAttempts;
+  retryDelay;
+  loadingTimeout;
+}
+
+export interface LazyLoadResult<T> {
+  data;
+  loading;
+  error;
+  retry) => Promise<LazyLoadResult<T>>;
+}
+
+export interface LazyLoadStats {
+  totalRequests;
+  successfulLoads;
+  failedLoads;
+  cacheHits;
+  averageLoadTime;
+  totalLoadTime;
+}
+
+export class LazyLoader {
+  private config;
+  private cache, { data; timestamp; ttl}>;
+  private loadingStates, boolean>;
+  private errorStates, Error>;
+  private stats;
+  private preloadQueue;
+  private retryCounts, number>;
+
+  constructor(config= {
+    enabled,
+    preloadThreshold,
+    cacheSize,
+    retryAttempts,
+    retryDelay,
+    loadingTimeout}) {
+    this.config = config;
+    this.cache = new Map();
+    this.loadingStates = new Map();
+    this.errorStates = new Map();
+    this.stats = {
+      totalRequests,
+      successfulLoads,
+      failedLoads,
+      cacheHits,
+      averageLoadTime,
+      totalLoadTime};
+    this.preloadQueue = new Set();
+    this.retryCounts = new Map();
+  }
+
+  // Lazy load a module with dynamic import
+  async lazyLoad<T>(
+    modulePath,
+    importFn) => Promise<T>,
+    options;
+      ttl?;
+      preload?;
+    } = {}
+  )= options.cacheKey || modulePath;
+    const ttl = options.ttl || 300000; // 5 minutes default
+
+    // Check cache first
+    if (this.config.enabled && this.cache.has(cacheKey)) {
+      const cached = this.cache.get(cacheKey)!;
+      if (Date.now() - cached.timestamp < cached.ttl) {
+        this.stats.cacheHits++;
+        this.stats.totalRequests++; // Count cache hits as requests too
+        return {
+          data,
+          loading,
+          error,
+          retry) => {
+            // Clear error state before retrying
+            this.errorStates.delete(cacheKey);
+            this.retryCounts.delete(cacheKey);
+            return this.lazyLoad(modulePath, importFn, options);
+          }
+        };
+      } else {
+        // Remove expired cache entry
+        this.cache.delete(cacheKey);
+      }
+    }
+
+    // Check if already loading
+    if (this.loadingStates.get(cacheKey)) {
+      return {
+        data,
+        loading,
+        error,
+        retry) => this.lazyLoad(modulePath, importFn, options)
+      };
+    }
+
+    // Check for previous errors
+    const previousError = this.errorStates.get(cacheKey);
+    if (previousError) {
+      return {
+        data,
+        loading,
+        error,
+        retry) => this.lazyLoad(modulePath, importFn, options)
+      };
+    }
+
+    // Start loading
+    this.loadingStates.set(cacheKey, true);
+    this.stats.totalRequests++;
+
+    const startTime = Date.now();
+
+    try {
+      const data = await Promise.race([
+        importFn(),
+        this.createTimeout(this.config.loadingTimeout)
+      ]);
+
+      // Success
+      this.loadingStates.delete(cacheKey);
+      this.errorStates.delete(cacheKey);
+      this.stats.successfulLoads++;
+
+      // Cache the result
+      if (this.config.enabled) {
+        this.cacheResult(cacheKey, data, ttl);
+      }
+
+      // Update stats
+      const loadTime = Date.now() - startTime;
+      this.updateLoadTimeStats(loadTime);
+
+      // Preload related modules if enabled
+      if (options.preload && this.config.enabled) {
+        this.queuePreload(modulePath);
+      }
+
+      return {
+        data,
+        loading,
+        error,
+        retry) => this.lazyLoad(modulePath, importFn, options)
+      };
+
+    } catch (error) {
+      // Handle error
+      this.loadingStates.delete(cacheKey);
+      this.stats.failedLoads++;
+
+      const loadTime = Date.now() - startTime;
+      this.updateLoadTimeStats(loadTime);
+
+      const retryCount = this.retryCounts.get(cacheKey) || 0;
+      if (retryCount < this.config.retryAttempts) {
+        this.retryCounts.set(cacheKey, retryCount + 1);
+        
+        // Auto-retry after delay
+        setTimeout(() => {
+          this.retryCounts.delete(cacheKey);
+        }, this.config.retryDelay);
+      }
+
+      const errorObj = error instanceof Error ? error ));
+      this.errorStates.set(cacheKey, errorObj);
+
+      return {
+        data,
+        loading,
+        error,
+        retry) => {
+          // Clear error state before retrying
+          this.errorStates.delete(cacheKey);
+          this.retryCounts.delete(cacheKey);
+          return this.lazyLoad(modulePath, importFn, options);
+        }
+      };
+    }
+  }
+
+  // Preload a module without waiting for the result
+  preload<T>(modulePath, importFn) => Promise<T>)) return;
+
+    // Limit preload queue size
+    if (this.preloadQueue.size >= 10) {
+      const oldestKey = this.preloadQueue.values().next().value;
+      if (oldestKey) {
+        this.preloadQueue.delete(oldestKey);
+      }
+    }
+
+    this.preloadQueue.add(modulePath);
+    
+    // Use requestIdleCallback if available, otherwise setTimeout
+    if ('requestIdleCallback' in window) {
+      (window as any).requestIdleCallback(() => {
+        this.executePreload(modulePath, importFn);
+      });
+    } else {
+      setTimeout(() => {
+        this.executePreload(modulePath, importFn);
+      }, 100);
+    }
+  }
+
+  // Execute preload
+  private async executePreload<T>(modulePath, importFn) => Promise<T>), importFn, { cacheKey, ttl}); // 10 minutes for preloaded modules
+    } catch (error) {
+      // Silently fail preloads
+      console.debug(`Preload failed for ${modulePath}, error);
+    } finally {
+      this.preloadQueue.delete(modulePath);
+    }
+  }
+
+  // Queue preload for later execution
+  private queuePreload(modulePath)) { // Limit preload queue
+      this.preloadQueue.add(modulePath);
+    }
+  }
+
+
+
+  // Cache a result
+  private cacheResult(key, data, ttl)= this.config.cacheSize) {
+      const oldestKey = this.cache.keys().next().value;
+      if (oldestKey) {
+        this.cache.delete(oldestKey);
+      }
+    }
+
+    this.cache.set(key, {
+      data,
+      timestamp),
+      ttl
+    });
+  }
+
+  // Create a timeout promise
+  private createTimeout(ms), reject) => {
+      setTimeout(() => reject(new Error(`Loading timeout after ${ms}ms`)), ms);
+    });
+  }
+
+  // Update load time statistics
+  private updateLoadTimeStats(loadTime)= loadTime;
+    this.stats.averageLoadTime = this.stats.totalLoadTime / this.stats.totalRequests;
+  }
+
+  // Get loading state for a module
+  isLoading(modulePath));
+  }
+
+  // Get error state for a module
+  getError(modulePath)) || null;
+  }
+
+  // Clear cache for a specific module
+  clearCache(modulePath));
+    this.errorStates.delete(modulePath);
+    this.retryCounts.delete(modulePath);
+  }
+
+  // Clear all cache
+  clearAllCache());
+    this.errorStates.clear();
+    this.retryCounts.clear();
+  }
+
+  // Get cache statistics
+  getCacheStats();
+    maxSize;
+    hitRate;
+  } {
+    const hitRate = this.stats.totalRequests > 0 
+      ? (this.stats.cacheHits / this.stats.totalRequests) * 100 
+      ;
+
+    return {
+      size,
+      maxSize,
+      hitRate
+    };
+  }
+
+  // Get performance statistics
+  getStats()};
+  }
+
+  // Reset all statistics
+  resetStats()= {
+      totalRequests,
+      successfulLoads,
+      failedLoads,
+      cacheHits,
+      averageLoadTime,
+      totalLoadTime};
+  }
+
+  // Check if preload is in progress
+  isPreloading(modulePath));
+  }
+
+  // Get preload queue status
+  getPreloadQueue()] {
+    return Array.from(this.preloadQueue);
+  }
+
+  // Update configuration
+  updateConfig(newConfig)= { ...this.config, ...newConfig };
+    
+    // Adjust cache size if needed
+    if (newConfig.cacheSize && newConfig.cacheSize < this.cache.size) {
+      const entries = Array.from(this.cache.entries());
+      entries.sort((a, b) => a[1].timestamp - b[1].timestamp);
+      
+      // Remove oldest entries
+      const toRemove = entries.slice(0, this.cache.size - newConfig.cacheSize);
+      toRemove.forEach(([key]) => this.cache.delete(key));
+    }
+  }
+
+  // Export lazy loading analysis
+  exportAnalysis()= this.getCacheStats();
+    const stats = this.getStats();
+    const preloadQueue = this.getPreloadQueue();
+
+    return JSON.stringify({
+      config,
+      cacheStats,
+      performanceStats,
+      preloadQueue,
+      timestamp).toISOString()
+    }, null, 2);
+  }
+}
+
+// Create and export default instance
+export const lazyLoader = new LazyLoader();
+
+// Utility function for React lazy loading
+export function createLazyComponent<T>(
+  importFn) => Promise<{ default}>
+));
+}
+
+// Utility function for conditional lazy loading
+export function conditionalLazyLoad<T>(
+  condition,
+  importFn) => Promise<T>,
+  fallback)) {
+    return importFn();
+  }
+  return Promise.resolve(fallback);
+}
+
+// Utility function for batch lazy loading
+export function batchLazyLoad<T>(
+  modules; importFn) => Promise<T> }>,
+  options; maxConcurrent?} = {}
+)]> {
+  const { parallel = true, maxConcurrent = 3 } = options;
+
+  if (!parallel) {
+    // Sequential loading
+    return modules.reduce(async (promise, module) => {
+      const results = await promise;
+      const result = await module.importFn();
+      return [...results, result];
+    }, Promise.resolve([] as T[]));
+  }
+
+  // Parallel loading with concurrency limit
+  const results] = [];
+  const queue = [...modules];
+  const active] = [];
+
+  return new Promise((resolve, reject) => {
+    function processQueue() {
+      if (queue.length === 0 && active.length === 0) {
+        resolve(results);
+        return;
+      }
+
+      while (active.length < maxConcurrent && queue.length > 0) {
+        const module = queue.shift()!;
+        const index = modules.indexOf(module);
+        
+        const promise = module.importFn()
+          .then(result => {
+            results[index] = result;
+          })
+          .catch(reject)
+          .finally(() => {
+            const activeIndex = active.indexOf(promise);
+            if (activeIndex > -1) {
+              active.splice(activeIndex, 1);
+            }
+            processQueue();
+          });
+
+        active.push(promise);
+      }
+    }
+
+    processQueue();
+  });
+}