1. 什么是 Hermes？

Hermes 是 Facebook（现 Meta）为 React Native 应用开发的高性能 JavaScript 引擎。与传统的 JavaScriptCore（JSC）引擎相比，Hermes 具有以下优势：

• 更快的启动时间：通过预编译字节码减少解析和编译时间
• 更小的内存占用：优化内存管理，减少应用内存使用
• 更小的应用体积：支持字节码打包，减小 APK/IPA 文件大小
• 更好的性能：针对移动设备优化的执行引擎

2. 安装前准备

2.1 系统要求

• 操作系统：macOS、Windows 或 Linux
• Node.js：版本 14 或更高
• React Native：0.70 或更高版本（Hermes 已默认集成）
• Android Studio（Android 开发）
• Xcode（iOS 开发，仅限 macOS）

2.2 检查当前环境

# 检查 Node.js 版本
node --version

# 检查 npm 版本
npm --version

# 检查 React Native CLI
npx react-native --version

3. 在新项目中启用 Hermes

3.1 创建新的 React Native 项目

# 使用 React Native CLI 创建新项目
npx react-native init MyHermesApp

# 进入项目目录
cd MyHermesApp

3.2 Android 启用 Hermes

打开 android/app/build.gradle 文件，确保以下配置：

project.ext.react = [
    enableHermes: true,  // 启用 Hermes
]

或者，在 React Native 0.71+ 中，检查 android/gradle.properties：

# 确保这行存在且为 true
hermesEnabled=true

3.3 iOS 启用 Hermes

打开 ios/Podfile，确保以下配置：

:hermes_enabled => true,

然后重新安装依赖：

cd ios
pod install
cd ..

4. 在现有项目中启用 Hermes

4.1 检查当前是否使用 Hermes

// 在 App.js 中添加以下代码检查
import { Platform } from 'react-native';

const isHermesEnabled = () => {
  if (Platform.OS === 'ios') {
    return global.HermesInternal !== null;
  } else if (Platform.OS === 'android') {
    return global.HermesInternal !== null;
  }
  return false;
};

console.log('Hermes enabled:', isHermesEnabled());

4.2 启用 Hermes 步骤

对于 Android：

1. 修改 android/app/build.gradle：

project.ext.react = [
    enableHermes: true,  // 改为 true
]

2. 清理并重新构建：

cd android
./gradlew clean
cd ..
npx react-native run-android

对于 iOS：

1. 修改 ios/Podfile：

use_react_native!(
  :path => config[:reactNativePath],
  :hermes_enabled => true,  # 确保为 true
)

2. 重新安装 pods：

cd ios
pod install --repo-update
cd ..
npx react-native run-ios

5. 验证 Hermes 安装

5.1 运行验证脚本

# 运行应用
npx react-native run-android
# 或
npx react-native run-ios

5.2 在应用中验证

import React from 'react';
import { View, Text, Platform } from 'react-native';

const HermesCheck = () => {
  const isHermes = () => {
    return typeof HermesInternal === 'object' && HermesInternal !== null;
  };

  return (
    <View style={{ padding: 20 }}>
      <Text style={{ fontSize: 18, fontWeight: 'bold' }}>
        Hermes 状态检查
      </Text>
      <Text>平台: {Platform.OS}</Text>
      <Text>Hermes 已启用: {isHermes() ? '是' : '否'}</Text>
      <Text>引擎版本: {isHermes() ? HermesInternal.getRuntimeProperties().OSSReleaseVersion : 'N/A'}</Text>
    </View>
  );
};

export default HermesCheck;

5.3 检查日志输出

应用启动时，在 Metro 控制台应该能看到类似信息：

INFO  Hermes: Running on Hermes engine

6. 常见问题与解决方案

6.1 构建失败问题

问题： Could not determine the dependencies of task ':app:mergeDebugNativeLibs'

解决方案：

# 清理构建缓存
cd android
./gradlew clean
./gradlew cleanBuildCache
cd ..

# 删除 node_modules 重新安装
rm -rf node_modules
npm install

# 重新运行
npx react-native run-android

6.2 iOS 构建问题

问题： 'hermes-engine/hermes-engine.h' file not found

解决方案：

# 完全清理 iOS 构建
cd ios
rm -rf Pods Podfile.lock
pod deintegrate
pod install --repo-update
cd ..

6.3 Hermes 与第三方库兼容性

如果遇到库不兼容问题，可以临时禁用 Hermes 进行测试：

// Android 临时禁用
project.ext.react = [
    enableHermes: false,
]

// iOS 临时禁用
:hermes_enabled => false,

7. 性能优化建议

7.1 字节码预编译

# 生成字节码 bundle
npx react-native bundle \
  --platform android \
  --dev false \
  --entry-file index.js \
  --bundle-output android/app/src/main/assets/index.android.bundle \
  --assets-dest android/app/src/main/res \
  --minify true

7.2 内存分析

Hermes 提供了内存分析工具：

// 在开发模式下启用内存分析
if (__DEV__) {
  const HermesProfiler = require('hermes-profiler');
  HermesProfiler.start();
}

7.3 生产环境配置

// android/app/build.gradle
android {
    buildTypes {
        release {
            // 启用 Hermes 优化
            minifyEnabled true
            shrinkResources true
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
}

8. 总结

Hermes 作为 React Native 的默认 JavaScript 引擎，为移动应用带来了显著的性能提升。通过本文的安装指南，您可以：

1. ✅ 在新项目中默认启用 Hermes
2. ✅ 在现有项目中迁移到 Hermes
3. ✅ 验证 Hermes 是否正确运行
4. ✅ 解决常见的安装问题
5. ✅ 进行性能优化配置

建议在启用 Hermes 后，充分测试应用的所有功能，确保兼容性和稳定性。对于生产环境，务必进行全面的性能测试和用户体验验证。