Forem: Athaariq Ardhiansyah

Compile-Time Hash in Plain C (Not Only C++) is Now Possible!

Athaariq Ardhiansyah — Tue, 09 Aug 2022 15:56:07 +0000

Hello folks, I'm back! After months of disappearance, restless night, rollercoaster-mood, finally I have something to share for you 😁 Let's dig down to the rabbit hole again 🕳️🐇

a Little Background (I guess...)

Imagine a case where you're trying to identify multiple sections of data with labels like "Acceleration X" then use them for data transfer between devices. Normally, programmers rather create a convention of integers like table below.

ID	Label
1	Acceleration X
2	Acceleration Y
3	Orientation
4	Temperature
...	...

While transferring the data, all devices use the ID instead of label because of hardware constraint (we're talking about Arduino/ESP32/AVR for now). This approach will work, but what if you're working with large group of teams or with community here at the internet? Well... That's tough

Instead of defining an integer for each label manually, why don't we try to automate it? Sure we can, but here's the catch:

IDs must different if labels different, otherwise they collide
Accept diverse length of labels but ID size (in bits) must consistent
Fast as possible

Okay but what's the solution?

In Computer Science, we learn what hash function do and that solves the problems mentioned above. It works as below.

This approach is a common practice in computing world. Usually for error checking. But have you ever wondered how it actually works behind the scene? It's... complicated for me to say. So complicated that nobody ever bother to create its implementation that run on compilation time with Macro in C language!

Why bother to run it on compilation time?

Previously, I did a project which involves AVR microcontrollers (Arduino Uno to be exact) and an Orange Pi board, and stumbled with that case. I stupidly asked microcontrollers to calculate CRC32 for ±40 strings on runtime then they went mayhem. That approach ate 2/3 of SRAM and took multiple seconds to finish the setup() function. I started to think what if I can do that in compile-time instead of runtime. That would saves a lot of resource on microcontroller, right? Well... not that easy.

Trials and Failures

C++ Constant Expression

By the power of C++, we can explicitly tell the compiler to compute CRC32 at compile-time with constexpr keyword! Somebody at StackOverflow gave us a snippet of compile-time CRC32. It works as expected when I simulate it on my Linux laptop. Except... I forgot that my OrangePi board uses C instead of C++.

Anyway it's not a big deal, that board has multiple CPU with gigahertz speed. Nothing went wrong, I guess...

Memory Usage is Bigger than Before 💀

...Until I realized Arduino IDE failed to compile:



Sketch uses 4448 bytes (13%) of program storage space. Maximum is 32256 bytes.
Global variables use 2290 bytes (111%) of dynamic memory, leaving -242 bytes for local variables. Maximum is 2048 bytes.
Not enough memory; see https://support.arduino.cc/hc/en-us/articles/360013825179 for tips on reducing your footprint.
Error compiling for board Arduino Uno.

After hours of troubleshooting, I realized that:

The CRC32 table was uselessly stored in flash by compiler. I realized there was a table after saw this gist and for some reason the compiler store it into the flash.
Why on earth the strings still stored in flash by compiler?!

Turns out I can't simply use constexpr for this purpose. Even though I followed this advice, the constant expression still not behaves as "constant expression".

Let's use an alternative: Macro

CRC32 is Too Complex for Macro

Now this is the most interesting thing, how do we write CRC32 with Macro? The answer is "it can't". Just imagine put an elephant into a fridge alive. That won't work even if you chop the elephant to pieces!

Interesting thing? You said "it can't" as interesting??

Well that's not the "interesting thing" I meant, sorry for the exaggeration. What I meant interesting is when I figured out an alternative, yet still working hash algorithm. Introducing my homebrewed simple XOR hash function:



f(s,i,x) = (s[i] ^ x) * 17

Where:
    s = Input string
    i = Current character index
    x = Hash result of previous character, if i == 0 then x = 11

That function is being executed for each character of a string, from left to right (first to last).

I call this algorithm SIX Hash because that function's parameter looks funny. The future seems bright, isn't it? Now let's write the darn macro!

Attempting to Use Boost Preprocessor

For those who didn't know what is Boost, it's a C++ library that helps to prevent re-inventing the wheel while trying to program something quite complex as example looping only with macro, Boost Preprocessor. Fortunately, Boost Preprocessor Repeat also works with plain C, not only C++. So, my OrangePi board can calculate hash at compile-time. Unfortunately, my SIX Hash algorithm requires sizeof(input) and Boost... won't... work... with it. Hours of workarounds, no luck.

Now what? Cries??

Well no, I think I have to re-invent the wheel again :)

Loop The C Macro with PHP (seriously)

What if I tell you, PHP can be Macro of C Macro? Confused? Let me explain.

The goal of using PHP is automatically copy-paste lines of #define because that's what Boost Preprocessor do. If you ever heard PHP supposed to preprocess HTML, think again, think outside the box. PHP can conveniently convert from this...



#include <limits.h>

#define __IDENTITY_HASH_FUNC(s, n, i, x) (s[i < n ? n - 1 - i : 0] ^ x) * 17ull

<?php
    $max_iter = getenv("MAX_ITERATION");
    $last_iter = $max_iter - 1;

    echo "#define __IDENTITY_ITER_$last_iter(s, x, n) x\n";

    for ($i = $last_iter - 1; $i >= 0; $i--)
    {
        $next_iter = $i + 1;
        echo "#define __IDENTITY_ITER_$i(s, x, n) ($i < n ? __IDENTITY_HASH_FUNC(s, n, $i, __IDENTITY_ITER_$next_iter(s, x, n)) : x)\n";
    }
?>

#define IDENTITY(text) ((identity_t) /* */ __IDENTITY_ITER_0(text, 11ull, (sizeof text - 1)))

...to this



#include <limits.h>

#define __IDENTITY_HASH_FUNC(s, n, i, x) (s[i < n ? n - 1 - i : 0] ^ x) * 17ull

#define __IDENTITY_ITER_63(s, x, n) x
#define __IDENTITY_ITER_62(s, x, n) (62 < n ? __IDENTITY_HASH_FUNC(s, n, 62, __IDENTITY_ITER_63(s, x, n)) : x)
#define __IDENTITY_ITER_61(s, x, n) (61 < n ? __IDENTITY_HASH_FUNC(s, n, 61, __IDENTITY_ITER_62(s, x, n)) : x)
#define __IDENTITY_ITER_60(s, x, n) (60 < n ? __IDENTITY_HASH_FUNC(s, n, 60, __IDENTITY_ITER_61(s, x, n)) : x)
#define __IDENTITY_ITER_59(s, x, n) (59 < n ? __IDENTITY_HASH_FUNC(s, n, 59, __IDENTITY_ITER_60(s, x, n)) : x)
#define __IDENTITY_ITER_58(s, x, n) (58 < n ? __IDENTITY_HASH_FUNC(s, n, 58, __IDENTITY_ITER_59(s, x, n)) : x)
#define __IDENTITY_ITER_57(s, x, n) (57 < n ? __IDENTITY_HASH_FUNC(s, n, 57, __IDENTITY_ITER_58(s, x, n)) : x)
/* 55 Lines collapsed, imagine how long the code if this expanded! */
#define __IDENTITY_ITER_1(s, x, n) (1 < n ? __IDENTITY_HASH_FUNC(s, n, 1, __IDENTITY_ITER_2(s, x, n)) : x)
#define __IDENTITY_ITER_0(s, x, n) (0 < n ? __IDENTITY_HASH_FUNC(s, n, 0, __IDENTITY_ITER_1(s, x, n)) : x)

#define IDENTITY(text) ((identity_t) /* */ __IDENTITY_ITER_0(text, 11ull, (sizeof text - 1)))

It works! Finally!!

Also nice to mention that anyone can set the maximum input length by set the MAX_ITERATION environment variable. Customizable, no excessive copy-paste, easy revision.

Conclusion

That was a thrilling journey to be honest, just to make compile-time hash work. Anyway, you don't have to re-invent the wheel like what I did because I created a library:

identity.h

It's still not perfect unfortunately. If you can make it perfect, pull a request or open an issue. That would helps. Thank you for joining my journey down to the rabbit hole. See ya later 👋

Draw Canvas with JSX (or XML)

Athaariq Ardhiansyah — Mon, 15 Mar 2021 05:53:57 +0000

Hi folks!

I just figured out how to draw something on canvas almost like composing HTML DOM.

Why is this matter?

Well... let's see the comparison

Draw a single blue square

...and This is how it's made

Okay but what's the point? It didn't proof anything aside preventing canvas stretch issue!

Good question. Now see the real use case:

Draw complex shapes

Did you see that green circle logo? This is how you make it with canvas

Wow massive difference. But how we compose it programmatically without hurting performance much? Should we ditch Compodraw for that case?

Not necessarily, you can compose existing instructs by hands and let them handle context scoping + geometrical math stuffs. So you just focus on your logic. Here's the example:

Programmatical Composition

Did you see the shadow? you don't have to configure shadow manually. Instead, let Elevate instruct handle those rectangles' shadow. Here's the code:

Okay, "instruct" words just being written repeatedly. But what's the meaning of that?

Instruct is just a bunch of instruction for drawing (or giving effect to) shape. Imagine of having a lot of snippet for doing such thing and all you need to do is just use them and set properties for them. Then they will draw the shapes for you.

Instructs are modular. That means people can create their own a package of instructs and share it to community.

Here's the example of a package of instructs.

I want to try, how do I start?

On compodraw github repo, there is an installation procedure you can follow + some examples.

I hope this tool can help your project, happy hacking!

I Tried to Create HTML Alternative, Here's What Happened...

Athaariq Ardhiansyah — Thu, 12 Nov 2020 17:39:33 +0000

Hi Folks!

Most of you are familiar with "reinvent the wheel" right?
You know... Re-create something that used by a lot of people, like HTML.

Source: Alan O'Rourke

However, I ever wondered about NASA reinventing wheel for transportation at moon and Rover the Mars robot.

Source: NASA

In some cases, we have to create better alternative for specific purpose. If we remember back in time, Tim Berners-Lee created HTML as globally shareable linking document.

Fast-forward to current day, we still use HTML. Moreover, it's not only for sharing document, but online application!

We successfully bring app that used to be OS specific, into any modern devices. However, HTML core concept is document (like Microsoft Word) not UI layouting for apps. Thus, we have some drawbacks:

We stuck on top-to-bottom direction concept. No constraint layout like Android XML layout.
Thanks to CSS, we have position: absolute; and flexbox. However, CSS is mainly purposed for styling document not UI layout for app.
Yes, we can put something like Material Design (material.io provides CSS snippets). The question is: does CSS standard care about modern UI/UX design?

Please don't get me wrong. Assuming you understand Web and Android Development, try build a login screen without logic (javascript always easier btw) on both HTML+CSS and Android. Then tell me what you feel.

I'm an Android developer before. Since 2017, I learn myself to develop web-based application. At that time, I have no idea how the f*** I put a box exactly at the center.

I've tried text-align, grid, and even flexbox causing HTML body to oversize so it's no longer exactly at center (I wish I knew box-sizing back then).

The solution? use margin-top: 25%; and margin-left: 25%; with width and height are 50%.

Wait... Where is the "gravity"? Is this a joke?

Yeah I have no idea why CSS behaves like that back then. So I force myself to follow the flow, then get into realm of React and Vue, got a lot of fun with them.

At April 2020, I have a lot of spare time and I have intention to bring the "Android way" of UI layouting for apps to web development world.

So I decided to create FIWL

It tooks 6 months to work with. I spent almost every night, sleepless, only for making my idealism to reality.

At August 2020, it barely usable for public. Even though essential components are not in shape yet, anyone can try the concept on their own computer.

Then I share it to people at forums

No one get interested. Then what? well... I create a video tutorial.

To gain more attention, I share it to some communities at Discord.

Worse, everyone hate it.

These are what people said:

Don't be stupid, Thor.

Nobody want to start over again, it's not helpful by the way.

Lol it can't run minecraft

Imagine you did wrote thousands line of HTML CSS JS, will you ever re-write those again in different language? or at least API?

Enhance the wheel, don't reinvent it.

The last one hits me hard, very hard. I wasted my precious 6 months of coding for nobody.

Imagine if that time I spend with my friends to build helpful startup. I don't have to eat instant noodles every afternoon right now :(

So what about FIWL now?

I rather leave it as spare time project. However, if you found it useful, please let me know so I can maintain it better.

Anyway, thanks for being here. I want to say something for you:

Your time is more precious than any existing assets. Invest it in the best way, good luck!

Stop Using React? But Why??

Athaariq Ardhiansyah — Tue, 03 Nov 2020 04:11:45 +0000

I'm usually working with Vue but I also learn both React and Vue. They are awesome, those Single Page Application (SPA) framework solve my previously always-loading Multi Page Application (MPA) problem.

Then I see a post:

I laughed, very hard.

Then I grab a cup of coffee and questions myself why this kind of haters exist, why people says React is slow, bla bla bla...

So I did research about React's runtime performance. Hours of time spent, I figured out that it's not actually React's fault, it's because nature of SPA frameworks. I see mind opening comment:

...and Stack Overflow question:

If loading time is the main concern of SPA, why nobody created web server specialized for SPA? Is that hard to put whole compiled SPA build into RAM for faster access??

Then I realized something:

I'm a programmer, not a journalist.
I supposed to make something, not only question on something.

So I created Kuda Web Server

It's basically a web server, much like simple version of Nginx and Apache, but everything stored in RAM as illustrated below.

It just works 😁

Anyway, if you want to try yourself, you can go ahead to the repository

https://github.com/Thor-x86/kuda

Hope it helps, thanks!