// Android - android/app/build.gradle
project.ext.react = [
    enableHermes: true
]

# iOS - Podfile
use_react_native!(
  :path => config[:reactNativePath],
  :hermes_enabled => true
)

enableHermes: false  // Use JSC instead

import { PerformanceObserver } from 'react-native';

const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    console.log(`${entry.name}: ${entry.duration}ms`);
  });
});

observer.observe({ entryTypes: ['measure'] });

import { InteractionManager } from 'react-native';

InteractionManager.runAfterInteractions(() => {
  // Expensive operation after animations complete
  processLargeDataset();
});

if (__DEV__) {
  const { performance } = require('react-native');
  console.log('Memory:', performance.memory);
}

import React, { memo, useMemo } from 'react';

const ExpensiveComponent = memo(({ data }) => {
  const processedData = useMemo(
    () => expensiveOperation(data),
    [data]
  );
  
  return <View>{processedData}</View>;
});

// Bad: Multiple bridge calls
for (let i = 0; i < 100; i++) {
  NativeModule.updateValue(i);
}

// Good: Batch operations
NativeModule.updateValues(Array.from({ length: 100 }, (_, i) => i));

import { FlatList } from 'react-native';

const OptimizedList = () => (
  <FlatList
    data={largeDataset}
    renderItem={renderItem}
    keyExtractor={item => item.id}
    getItemLayout={(data, index) => ({
      length: ITEM_HEIGHT,
      offset: ITEM_HEIGHT * index,
      index,
    })}
    initialNumToRender={10}
    maxToRenderPerBatch={10}
    windowSize={5}
    removeClippedSubviews={true}
  />
);

import { useEffect, useState } from 'react';

const HeavyComputation = ({ data }) => {
  const [result, setResult] = useState(null);
  
  useEffect(() => {
    // Use Web Worker or native module
    const worker = new Worker('./computation.worker.js');
    worker.postMessage(data);
    worker.onmessage = (e) => setResult(e.data);
    
    return () => worker.terminate();
  }, [data]);
  
  return <Text>{result}</Text>;
};

import { Animated } from 'react-native';

const fadeAnim = new Animated.Value(0);

Animated.timing(fadeAnim, {
  toValue: 1,
  duration: 1000,
  useNativeDriver: true, // Run on native thread
}).start();

import { Image } from 'react-native';
import FastImage from 'react-native-fast-image';

// Use appropriate image formats and sizes
<Image
  source={{ uri: 'https://example.com/image.jpg' }}
  style={{ width: 200, height: 200 }}
  resizeMode="cover"
/>

// Consider FastImage for better performance
<FastImage
  source={{
    uri: 'https://example.com/image.jpg',
    priority: FastImage.priority.normal,
  }}
  style={{ width: 200, height: 200 }}
  resizeMode={FastImage.resizeMode.contain}
/>

import React, { lazy, Suspense } from 'react';

const HeavyComponent = lazy(() => import('./HeavyComponent'));

const App = () => (
  <Suspense fallback={<LoadingSpinner />}>
    <HeavyComponent />
  </Suspense>
);

// Load module only when needed
const handlePress = () => {
  const HeavyModule = require('./HeavyModule').default;
  HeavyModule.doSomething();
};

# Android
cd android
./gradlew assembleRelease

# iOS
xcodebuild -workspace ios/App.xcworkspace \
  -scheme App \
  -configuration Release

import { Profiler } from 'react';

const onRenderCallback = (id, phase, actualDuration) => {
  console.log(`${id} (${phase}) took ${actualDuration}ms`);
};

<Profiler id="MyComponent" onRender={onRenderCallback}>
  <MyComponent />
</Profiler>

import { performance } from 'react-native';

performance.mark('operation-start');
// ... expensive operation
performance.mark('operation-end');
performance.measure(
  'operation',
  'operation-start',
  'operation-end'
);

const measure = performance.getEntriesByName('operation')[0];
console.log(`Operation took ${measure.duration}ms`);

android {
    buildTypes {
        release {
            minifyEnabled true
            shrinkResources true
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

post_install do |installer|
  installer.pods_project.targets.each do |target|
    target.build_configurations.each do |config|
      config.build_settings['ONLY_ACTIVE_ARCH'] = 'NO'
      config.build_settings['GCC_OPTIMIZATION_LEVEL'] = 's'
    end
  end
end