由高性能原生库支持的 React Native 的快速图像加载
一种在 React Native（仅限 iOS）中渲染图像的高性能方式，重点关注速度和内存使用情况。由Nuke提供支持，Nuke是适用于iOS和macOS的最小，性能最高的图像加载库。
该框架非常精简，可在 2 秒内完成编译¹。Nuke的自动化测试套件是代码库本身大小的2倍，确保了出色的可靠性。每个功能都经过精心设计和优化，以达到性能。
Features
- Fast image loading
- Memory and disk caching
- Placeholder support:
- Animated transition
- Failure image
- Typescript support
- Written in Swift
Installation
- Add the package to your project:
yarn add @candlefinance/faster-image
- Add the following source to the top of your Podfile (iOS 13+):
source 'https://github.com/candlefinance/podspecs.git'
Usage
import { FasterImageView } from '@candlefinance/faster-image';
<FasterImageView
rounded={true}
onError={(event) => console.warn(event.nativeEvent.error)}
style={{ width: 300, height: 300 }}
thumbhash="k0oGLQaSVsJ0BVhn2oq2Z5SQUQcZ"
cachePolicy="discNoCacheControl"
transitionDuration={0.3}
url="https://picsum.photos/seed/3240/4000/3000"
/>;
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| url | string | The URL of the image | |
| style | object | The style of the image | |
| resizeMode | string | contain | The resize mode of the image |
| thumbhash | string | The thumbhash of the image as a base64 encoded string to show while loading | |
| blurhash | string | The blurhash of the image to show while loading | |
| showActivityIndicator | boolean | false | Whether to show the UIActivityIndicatorView indicator when the image is loading |
| base64Placeholder | string | The base64 encoded placeholder image to show while the image is loading | |
| cachePolicy | string | memory | The cache policy of the image |
| transitionDuration | number | 0.75 | The transition duration of the image |
| rounded | boolean | false | Round the image into a circle |
| failureImage | string | If the image fails to download this will be set (blurhash, thumbhash, base64) | |
| progressiveLoadingEnabled | boolean | false | Progressively load images |
| onError | function | The function to call when an error occurs. The error is passed as the first argument of the function | |
| onSucess | function | The function to call when the image is successfully loaded |
Contributing
See the contributing guide to learn how to contribute to the repository and the development workflow.
License
MIT
