2021 Year End Projects Sun Jan 02 2022 Here's where my creativity went during my end of year vacation: IE5 Compatibility, Bread, and a Pixel. -------------------------------------------------------------------------------- 2021 Year End Projects ====================== Published Jan 2, 2022 - 8 min read /--- Table of contents --\ | Table of contents | | * Bowtie Resident Site | | * Glitch's Bread | | * Little Analytics | | * How I feel | \------------------------/ I took a longer vacation at the end of the year. One of those use-it-or-lose it personal time off policies. It finally gave me time to cool down from all the overwhelming feelings from work, and it is clear that I was burned out before. [I1: Feeling recovery] Archived Tweet [L1] I wrote a bit on what had me down in 2021 [L2]. But here's what I did to bring myself back up. Bowtie Resident Site -------------------- I'm in a small community of those that appreciate tech from 1990-2000. As part of that, I wrote a site that works in IE5. Though for reasons it is no longer operating. [I2: Supported in internet explorer 5] It takes input from my twitter account, showing what I tweet, retweet, etc. [I3: Shows how it includes twitter] And I can post content through telegram too. Telegram content at least will include gifs sized appropriately for a dial up connection. [I4: Shows an animated gif] The source for this is on GitHub [L3]. It is made to run in Visual Studio Code Remote - Containers [L4], which I highly recommend. Glitch's Bread -------------- Last year oh it's weird to say that, a few friends set up redirecting domains to a png or a webp hosted [L5] by @Nican [L6]. /[cendyne: gendo]--------------------------------------------------------------\ | I decided to add one myself [L7] but a redirect would not be satisfying for | | me. So I took this sh*tpost seriously. | \------------------------------------------------------------------------------/ I decided to use Janet [L8], a lightweight lisp to write a web server for this. At first it was just some static content plus some content negotiation code, but now the pages are actually dynamic. Along the way * I forked janet-html [L9] - an html library * I forked halo2 [L10] - a webserver library * I wrote some C [L11] to quickly classify content as utf8 or binary * I added several alternate silly things, like video [L12], audio [L13], vectorize it to svg [L14], and do other silly formats like sql [L15]. * Aquos contributed a 1.5GB compressed stream [L16] of breadn with zstd * Pull requests came in for python [L17], rust [L18], and C++ [L19] Then more arrived [L20] and Glitch had to start tracking them. One uses the vectorized svg I made [L21], another shows the lottie animation [L22] derived from the original sticker (also adjusted and replicated on mine [L23] afterwards), and another does some particle affects [L24]. Oh, and at one point I discovered that Telegram will use the twitter:player data and not use the og:video sources. That was a bother. This motivated me to change it to dynamic in the first place. [I5: Twitter hijacking twitter data] Archived Tweet [L25] Following all this, now more are getting in on it personally with their original characters. [I6: Dbleki gets commissioned for more] Archived Tweet [L26] So I got my own too with a croissant: [I7: Silly Bread sticker] Art by @Dbleki [L27] Now bread.cendyne.dev [L7] cycles through all that I am aware of. This project in particular helped me feel a bit more connected to the community as my work inspired more to create their own. The source for this is on GitHub [L28]. Little Analytics ---------------- One of my goals was to make my own tracking instrument, a very very simple one. I knew about tracking pixels [L29], but learned they're also called web beacons. So why would I want my own when I could just add google-analytics for free? Well, that's the thing. Big Tech [L30] free products aren't made for you, it's made for them. There are some self hosted solutions [L31] out there. But for something this small, I'd rather learn myself what's going on and what I can collect and track for my personal uses. Oh but why not just tail the nginx server logs? Differentiating page requests from content requests and dealing with cloudflare is not fun. Plus, I have multiple servers and there's no central logging set up. So my plan was simple. Figure out how to send a pixel without any caching between the server and client, and log each request after piecing out the data. Like the bread project, this was also done in Janet [L8]. For now deployments are only collecting content in the path, but I ended up Forking janet-uri [L32] to add flexibility to query parameter parsing. /----------------------------------------------------------[cendyne: you-tried]\ | Janet-uri and halo2 [L10] still needs some more changes, since both headers | | can't be put into hash maps as is. It is perfectly valid to send multiple | | headers with the same key but different values, to send query parameters | | likewise, and for query parameters to have no value [L33]. | \------------------------------------------------------------------------------/ So what would I serve? I see that most recommend a 48 or 49 byte gif. /[cendyne: looking-ych]--------------------------------------------------------\ | But can we go smaller? | \------------------------------------------------------------------------------/ But I found The Tiniest GIF Ever [L34] by Probably Programming. A 37 byte transparent gif exists! So that's what I ended up serving. Each request has some content filtered out, then json encoded and dumped into sqlite for later. The source for this is on GitHub [L35]. If I go to a special url with a secret token in it, I can get back a text/plain report on the visits. The IPs have been masked below. I was surprised to find that some were connecting in with ipv6! ---- Unique hosts last 30 days ---- bread.cendyne.dev: 69 cendyne.dev: 61 ---- Last 100 visits ---- ------ bread.cendyne.dev ------ 2022-00-01T19:36:32Z 73.73.255.255 / 2022-00-01T19:36:31Z 73.73.255.255 / 2022-00-01T19:36:30Z 73.73.255.255 / 2022-00-01T19:36:29Z 73.73.255.255 / 2022-00-01T19:36:28Z 73.73.255.255 / 2022-00-01T19:36:26Z 73.73.255.255 / 2022-00-01T19:36:24Z 73.73.255.255 / 2022-00-01T19:36:22Z 73.73.255.255 / 2022-00-01T19:36:21Z 73.73.255.255 / 2022-00-01T19:34:12Z 134.215.255.255 /lottie 2022-00-01T19:21:24Z 134.215.255.255 / 2022-00-01T18:35:38Z 24.15.255.255 / 2022-00-01T18:22:25Z 2607:9000:::: / 2022-00-01T18:22:23Z 2607:9000:::: / 2022-00-01T18:22:22Z 2607:9000:::: / 2022-00-01T18:22:20Z 2607:9000:::: / 2022-00-01T18:19:54Z 82.8.255.255 / 2022-00-01T18:19:53Z 82.8.255.255 / 2022-00-01T18:19:52Z 82.8.255.255 / 2022-00-01T18:19:51Z 82.8.255.255 / 2022-00-01T18:19:48Z 82.8.255.255 / 2022-00-01T18:19:47Z 82.8.255.255 / 2022-00-01T18:19:46Z 82.8.255.255 / 2022-00-01T18:19:45Z 82.8.255.255 / 2022-00-01T18:19:44Z 82.8.255.255 / 2022-00-01T18:19:43Z 82.8.255.255 / 2022-00-01T18:19:42Z 82.8.255.255 / 2022-00-01T18:19:41Z 82.8.255.255 / 2022-00-01T18:19:40Z 82.8.255.255 / 2022-00-01T18:19:40Z 2607:9000:::: / 2022-00-01T18:19:39Z 82.8.255.255 / 2022-00-01T18:19:38Z 2607:9000:::: / 2022-00-01T18:19:38Z 82.8.255.255 / 2022-00-01T18:19:37Z 82.8.255.255 / 2022-00-01T18:19:36Z 2607:9000:::: / 2022-00-01T18:19:36Z 82.8.255.255 / 2022-00-01T18:19:34Z 2607:9000:::: / 2022-00-01T18:19:34Z 82.8.255.255 / 2022-00-01T18:19:33Z 2607:9000:::: / 2022-00-01T18:19:32Z 82.8.255.255 / 2022-00-01T18:19:30Z 2607:9000:::: / 2022-00-01T18:19:29Z 2607:9000:::: / 2022-00-01T18:19:27Z 2607:9000:::: / 2022-00-01T18:19:03Z 2607:9000:::: / 2022-00-01T18:15:09Z 134.215.255.255 / 2022-00-01T18:15:02Z 134.215.255.255 / 2022-00-01T18:15:01Z 134.215.255.255 / 2022-00-01T18:15:00Z 134.215.255.255 / 2022-00-01T18:14:59Z 134.215.255.255 / 2022-00-01T18:14:58Z 134.215.255.255 / 2022-00-01T18:14:20Z 2607:fb90:::: / 2022-00-01T18:14:16Z 2607:fb90:::: / 2022-00-01T18:13:49Z 134.215.255.255 / 2022-00-01T18:11:38Z 71.231.255.255 / 2022-00-01T18:11:37Z 71.231.255.255 / 2022-00-01T18:11:35Z 71.231.255.255 / 2022-00-01T18:11:34Z 71.231.255.255 / 2022-00-01T18:11:31Z 71.231.255.255 / 2022-00-01T18:10:55Z 45.83.255.255 / 2022-00-01T18:10:52Z 45.83.255.255 / 2022-00-01T18:10:47Z 45.83.255.255 / 2022-00-01T18:09:49Z 134.215.255.255 / 2022-00-01T18:09:48Z 134.215.255.255 / 2022-00-01T17:46:30Z 134.215.255.255 / 2022-00-01T17:46:24Z 134.215.255.255 / 2022-00-01T17:31:21Z 134.215.255.255 / 2022-00-01T03:36:19Z 100.19.255.255 / 2022-00-00T22:46:45Z 134.215.255.255 /lottie 2022-00-00T22:46:43Z 134.215.255.255 / ------ cendyne.dev ------ 2022-00-01T18:41:29Z 24.15.255.255 / 2022-00-01T18:41:28Z 24.15.255.255 /posts/ 2022-00-01T18:41:00Z 24.15.255.255 /posts/2022-01-01-new-year.html 2022-00-01T18:40:57Z 24.15.255.255 /posts/ 2022-00-01T18:40:48Z 24.15.255.255 / 2022-00-01T18:14:57Z 134.215.255.255 / 2022-00-01T18:12:57Z 74.132.255.255 /posts/2022-01-01-new-year.html 2022-00-01T17:46:50Z 134.215.255.255 /posts/2021-11-11-project-planning-part- 6.html 2022-00-01T17:46:49Z 134.215.255.255 /posts/ 2022-00-01T17:46:48Z 134.215.255.255 / 2022-00-01T16:47:31Z 134.215.255.255 /posts/2021-10-02-dynamic-handler- mapping.html 2022-00-01T16:47:28Z 134.215.255.255 /posts/2022-01-01-new-year.html 2022-00-01T16:47:27Z 134.215.255.255 /posts/ 2022-00-01T16:47:25Z 134.215.255.255 / ... Well now that's pretty neat. I can make charts and graphs later. /[cendyne: dab]----------------------------------------------------------------\ | The many same-ip visits are because bread.cendyne.dev [L7] will randomly | | choose one of the artworks for the subject. | \------------------------------------------------------------------------------/ But this is satisfying for now. How I feel ---------- Little Analytics was definitely on my wish list for a few months. So I feel great having that done. The other two projects were fun things to polish with a social nature to it. I feel like my social life is in ruin last year after prioritizing work above everything else. These social project had a healing affect for me. So I may do more of these as I feel drained and empty. -------------------------------------------------------------------------------- [L1]: https://archive.ph/O3xt8 [L2]: /posts/2022-01-01-new-year.html [L3]: https://github.com/cendyne/bowtie [L4]: https://code.visualstudio.com/docs/remote/containers [L5]: https://bunnypa.ws/api/image/stickers/Nicanbun/CAACAgEAAxUAAWE- fBQpaNZdMdTzlk8ii6Kh3HdrAAITAANK7LhMFde7cU1AgPcgBA.webp [L6]: https://twitter.com/Nican [L7]: https://bread.cendyne.dev [L8]: https://janet-lang.org/ [L9]: https://github.com/cendyne/janet-html [L10]: https://github.com/cendyne/halo2 [L11]: https://github.com/cendyne/bread/blob/main/helper.c [L12]: https://bread.cendyne.dev/video [L13]: https://bread.cendyne.dev/audio [L14]: https://bread.cendyne.dev/bread.svg [L15]: https://bread.cendyne.dev/bread.sql [L16]: https://bread.cendyne.dev/bread.zst [L17]: https://bread.cendyne.dev/bread.py [L18]: https://bread.cendyne.dev/bread.rs [L19]: https://bread.cendyne.dev/bread.cpp [L20]: https://www.glitchfur.net/bread/ [L21]: https://bread.furries.house/ [L22]: https://lordoftheyiffs.github.io/bread/ [L23]: https://bread.cendyne.dev/lottie [L24]: https://bread.stuff.solutions/ [L25]: https://archive.ph/1DnQk [L26]: https://archive.ph/HfO3f [L27]: https://twitter.com/Dbleki [L28]: https://github.com/cendyne/bread [L29]: https://en.wikipedia.org/wiki/Web_beacon [L30]: https://en.wikipedia.org/wiki/Big_Tech [L31]: https://plausible.io/self-hosted-web-analytics [L32]: https://github.com/cendyne/janet-uri [L33]: https://imageopt.com/documentation [L34]: https://archive.ph/48Hzh [L35]: https://github.com/cendyne/little-analytics [I2]: https://c.cdyn.dev/7aAESHd8 [I3]: https://c.cdyn.dev/rf7bpl4J [I4]: https://c.cdyn.dev/dftrko78