Pixie: Image/Avatar Proxy for Steem Applications.

in utopian-io •  5 months ago

Repository

https://github.com/blocker-solutions/pixie

New Project: Pixie

What is the project about?

Pixie is an image/avatar proxy for Steem applications. Similar to "steemitimages.com" and "img.busy.org" but with some key differences:

Instead of responding with a redirect, Pixie responds / proxies the images directly, this is a key requirement for a mobile project currently in development, and that's one of the motives why Pixie was born.

For example, take the account someuser, which does not actually exists. Instead of an error, Pixie generates a generic avatar, like this one:

The URL: https://img.blocker.press/a/someuser responds with the following image.

https://img.blocker.press/a/someuser

Of course, in case the account exists, and there's is an avatar, the result is the actual image, but adjusted into a square, without prejudice to the aspect ration:

https://img.blocker.press/a/utopian-io

The always square format is also helpful to frontend developers which don't have to hack it's way on CSS to keep the aspect ratio.

On cases where the account has a dash or dot, the placeholder avatar will be generated considering the first letter of each part, for example, other-user (now with a dash between the words):

https://img.blocker.press/a/other-user

Pixie is open-source, but it's available at https://img.blocker.press behind Cloudflare CDN, taking full advantage of browser caching and low latency anywhere on the world.

Pixie servers JPEG by default. Using an special URL segment, it can serve also WEBP images.

Instead of

use

Technology Stack

This project was built with Lumen, a slim children project of the Laravel framework. Even Lumen is already really "micro", Pixie was created with the minimal structure in mind, making it easy to maintain and use by anyone interested.

The image manipulation is done by the GD extension, though the Intervention/Image library.

The generated avatars are queried only once, and then cached first on the application level (Redis cache), then Cached on the Edge CDN (Cloudflare), and finally, expiration headers for browsers are set so the network impact is minimal.

In simple terms, once one user browses a given page and the avatar get's displayed, the next requests for the same user are served by the browser cache.
A second user which browses the same avatar, on a different machine, get served from the CDN.

This minimizes drastically the impact of server load for the image manipulation.

The docker image blockerpress/pixie is available on Docker hub for those who want to use it easily, the project repository also includes a docker-compose.yml file to help you spin-up a development environment and make Pixie your own.

Roadmap

  • Load test for scale purposes.
  • Replace Nginx with PHP-PM to increase throughput under possible heavy-load.
  • Responses with more dimensions.
  • Read the optional extension on the URL and respond with the correct image encoding. Implemented on v0.3.0
  • Include some filters to be played with though the URL (like making the avatar into a circle, or even invert it's colors).

How to contribute?

Contact on the Github repository, Discord or Commenting on the Post.

Thank you!

P.S.

As of right now, this contribution is being made outside Utopian, so the beneficiary reward will be transferred upon payout.

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

Thanks for the contribution!


Need help? Write a ticket on https://support.utopian.io/.
Chat with us on Discord.
[utopian-moderator]

Hi, I really like your content have an upvote.

Hey @hernandev
Thanks for contributing on Utopian.
We're already looking forward to your next contribution!

Contributing on Utopian
Learn how to contribute on our website or by watching this tutorial on Youtube.

Want to chat? Join us on Discord https://discord.gg/h52nFrV.

Vote for Utopian Witness!