# react-native-images-cache

> Fetch and cache image for React Native

Latest version **1.0.2** (published 2021-02-07) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-native-images-cache
pnpm add react-native-images-cache
yarn add react-native-images-cache
bun add react-native-images-cache
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2021-02-07 |
| First published | 2021-02-07 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 5 |
| Unpacked size | 56.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | Tu Dat Nguyen |
| Maintainers | tudatn |
| Keywords | image, cache |

## Links

- npm: https://www.npmjs.com/package/react-native-images-cache
- Repository: https://github.com/tudatn/react-native-image-cache
- Homepage: https://github.com/tudatn/react-native-image-cache#readme
- Issues: https://github.com/tudatn/react-native-image-cache/issues
- npm.io page: https://npm.io/package/react-native-images-cache

## Dependencies (5)

- [react](https://npm.io/package/react.md) ^16.13.1
- [valid-url](https://npm.io/package/valid-url.md) ^1.0.9
- [object-hash](https://npm.io/package/object-hash.md) ^2.0.3
- [react-native](https://npm.io/package/react-native.md) >=0.60.0
- [react-native-unimodules](https://npm.io/package/react-native-unimodules.md) ^0.12.0

## Alternatives

- [memory-cache](https://npm.io/package/memory-cache.md) — 795.0K weekly downloads
- [@httptoolkit/proxy-agent](https://npm.io/package/@httptoolkit/proxy-agent.md) — 11.2K weekly downloads
- [express-cache-controller](https://npm.io/package/express-cache-controller.md) — 5.3K weekly downloads
- [http-cache-middleware](https://npm.io/package/http-cache-middleware.md) — 4.5K weekly downloads
- [cache2](https://npm.io/package/cache2.md) — 1.5K weekly downloads

## Recent versions

- 1.0.2 (latest) — 2021-02-07
- 1.0.1 — 2021-02-07
- 1.0.0 — 2021-02-07

## README

This module is to provide methods to cache, preload, and download images for React Native projects.

### Installation

This package is using `FileSystem` of [Expo react-native-unimodules](https://github.com/unimodules/react-native-unimodules). Please follow the instructions at https://docs.expo.io/bare/installing-unimodules/ to add configurations for iOS and Android.

### Usage

#### CacheImage component
```typescript
import { CacheImage } from 'react-native-caches-image';

export default function Example(props) {
    return (
        <View>
            <CacheImage 
                uri='https://images.pexels.com/photos/6468238/pexels-photo-6468238.jpeg' 
                localFallbackImage={require('./assets/image_placeholder.jpg')} />
        </View>
    )
}
```

#### Preload images

```typescript
import { imageCache } from 'react-native-images-cache';

imageCache
    .preloadImages(preloadingImages, updateProgress)
    .then((result) => {
        // console.log(result.downloaded / result.tried)
        // now can use all images offline
    })
    .catch((error) => {
        console.log(error);
    });

function updateProgress(mappingObject) {
    // received mappingObject: { uri, imagePath }
    // calculate progress for each fetched image
}
```

### License:

The source code is made available under the MIT license. Some of the dependencies are licensed differently, with the BSD license, for example.

---
_Source: https://npm.io/package/react-native-images-cache · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._