10个必要的地道面试问题 *

编译成JavaScript的语言通常与React Native兼容. React Native使用Babel将JavaScript转换为可被本地操作系统的JavaScript运行时使用的形式, using the react-native Babel plugin. 只要Babel可以编译你的JavaScript，并且你的代码不依赖于web-或Node.它将在React Native中运行.

任何不依赖于Node的纯JavaScript库.Js运行时模块，并且不依赖于特定于web的概念(例如.g. window.location.pathname) will run fine in React Native. 但是我们必须注意，因为没有办法用babel来测试这一点——它不会扫描这些库是否有冒犯性的依赖. A module that uses window.location.pathname 可能会在运行时意外的地方失败.

附加:对于显式依赖于Node的模块.js runtime modules, 我们可以经常使用Babel插件来浏览这些组件，以便在React Native中使用.

Certain animation types, like Animation.timing and Animation.spring，可以在执行之前序列化并通过异步网桥发送. 这允许运行时将动画的实际绘制完全推迟到本机端, 而不是试图发送位置值在桥上的每一帧渲染. 这不适用于不能提前计算的动画. For example:

Animated.timing(new Animated.Value(0), {
  useNativeDriver: true,
  toValue: 100,
  duration: 100
}).start()

这将序列化操作，并在启动操作之前将其发送到本机.

StyleSheet 是一个模块内置到React Native，允许我们创建不可变的样式表引用. 类中传递常规样式对象 create() 方法，模块将冻结对象，并为每个对象分配一个ID. 这有两个好处:它允许我们避免在每次渲染过程中创建一个新的样式对象(这可能导致渲染性能下降)。, 它允许我们通过异步桥只发送一次对象(因为这些样式对象直接映射到本地样式), they need to be passed across).

这种方法的关键缺点是，基于外部标准(如屏幕旋转或甚至用户选择的观看模式)重新计算样式需要构建一些基础设施来确定使用哪种样式. 如果对象是“原始”传递的，那么每次都可以动态地重新计算它们, based on arbitrary criteria.

Often, and especially on the Android platform, 滚动时不能正确地回收图像列表. 它们的内存永远不会被垃圾收集，也不会在较低的级别手动释放. 这将导致内存不足(OOM)崩溃，当应用程序的内存耗尽时，这种崩溃可能会随机发生.

我们可以通过在Xcode或Android Studio中分析应用程序的堆内存使用情况来研究这个问题. 如果您滚动图像列表并注意到堆使用情况稳步攀升而没有下降, 这可能意味着你的图像没有被正确地回收.

为了减轻这种情况，我们可以检查我们正在使用的列表实现. In modern versions of React Native, ListView should never be used; ensure that the FlatList 组件正在处理渲染. 如果调优后这还不够，您可以尝试降低图像的分辨率.

React Native comes with the Animated API built in. 这个API是声明式的:我们使用 Animated.timing, Animated.spring, etc.，并提供动画运行所需的确切参数. This technique falls apart when we need lots of subtle and delicate animations on the fly; it’s not performant, 维护所有这些代码将是一场噩梦.

Instead, we look to the LayoutAnimation module, which is an interpolative API. We can invoke predefined LayoutAnimations, or define our own. LayoutAnimation 观察渲染循环周期之间元素位置的变化, 并计算元素在不同循环中的位置差. 然后，它插入这些变化并产生平滑的、本机驱动的动画.