// Performance monitoring setup
import { Systrace } from 'react-native';

export const performanceMonitor = {
  startTrace: (name) => {
    if (__DEV__) {
      Systrace.beginEvent(name);
    }
  },
  
  endTrace: () => {
    if (__DEV__) {
      Systrace.endEvent();
    }
  },
  
  measureAsync: async (name, fn) => {
    const start = performance.now();
    performanceMonitor.startTrace(name);
    
    try {
      const result = await fn();
      return result;
    } finally {
      const end = performance.now();
      performanceMonitor.endTrace();
      
      if (__DEV__) {
        console.log(`${name} took ${end - start}ms`);
      }
    }
  }
};

// Memory leak detector for development
export class MemoryLeakDetector {
  constructor() {
    this.componentCounts = new Map();
    this.listeners = new Set();
    this.timers = new Set();
  }

  trackComponent(componentName) {
    const count = this.componentCounts.get(componentName) || 0;
    this.componentCounts.set(componentName, count + 1);
    
    return () => {
      const newCount = this.componentCounts.get(componentName) - 1;
      this.componentCounts.set(componentName, Math.max(0, newCount));
    };
  }

  trackListener(listener, cleanup) {
    this.listeners.add({ listener, cleanup });
    
    return () => {
      const item = Array.from(this.listeners).find(l => l.listener === listener);
      if (item) {
        item.cleanup();
        this.listeners.delete(item);
      }
    };
  }

  trackTimer(timerId) {
    this.timers.add(timerId);
    
    return () => {
      clearTimeout(timerId);
      clearInterval(timerId);
      this.timers.delete(timerId);
    };
  }

  getReport() {
    return {
      activeComponents: Object.fromEntries(this.componentCounts),
      activeListeners: this.listeners.size,
      activeTimers: this.timers.size,
    };
  }

  cleanup() {
    // Clean up all tracked resources
    this.listeners.forEach(({ cleanup }) => cleanup());
    this.timers.forEach(timerId => {
      clearTimeout(timerId);
      clearInterval(timerId);
    });
    
    this.listeners.clear();
    this.timers.clear();
    this.componentCounts.clear();
  }
}

// Usage in components
export const useMemoryTracking = (componentName) => {
  const detectorRef = useRef(global.memoryLeakDetector);
  
  useEffect(() => {
    const detector = detectorRef.current;
    if (!detector) return;
    
    const untrack = detector.trackComponent(componentName);
    
    return () => {
      untrack();
    };
  }, [componentName]);
  
  const trackListener = useCallback((listener, cleanup) => {
    return detectorRef.current?.trackListener(listener, cleanup);
  }, []);
  
  const trackTimer = useCallback((timerId) => {
    return detectorRef.current?.trackTimer(timerId);
  }, []);
  
  return { trackListener, trackTimer };
};

// Advanced image caching and optimization
import FastImage from 'react-native-fast-image';
import { Dimensions } from 'react-native';

const { width: screenWidth } = Dimensions.get('window');

export class ImageOptimizer {
  static cache = new Map();
  static maxCacheSize = 100;
  static preloadQueue = [];
  static isPreloading = false;

  static getOptimalSize(originalWidth, originalHeight, containerWidth, containerHeight) {
    const screenScale = Dimensions.get('window').scale;
    const maxWidth = Math.min(containerWidth * screenScale, screenWidth * screenScale);
    const maxHeight = Math.min(containerHeight * screenScale, 1000);

    const aspectRatio = originalWidth / originalHeight;
    
    let width = maxWidth;
    let height = width / aspectRatio;
    
    if (height > maxHeight) {
      height = maxHeight;
      width = height * aspectRatio;
    }
    
    return {
      width: Math.round(width),
      height: Math.round(height),
    };
  }

  static generateOptimizedUrl(baseUrl, width, height, quality = 80) {
    // Assuming you have an image CDN that supports dynamic resizing
    const params = new URLSearchParams({
      w: width.toString(),
      h: height.toString(),
      q: quality.toString(),
      f: 'webp', // Prefer WebP format
    });
    
    return `${baseUrl}?${params.toString()}`;
  }

  static preloadImages(urls, priority = 'normal') {
    const images = urls.map(url => ({ uri: url, priority }));
    
    if (priority === 'high') {
      // Add to front of queue
      this.preloadQueue.unshift(...images);
    } else {
      // Add to end of queue
      this.preloadQueue.push(...images);
    }
    
    this.processPreloadQueue();
  }

  static async processPreloadQueue() {
    if (this.isPreloading || this.preloadQueue.length === 0) return;
    
    this.isPreloading = true;
    
    try {
      // Process 5 images at a time
      const batch = this.preloadQueue.splice(0, 5);
      
      await Promise.all(
        batch.map(image => 
          FastImage.preload([{ uri: image.uri }])
            .catch(error => console.warn('Image preload failed:', error))
        )
      );
      
      // Continue processing if more images in queue
      setTimeout(() => {
        this.isPreloading = false;
        this.processPreloadQueue();
      }, 100);
    } catch (error) {
      console.error('Batch preload failed:', error);
      this.isPreloading = false;
    }
  }

  static clearCache() {
    FastImage.clearMemoryCache();
    FastImage.clearDiskCache();
    this.cache.clear();
  }
}

// Optimized image component
export const OptimizedImage = memo(({
  source,
  width,
  height,
  style,
  resizeMode = 'cover',
  quality = 80,
  placeholder,
  ...props
}) => {
  const [imageSize, setImageSize] = useState({ width, height });
  const [isLoading, setIsLoading] = useState(true);
  const [hasError, setHasError] = useState(false);

  const optimizedSource = useMemo(() => {
    if (typeof source === 'string') {
      const optimalSize = ImageOptimizer.getOptimalSize(
        width || 300,
        height || 300,
        width || 300,
        height || 300
      );
      
      return {
        uri: ImageOptimizer.generateOptimizedUrl(
          source,
          optimalSize.width,
          optimalSize.height,
          quality
        ),
        priority: FastImage.priority.normal,
        cache: FastImage.cacheControl.immutable,
      };
    }
    return source;
  }, [source, width, height, quality]);

  const handleLoad = useCallback((event) => {
    setIsLoading(false);
    setHasError(false);
    
    if (event?.nativeEvent) {
      setImageSize({
        width: event.nativeEvent.width,
        height: event.nativeEvent.height,
      });
    }
  }, []);

  const handleError = useCallback(() => {
    setIsLoading(false);
    setHasError(true);
  }, []);

  if (hasError) {
    return placeholder || <View style={[style, { backgroundColor: '#f0f0f0' }]} />;
  }

  return (
    <FastImage
      source={optimizedSource}
      style={[style, { width, height }]}
      resizeMode={resizeMode}
      onLoad={handleLoad}
      onError={handleError}
      {...props}
    />
  );
});

// High-performance list component
export const OptimizedFlatList = memo(({
  data,
  renderItem,
  estimatedItemSize = 60,
  numColumns = 1,
  ...props
}) => {
  const [dimensions, setDimensions] = useState(Dimensions.get('window'));
  const viewabilityConfig = useRef({
    itemVisiblePercentThreshold: 10,
    minimumViewTime: 100,
  });

  const getItemLayout = useCallback(
    (data, index) => ({
      length: estimatedItemSize,
      offset: estimatedItemSize * index,
      index,
    }),
    [estimatedItemSize]
  );

  const keyExtractor = useCallback(
    (item, index) => item.id?.toString() || index.toString(),
    []
  );

  const onViewableItemsChanged = useCallback(({ viewableItems, changed }) => {
    // Handle viewability changes for analytics or lazy loading
    if (__DEV__) {
      console.log(`${viewableItems.length} items visible`);
    }
  }, []);

  const renderOptimizedItem = useCallback(
    ({ item, index }) => (
      <MemoizedListItem 
        item={item} 
        index={index} 
        renderItem={renderItem}
      />
    ),
    [renderItem]
  );

  useEffect(() => {
    const subscription = Dimensions.addEventListener('change', ({ window }) => {
      setDimensions(window);
    });
    
    return () => subscription?.remove();
  }, []);

  return (
    <FlatList
      data={data}
      renderItem={renderOptimizedItem}
      keyExtractor={keyExtractor}
      getItemLayout={getItemLayout}
      onViewableItemsChanged={onViewableItemsChanged}
      viewabilityConfig={viewabilityConfig.current}
      removeClippedSubviews={true}
      maxToRenderPerBatch={10}
      updateCellsBatchingPeriod={50}
      initialNumToRender={8}
      windowSize={10}
      scrollEventThrottle={16}
      {...props}
    />
  );
});

// Memoized list item to prevent unnecessary re-renders
const MemoizedListItem = memo(({ item, index, renderItem }) => {
  return renderItem({ item, index });
}, (prevProps, nextProps) => {
  // Custom comparison for optimal re-rendering
  return (
    prevProps.item.id === nextProps.item.id &&
    prevProps.index === nextProps.index &&
    JSON.stringify(prevProps.item) === JSON.stringify(nextProps.item)
  );
});

// Custom virtualized list for extremely large datasets
export const VirtualizedList = ({
  data,
  itemHeight,
  containerHeight,
  renderItem,
  overscan = 5,
}) => {
  const [scrollOffset, setScrollOffset] = useState(0);
  const scrollViewRef = useRef(null);

  const totalHeight = data.length * itemHeight;
  const visibleCount = Math.ceil(containerHeight / itemHeight);
  
  const startIndex = Math.max(
    0,
    Math.floor(scrollOffset / itemHeight) - overscan
  );
  
  const endIndex = Math.min(
    data.length - 1,
    startIndex + visibleCount + 2 * overscan
  );

  const visibleItems = data.slice(startIndex, endIndex + 1);
  const offsetY = startIndex * itemHeight;

  const handleScroll = useCallback((event) => {
    const newScrollOffset = event.nativeEvent.contentOffset.y;
    setScrollOffset(newScrollOffset);
  }, []);

  return (
    <ScrollView
      ref={scrollViewRef}
      style={{ height: containerHeight }}
      onScroll={handleScroll}
      scrollEventThrottle={16}
    >
      <View style={{ height: totalHeight }}>
        <View style={{ transform: [{ translateY: offsetY }] }}>
          {visibleItems.map((item, index) => (
            <View
              key={startIndex + index}
              style={{ height: itemHeight }}
            >
              {renderItem({ item, index: startIndex + index })}
            </View>
          ))}
        </View>
      </View>
    </ScrollView>
  );
};

// Lazy loading screens for better startup performance
const LazyScreen = ({ component: Component, ...props }) => {
  const [isLoaded, setIsLoaded] = useState(false);
  const [ComponentToRender, setComponentToRender] = useState(null);

  useEffect(() => {
    let isMounted = true;
    
    const loadComponent = async () => {
      try {
        const module = await Component();
        if (isMounted) {
          setComponentToRender(() => module.default || module);
          setIsLoaded(true);
        }
      } catch (error) {
        console.error('Failed to load component:', error);
      }
    };

    loadComponent();
    
    return () => {
      isMounted = false;
    };
  }, [Component]);

  if (!isLoaded || !ComponentToRender) {
    return <LoadingScreen />;
  }

  return <ComponentToRender {...props} />;
};

// Navigation configuration with lazy loading
const Stack = createNativeStackNavigator();

export const AppNavigator = () => {
  return (
    <NavigationContainer>
      <Stack.Navigator
        initialRouteName="Home"
        screenOptions={{
          headerShown: false,
          gestureEnabled: true,
          animation: 'slide_from_right',
        }}
      >
        <Stack.Screen name="Home" component={HomeScreen} />
        
        <Stack.Screen 
          name="Profile"
          children={(props) => (
            <LazyScreen 
              component={() => import('../screens/ProfileScreen')}
              {...props}
            />
          )}
        />
        
        <Stack.Screen 
          name="Settings"
          children={(props) => (
            <LazyScreen 
              component={() => import('../screens/SettingsScreen')}
              {...props}
            />
          )}
        />
      </Stack.Navigator>
    </NavigationContainer>
  );
};

// Screen transition optimization
export const useOptimizedNavigation = () => {
  const navigation = useNavigation();
  
  const navigateWithPreload = useCallback(async (screenName, params) => {
    // Preload the screen component
    const preloadPromise = import(`../screens/${screenName}Screen`);
    
    // Navigate immediately
    navigation.navigate(screenName, params);
    
    // Ensure the component is loaded
    await preloadPromise;
  }, [navigation]);
  
  return { navigateWithPreload };
};

// Optimized Zustand store with performance monitoring
import { create } from 'zustand';
import { subscribeWithSelector } from 'zustand/middleware';

export const useOptimizedStore = create(
  subscribeWithSelector((set, get) => ({
    // State
    items: [],
    filteredItems: [],
    isLoading: false,
    
    // Optimized actions
    setItems: (items) => {
      const start = performance.now();
      
      set((state) => {
        const newState = { ...state, items };
        // Update filtered items if needed
        if (state.filter) {
          newState.filteredItems = items.filter(state.filter);
        }
        return newState;
      });
      
      if (__DEV__) {
        console.log(`setItems took ${performance.now() - start}ms`);
      }
    },
    
    // Batched updates
    batchUpdate: (updates) => {
      set((state) => ({ ...state, ...updates }));
    },
    
    // Computed values with caching
    getItemsByCategory: (category) => {
      const state = get();
      const cacheKey = `category_${category}`;
      
      if (!state.cache) {
        state.cache = new Map();
      }
      
      if (state.cache.has(cacheKey)) {
        return state.cache.get(cacheKey);
      }
      
      const filtered = state.items.filter(item => item.category === category);
      state.cache.set(cacheKey, filtered);
      
      return filtered;
    },
  }))
);

// Selective subscriptions to prevent unnecessary re-renders
export const useItemsOnly = () => useOptimizedStore(state => state.items);
export const useLoadingOnly = () => useOptimizedStore(state => state.isLoading);

// Hook for computed values
export const useItemsByCategory = (category) => {
  return useOptimizedStore(
    useCallback(
      (state) => state.getItemsByCategory(category),
      [category]
    )
  );
};

// Advanced memoization patterns
export const OptimizedComponent = memo(({ data, onPress, style }) => {
  // Memoize expensive calculations
  const processedData = useMemo(() => {
    return data.map(item => ({
      ...item,
      formattedPrice: formatCurrency(item.price),
      isDiscounted: item.originalPrice > item.price,
    }));
  }, [data]);

  // Memoize event handlers
  const handlePress = useCallback((itemId) => {
    onPress?.(itemId);
  }, [onPress]);

  // Memoize complex styles
  const computedStyle = useMemo(() => {
    return [
      style,
      {
        backgroundColor: processedData.length > 10 ? '#f0f0f0' : '#ffffff',
      }
    ];
  }, [style, processedData.length]);

  return (
    <View style={computedStyle}>
      {processedData.map(item => (
        <OptimizedListItem
          key={item.id}
          item={item}
          onPress={handlePress}
        />
      ))}
    </View>
  );
}, (prevProps, nextProps) => {
  // Custom comparison function
  return (
    prevProps.data === nextProps.data &&
    prevProps.onPress === nextProps.onPress &&
    JSON.stringify(prevProps.style) === JSON.stringify(nextProps.style)
  );
});

// React.memo with shallow comparison for simple props
export const SimpleOptimizedComponent = memo(({ title, count, isVisible }) => {
  return (
    <View>
      <Text>{title}</Text>
      <Text>{count}</Text>
      {isVisible && <SomeExpensiveComponent />}
    </View>
  );
});

// Using React.memo with areEqual for complex comparisons
export const ComplexOptimizedComponent = memo(({ complexData }) => {
  return (
    <View>
      {/* Component implementation */}
    </View>
  );
}, (prevProps, nextProps) => {
  // Only re-render if specific nested properties change
  return (
    prevProps.complexData.id === nextProps.complexData.id &&
    prevProps.complexData.timestamp === nextProps.complexData.timestamp
  );
});

// High-performance animations
import Animated, {
  useSharedValue,
  useAnimatedStyle,
  withSpring,
  withTiming,
  runOnJS,
  useAnimatedGestureHandler,
} from 'react-native-reanimated';
import { PanGestureHandler } from 'react-native-gesture-handler';

export const OptimizedAnimatedComponent = ({ children, onSwipeComplete }) => {
  const translateX = useSharedValue(0);
  const opacity = useSharedValue(1);
  const scale = useSharedValue(1);

  // Memoized animated styles
  const animatedStyle = useAnimatedStyle(() => ({
    transform: [
      { translateX: translateX.value },
      { scale: scale.value }
    ],
    opacity: opacity.value,
  }), []);

  // Optimized gesture handler
  const gestureHandler = useAnimatedGestureHandler({
    onStart: (_, context) => {
      context.startX = translateX.value;
      scale.value = withSpring(0.95);
    },
    
    onActive: (event, context) => {
      translateX.value = context.startX + event.translationX;
      opacity.value = Math.max(0.3, 1 - Math.abs(event.translationX) / 300);
    },
    
    onEnd: (event) => {
      const shouldComplete = Math.abs(event.translationX) > 100;
      
      if (shouldComplete) {
        translateX.value = withTiming(
          event.translationX > 0 ? 300 : -300,
          { duration: 200 },
          () => {
            runOnJS(onSwipeComplete)();
          }
        );
        opacity.value = withTiming(0, { duration: 200 });
      } else {
        translateX.value = withSpring(0);
        opacity.value = withSpring(1);
      }
      
      scale.value = withSpring(1);
    },
  });

  return (
    <PanGestureHandler onGestureEvent={gestureHandler}>
      <Animated.View style={animatedStyle}>
        {children}
      </Animated.View>
    </PanGestureHandler>
  );
};

// Batch animation updates for better performance
export const useBatchedAnimations = () => {
  const animations = useRef([]);
  const animationFrame = useRef(null);

  const addAnimation = useCallback((animationFn) => {
    animations.current.push(animationFn);
    
    if (!animationFrame.current) {
      animationFrame.current = requestAnimationFrame(() => {
        animations.current.forEach(fn => fn());
        animations.current = [];
        animationFrame.current = null;
      });
    }
  }, []);

  useEffect(() => {
    return () => {
      if (animationFrame.current) {
        cancelAnimationFrame(animationFrame.current);
      }
    };
  }, []);

  return { addAnimation };
};

// Network request batching and caching
export class NetworkOptimizer {
  constructor() {
    this.requestQueue = new Map();
    this.cache = new Map();
    this.batchTimeout = null;
    this.maxBatchSize = 10;
  }

  async request(url, options = {}) {
    const cacheKey = this.getCacheKey(url, options);
    
    // Return cached result if available and not expired
    if (this.cache.has(cacheKey)) {
      const cached = this.cache.get(cacheKey);
      if (Date.now() < cached.expiry) {
        return cached.data;
      }
      this.cache.delete(cacheKey);
    }

    // Check if request is already in queue
    if (this.requestQueue.has(cacheKey)) {
      return this.requestQueue.get(cacheKey);
    }

    // Create new request promise
    const requestPromise = this.executeRequest(url, options);
    this.requestQueue.set(cacheKey, requestPromise);

    try {
      const result = await requestPromise;
      
      // Cache successful results
      this.cache.set(cacheKey, {
        data: result,
        expiry: Date.now() + (options.cacheTime || 300000), // 5 minutes default
      });
      
      return result;
    } finally {
      this.requestQueue.delete(cacheKey);
    }
  }

  async batchRequest(requests) {
    return new Promise((resolve) => {
      const batchId = Date.now();
      const pendingRequests = [...requests];
      
      const processBatch = async () => {
        const batch = pendingRequests.splice(0, this.maxBatchSize);
        
        try {
          const results = await Promise.allSettled(
            batch.map(req => this.request(req.url, req.options))
          );
          
          if (pendingRequests.length > 0) {
            // Continue processing remaining requests
            setTimeout(processBatch, 10);
          } else {
            resolve(results);
          }
        } catch (error) {
          console.error('Batch request failed:', error);
          resolve([]);
        }
      };
      
      processBatch();
    });
  }

  getCacheKey(url, options) {
    return `${url}_${JSON.stringify(options)}`;
  }

  async executeRequest(url, options) {
    const controller = new AbortController();
    const timeoutId = setTimeout(() => controller.abort(), options.timeout || 10000);

    try {
      const response = await fetch(url, {
        ...options,
        signal: controller.signal,
      });

      if (!response.ok) {
        throw new Error(`HTTP ${response.status}: ${response.statusText}`);
      }

      return await response.json();
    } finally {
      clearTimeout(timeoutId);
    }
  }

  clearCache() {
    this.cache.clear();
  }

  getCacheStats() {
    return {
      size: this.cache.size,
      entries: Array.from(this.cache.keys()),
    };
  }
}

export const networkOptimizer = new NetworkOptimizer();

// Production performance monitoring
export class PerformanceTracker {
  constructor() {
    this.metrics = new Map();
    this.thresholds = {
      renderTime: 16, // 60fps = 16ms per frame
      memoryUsage: 150 * 1024 * 1024, // 150MB
      startupTime: 3000, // 3 seconds
    };
  }

  startMeasurement(name) {
    this.metrics.set(name, {
      startTime: performance.now(),
      startMemory: this.getMemoryUsage(),
    });
  }

  endMeasurement(name) {
    const measurement = this.metrics.get(name);
    if (!measurement) return;

    const endTime = performance.now();
    const endMemory = this.getMemoryUsage();
    
    const result = {
      name,
      duration: endTime - measurement.startTime,
      memoryDelta: endMemory - measurement.startMemory,
      timestamp: Date.now(),
    };

    this.metrics.delete(name);
    this.reportMetric(result);
    
    return result;
  }

  measureComponent(WrappedComponent, componentName) {
    return class extends React.Component {
      componentDidMount() {
        this.tracker.endMeasurement(`${componentName}_mount`);
      }

      componentDidUpdate() {
        this.tracker.endMeasurement(`${componentName}_update`);
      }

      componentWillUnmount() {
        this.tracker.endMeasurement(`${componentName}_unmount`);
      }

      render() {
        this.tracker.startMeasurement(`${componentName}_render`);
        const result = <WrappedComponent {...this.props} />;
        this.tracker.endMeasurement(`${componentName}_render`);
        return result;
      }
    };
  }

  reportMetric(metric) {
    // Check thresholds
    const isSlowRender = metric.name.includes('render') && 
                        metric.duration > this.thresholds.renderTime;
    
    if (isSlowRender) {
      console.warn(`Slow render detected: ${metric.name} took ${metric.duration}ms`);
    }

    // Send to analytics in production
    if (!__DEV__) {
      this.sendToAnalytics(metric);
    }
  }

  sendToAnalytics(metric) {
    // Send to your analytics service
    try {
      // Example: Firebase Analytics
      // analytics().logEvent('performance_metric', metric);
      
      // Example: Custom analytics endpoint
      fetch('/api/metrics', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(metric),
      }).catch(err => console.warn('Failed to send metric:', err));
    } catch (error) {
      console.warn('Analytics error:', error);
    }
  }

  getMemoryUsage() {
    if (global.performance && global.performance.memory) {
      return global.performance.memory.usedJSHeapSize;
    }
    return 0;
  }

  generateReport() {
    return {
      activeMetrics: this.metrics.size,
      thresholds: this.thresholds,
      timestamp: Date.now(),
    };
  }
}

export const performanceTracker = new PerformanceTracker();

// Higher-order component for automatic performance tracking
export const withPerformanceTracking = (WrappedComponent, componentName) => {
  return memo((props) => {
    useEffect(() => {
      performanceTracker.startMeasurement(`${componentName}_mount`);
      return () => performanceTracker.endMeasurement(`${componentName}_unmount`);
    }, []);

    const TrackedComponent = useMemo(() => {
      performanceTracker.startMeasurement(`${componentName}_render`);
      const component = <WrappedComponent {...props} />;
      performanceTracker.endMeasurement(`${componentName}_render`);
      return component;
    }, [props]);

    return TrackedComponent;
  });
};

// Dynamic imports with error boundaries
export const DynamicImport = ({ 
  importFn, 
  fallback = <LoadingSpinner />, 
  errorFallback = <ErrorComponent /> 
}) => {
  const [Component, setComponent] = useState(null);
  const [error, setError] = useState(null);
  const [isLoading, setIsLoading] = useState(true);

  useEffect(() => {
    let isMounted = true;

    const loadComponent = async () => {
      try {
        const module = await importFn();
        if (isMounted) {
          setComponent(() => module.default || module);
          setIsLoading(false);
        }
      } catch (err) {
        if (isMounted) {
          setError(err);
          setIsLoading(false);
        }
      }
    };

    loadComponent();

    return () => {
      isMounted = false;
    };
  }, [importFn]);

  if (error) return errorFallback;
  if (isLoading) return fallback;
  if (!Component) return null;

  return <Component />;
};

// Bundle analyzer for development
export const BundleAnalyzer = {
  analyzeImports: () => {
    if (__DEV__) {
      const importedModules = Object.keys(require.cache);
      const moduleStats = importedModules.map(modulePath => ({
        path: modulePath,
        size: require.cache[modulePath]?.exports ? 
              JSON.stringify(require.cache[modulePath].exports).length : 0,
      }));

      console.table(
        moduleStats
          .sort((a, b) => b.size - a.size)
          .slice(0, 20)
      );
    }
  },

  trackDynamicImports: () => {
    const originalImport = global.__webpack_require__ || global.require;
    const importStats = new Map();

    global.require = function(...args) {
      const moduleName = args[0];
      const startTime = performance.now();
      
      const result = originalImport.apply(this, args);
      
      const endTime = performance.now();
      importStats.set(moduleName, {
        loadTime: endTime - startTime,
        timestamp: Date.now(),
      });

      return result;
    };

    return () => {
      console.log('Dynamic import stats:', importStats);
    };
  },
};

// Performance test suite
export class PerformanceTestSuite {
  constructor() {
    this.tests = [];
    this.results = [];
  }

  addTest(name, testFn, threshold) {
    this.tests.push({ name, testFn, threshold });
  }

  async runTests() {
    console.log('Running performance tests...');
    
    for (const test of this.tests) {
      const result = await this.runSingleTest(test);
      this.results.push(result);
    }

    return this.generateReport();
  }

  async runSingleTest({ name, testFn, threshold }) {
    const startTime = performance.now();
    const startMemory = this.getMemoryUsage();

    try {
      await testFn();
      
      const endTime = performance.now();
      const endMemory = this.getMemoryUsage();
      
      const duration = endTime - startTime;
      const memoryDelta = endMemory - startMemory;
      
      const passed = threshold ? duration <= threshold : true;
      
      return {
        name,
        duration,
        memoryDelta,
        threshold,
        passed,
        status: 'completed',
      };
    } catch (error) {
      return {
        name,
        error: error.message,
        status: 'failed',
        passed: false,
      };
    }
  }

  getMemoryUsage() {
    if (global.gc) {
      global.gc();
    }
    return process.memoryUsage ? process.memoryUsage().heapUsed : 0;
  }

  generateReport() {
    const passed = this.results.filter(r => r.passed).length;
    const failed = this.results.length - passed;
    
    return {
      summary: {
        total: this.results.length,
        passed,
        failed,
        passRate: (passed / this.results.length) * 100,
      },
      results: this.results,
      timestamp: Date.now(),
    };
  }
}

// Usage example
const performanceTests = new PerformanceTestSuite();

performanceTests.addTest(
  'Large list rendering',
  async () => {
    const { render } = require('@testing-library/react-native');
    const largeData = Array.from({ length: 1000 }, (_, i) => ({ id: i, name: `Item ${i}` }));
    render(<OptimizedFlatList data={largeData} renderItem={({ item }) => <Text>{item.name}</Text>} />);
  },
  100 // 100ms threshold
);

performanceTests.addTest(
  'State updates',
  async () => {
    const store = useOptimizedStore.getState();
    const largeUpdate = Array.from({ length: 1000 }, (_, i) => ({ id: i, value: Math.random() }));
    store.setItems(largeUpdate);
  },
  50 // 50ms threshold
);