我对Expo和React-Native的机制,它们如何下载 Assets 感到困惑。
我知道的信息是,一旦您构建代码,expo就会准备一个捆绑包,其中同时包含javascript(编译后的代码)和 Assets 。
并且在调试 session 期间,该捆绑包-整体上-首先由expo客户端下载,然后启动该应用程序。这意味着一旦启动应用程序,代码中所有“导入”的 Assets 都应就位。
另一方面,当我运行以下原子测试代码时,这是完全相反的。加载这些 Assets 需要花费时间,就像它们是“延迟加载”一样。
所以我的问题是;行为开发模式相关吗?还是在生产模式下下载图像仍然需要时间?
import * as React from 'react';
import { Text, View, StyleSheet, Image, Button } from 'react-native';
import Test0Img from './assets/test0.gif';
import Test1Img from './assets/test1.gif';
export default class App extends React.Component {
constructor() {
super();
this.state = {
imageIndex: 0,
};
}
render() {
return (
<View style={styles.container}>
<Text></Text>
<Text></Text>
<Button
onPress={() => {
let l_newImageIndex = (this.state.imageIndex + 1) % 2;
this.setState({ imageIndex: l_newImageIndex });
}}
title="Click to Change Image"
/>
<Image
source={this.state.imageIndex === 1 ? Test0Img : Test1Img}
style={{
width: '100%',
height: '100%',
resizeMode: 'contain',
}}
/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
backgroundColor: '#ecf0f1',
padding: 8,
},
});
可以在此小吃中看到代码:https://snack.expo.io/@mehmetkaplan/assetdownloadtest
如果您在手机上运行此代码,很可能会发现动画gif并不容易更改。但是,如果您通过网络运行它,更改速度会更快。
博览会文档说明here:
For images that saved to the local filesytem, use Asset.fromModule(image).downloadAsync() to download and cache the image. There is also a loadAsync() helper method to cache a batch of assets.
这也与上面的问题有关,如果图像在本地文件系统中,为什么还要缓存图像呢?
可以在here中看到,也向世博论坛添加了相同的问题。链接两者,以便将来的访客找到任何可能的答案。
最佳答案
为了后代,这是世博工程师在世博论坛上发布的答案:
During development in the Expo client, the images will be downloaded from your local environment. This will take longer due to the all the extra processes that run during Development Mode such as validation checks, remote debugging, hot reloading if enabled, etc. You can read more about this here: https://docs.expo.io/versions/v34.0.0/workflow/development-mode/
When running a published project within the Expo Client, it will fetch your assets from the CDN (CloudFront) in which case you’ll want to make use of the AppLoading module to pre-fetch the assets and only hide the splash screen after all assets have been loaded into memory.
When building a standalone application, you have the option to bundle your assets into the binary (which most should use unless they have an abnormal amount of assets or assets with heavy file sizes) that will result in the assets being loaded into memory much faster since they will be fetched from the local disk rather than making a network request to the CDN.
关于react-native - 在开发和生产模式下,Expo和React-Native的 Assets 下载机制是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57761316/