remix-image-cloudflare
Remix Image Component with Custom Optimizers for Cloudflare
A responsive image component and custom loader for on-demand optimizing of images. The component has been built with remix in mind, but can be used in any React project. The primary focus of this project is to provide an easy integration with Cloudflare workers.
✨ Features
- Small footprint: image component 13 KB, cf-optimizer: 22 KB, js-optimizer: 63 KB
- Easy replacement of standard
<img />
tags - Image caching with Cloudflare KV store
- Cloudflare image optimizer or custom transformers
- Supports local and remote images
- Cache, loader and transformer can be replaced with your own
- Supports rewriting of image URLs
- Example showing the use of the component in a remix project
Credits
Useful References
Troubleshoot
- Note: You must be on the Pro plan and enable "Image Resizing" under domain -> Speed -> Optimizations
- https://support.cloudflare.com/hc/en-us/articles/4412024022029-Troubleshoot-Image-Resizing-problems
🧐 Disclaimer
This project is not affiliated with Remix or Cloudflare.
Copyright & License
Copyright (c) 2022 styxlab - Released under the MIT license.