I just finished a proof of concept web app that emulates the same concept introduced by reddit place app: a shared pixel board.

Front-End: Flutter

Back-End: FastAPI, Uvicorn, SQLite, Pillow

Here you can try the beta

App Usage: Zoom In and Out the view, touch a pixel to bring up a color palette, select a color and voila, pixel’s color has been changed!

Color palette menu only works if zoomed in more than 50% of the image

Front End design is a two layer view, background layer is loaded with a PNG of the pixel board, new changes are drawn over in the forebackground using canvas

This decision was to optimize bandwidth consumption,the grid is 1000x1000, that gives us 1 million pixels, sending the current grid as a PNG file weight 1.9mbs, which is better than sending a gzip json that weights 4.4mbs for coordinates and colors.

Also, flutter app design has to be imperative, that means, the view is going to be refreshed many times per second, if device screen can run 60fps, the view is going to be refresed 60 times.

Rendering the whole view painting 1 million pixels on canvas takes about 2 to 4 seconds, rekt, but loading a png is really fast.

I also implemented websockets so users can see live changes

webserver refreshes PNG file every 2 minutes.

Im open to suggestions, i will upload the code once a do some cleaning and do proper documentation.

  • Tibert@compuverse.uk
    link
    fedilink
    arrow-up
    17
    ·
    1 year ago

    It’s way too big for this little amount of people, and somehow I stumbled on a porn drawing…

    • Lvxferre@lemmy.ml
      link
      fedilink
      arrow-up
      6
      ·
      1 year ago

      I was almost complaining about nationalists as usual spamming flags, but then I stumbled upon chibi Eris, Sylphy and Roxy and now this is the best thing ever.

    • Stovetop@lemmy.world
      link
      fedilink
      arrow-up
      3
      arrow-down
      1
      ·
      1 year ago

      What the fuck why is it so big? I scrolled for 10 minutes and gave up on trying to reach the end.

      The beauty of the original /r/place was precisely because it was a limited canvas, and communities would cooperate or compete for space, with the output being essentially a visual representation of Reddit as a whole.