ymage v1.1.3

Ymage

Package is in beta - in production use is not recomended for now Ymage is react zero dependencies component that takes care of loading optimization, neat presentation, copyright protection,caching and some extras with just one line of code.

✅ Advenced progressive JPEG recognition - image is rendered on first progressive scan avaiable - before onLoad. ✅ Sized, neat image placeholders for loading, error and copyright ✅ Short props for styling ✅ Image copy protection ✅ All image formats are compatible - progressive JPEG is just recommended way ✅ Callback with image dimensions onSize

Installation

$ npm install ymage

Import module to yourcode.js:

import Ymage from 'ymage'

Usage

<Ymage url="fruit.jpg" w={300} h={200} r={10}/>

Using onSize callback:

function sizeHandler(size) 
	console.log("Image is " + size.x + " / " + size.y)
	
<Ymage copyright url={"fruit.jpg"} wh={2/3} h={200} onSize={sizeHandler} />

Styling

In order to properly create the loading shape of the Ymage, you can size it with two of the three properties (w + h), (w + wh) or (h + wh)

Behavior

In addition to following you can use other html props on Ymage like id, className, onClick etc.