zouhir / lqip

Low Quality Image Placeholders (LQIP) Module for Node
433 stars 30 forks source link

Funding for lqip #14

Open chrisvxd opened 5 years ago

chrisvxd commented 5 years ago

Hey @zouhir! 👋 Just wanted to reach out about funding your work on lqip.

@transitive-bullshit and I are both open source maintainers, and we're exploring new ways to make OSS funding a viable source of income.

We're currently looking at building rate-limited SaaS APIs on top of existing OSS libraries, reserving the majority of profits for the original authors. We've built a few at this point, but want to keep adding more.

lqip is really neat, and we thought it would make for a great API. So we built a demo API and landing page using this source code.

Render lqip via web API

https://api.saasify.sh/1/call/dev/lqip@60e05028/urlToImage?url=https%3A%2F%2Fimages.unsplash.com%2Fphoto-1521911494023-701af6c9579c

Returns

We also have an endpoint to return Base64.

Render lqip on-the-fly using pure HTML

Pairing the API with some clever markup allows you to render lqip images on-the-fly, before the full image loads!

<img src="https://images.unsplash.com/photo-1521911494023-701af6c9579c" 
     width="480"
     height="300"
     style="background:url(https://api.saasify.sh/1/call/dev/lqip@60e05028/urlToImage?url=https%3A%2F%2Fimages.unsplash.com%2Fphoto-1521911494023-701af6c9579c) no-repeat; 
            background-size: 100%;
            width:480px;
            height:300px" />

Checkout this codepen to see it render before the full images loads (you might need to simulate a slower connection). These lqip previews would be cached.


Looking forward to hearing your thoughts and feedback! 🙏

transitive-bullshit commented 5 years ago

I'm incredibly biased since I'm working with Chris, but I have to say that if we work out the specifics, the ability to include lqip-type images inline in HTML as opposed to bundling a JS script would be incredibly powerful.

Think of how much easier this would make certain uses cases where people want to use cool tech but either don't have the knowledge or access to the underlying implementation in order to bundle awesome libraries like lqip.