Aleksefo / React Native Webp Format
Licence: mit
WebP image integration for React Native apps.
Stars: ✭ 99
Programming Languages
java
68154 projects - #9 most used programming language
Projects that are alternatives of or similar to React Native Webp Format
Exif Py
Easy to use Python module to extract Exif metadata from digital image files.
Stars: ✭ 561 (+466.67%)
Mutual labels: webp
Webp Support
Simple script to check browser support of webp images format.
Stars: ✭ 5 (-94.95%)
Mutual labels: webp
Libvips
A fast image processing library with low memory needs.
Stars: ✭ 6,094 (+6055.56%)
Mutual labels: webp
Flyimg
Dockerized PHP7 application runs as a Microservice to resize and crop images on the fly. Get optimised images with MozJPEG, WebP or PNG using ImageMagick. Includes face detection, cropping, face blurring, image rotation and many other options. Abstract storage based on FlySystem in order to store images on any provider (local, AWS S3...).
Stars: ✭ 762 (+669.7%)
Mutual labels: webp
Sdwebimageswiftui
SwiftUI Image loading and Animation framework powered by SDWebImage
Stars: ✭ 844 (+752.53%)
Mutual labels: webp
Webp server go
Go version of WebP Server. A tool that will serve your JPG/PNGs as WebP format with compression, on-the-fly.
Stars: ✭ 543 (+448.48%)
Mutual labels: webp
Optimise Images
Batch image resizer, optimiser and profiler using ImageMagick convert, OptiPNG, JpegOptim and optional ZopfliPNG, Guetzli and MozJPEG.
Stars: ✭ 64 (-35.35%)
Mutual labels: webp
Qlimagesize
QuickLook and Spotlight plugins to display the dimensions, size and DPI of an image in the title bar instead of the filename. Also preview some unsupported formats like WebP & bpg.
Stars: ✭ 1,071 (+981.82%)
Mutual labels: webp
Webpquicklook
Mac OS X QuickLook plugin for WebP image files
Stars: ✭ 655 (+561.62%)
Mutual labels: webp
Vanilla Lazyload
LazyLoad is a lightweight, flexible script that speeds up your website by deferring the loading of your below-the-fold images, backgrounds, videos, iframes and scripts to when they will enter the viewport. Written in plain "vanilla" JavaScript, it leverages IntersectionObserver, supports responsive images and enables native lazy loading.
Stars: ✭ 6,596 (+6562.63%)
Mutual labels: webp
Sdwebimage
Asynchronous image downloader with cache support as a UIImageView category
Stars: ✭ 23,928 (+24069.7%)
Mutual labels: webp
Lqip Modern
Modern approach to Low Quality Image Placeholders (LQIP) using webp and sharp.
Stars: ✭ 85 (-14.14%)
Mutual labels: webp
React Native WebP Format
Save tens of megabytes with this simple trick...
By utilizing WebP instead of png/jpg you can significantly reduce the size of your app without quality loss.
Works with both Image and ImageBackground React Native components.
iOS uses SDWebImage implementation and Android utilizes Fresco to boost the gained performance even more.
Here's a detailed article with extra details and information on what is the best way to convert your regular images to WebP.
Prerequisites:
- React Native version
0.61or higher (last tested on0.63.2). Older versions might work too, but that's not guaranteed.
Installation
yarn add react-native-webp-format
iOS
cd ios && pod install
Android
Add the following dependencies to android/app/build.gradle:
dependencies {
...
implementation 'com.facebook.fresco:webpsupport:2.0.0'
// Optionally, to display animated WebP images, you have to add:
implementation 'com.facebook.fresco:animated-webp:2.0.0'
...
}
Remember to restart your packager to see the changes. If you still have any issues, try resetting the cache.
Usage
Simply replace .png or .jpg with .webp after you've converted your files <Image source={require('../../assets/close.webp')} />
PRs are welcomed ❤️
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].