React-Native中Image最好的是什么？

Question

我正在使用React-Native和Expo。

Expo为我提供了许多我只能在JS中使用的功能。 （Facebook登录，位置，联系等...）

我想启动android和ios，所以我决定使用expo，也许这对我的应用程序来说很好。

但我很担心。我的应用程序显示许多图像所以，我考虑性能。 我找到了名为react-native-fast-image的着名组件，但我在当前的项目中遇到麻烦。

如果我在我的场景中使用基本的React Native Image组件，那没关系。 它会影响性能吗？

Answer 1

下载图像后，您应该开始考虑预加载和缓存资产。您可以在以下链接中找到有关如何使用Expo资源执行此操作的信息：

https://docs.expo.io/versions/latest/guides/preloading-and-caching-assets.html

Answer 2

根据使用react-native-fast-image的一般说明，React Native的Image组件在大多数情况下处理类似于浏览器的图像缓存。如果服务器正在为图像返回适当的缓存控制标头，那么您通常会获得浏览器中的内置缓存行为。

但是，在场景中使用默认的Image组件将导致：

• 闪烁。
• 缓存未命中。
• 从缓存中加载低性能。
• 一般表现不佳。

尽管如此，您还可以在本机图像组件中使用Image.prefetch（url）来预取图像。

Answer 3

1. 提到Murilo Varela时，您一定要考虑预加载和缓存图片。 React Native自己的Image有一个名为Image.prefetch(url)的方法可以让你这样做。这可以提高应用在用户体验方面的表现。

2. 还有另一种方法可以提高应用在运行时应用内存的性能，我认为这是您正在寻找的内容。首先，看一下典型的社交应用，例如Twitter：



注意什么？个人资料图片和4个图片很小，他们的实际尺寸必须更大。如果点击这些图像，您将进入全屏模式，因此，请查看它们的高分辨率版本。但是有可能用户对这4张图片不感兴趣，他根本不会点击它们，但跳过它们。因此，我们为什么要下载这些图像的原始版本？这些图像可能是几兆字节，但用户甚至不会查看它们。因此，我们应该为每个图像生成一个缩略图，显示上面的缩略图，只有当用户点击这些图像并进入全屏模式时才开始下载原始图像。

我在Firebase有经验，但在AWS没有，但我用Google搜索，你绝对可以这样做。如果您有兴趣，请告诉我，我当然可以介绍使用Firebase生成缩略图，但如果没有，您可以在AWS中谷歌如何执行此操作。无论哪种方式，我认为你应该考虑在你的应用程序中包含缩略图，它被你听说过的每个应用程序使用