Programming as Art

I consider programming computers a form of artistic expression. There are many ways to solve everyday programming problems, which leaves plenty of room for creativity.

Classic Examples of Generative Art

And there are many interesting examples of computer-generated art. My favorites are the “one-liners”, programs of just a single line that do interesting things, like the famous 10 PRINT CHR$ (205.5 + RND (1)); : GOTO 10 that draws a maze using BASIC, and the more modern equivalent yes 'c=(╱ ╲);printf ${c[RANDOM%2]}'|bash written in Bash. A quick search on the internet will turn up several implementations in different languages.

Rediscovering Generative Art

Even though I like the concept, I ended up setting generative art aside for a long time, focusing more on the utilitarian side of my code. But recently I decided to give the HTML, CSS, and JavaScript trio another chance, and I started writing some code to make my site a little less barren.

JavaScript and the Evolution of Browsers

The result is that, in a short time, I created several toy programs that generate interesting visual effects. I’m using most of them to put something on the sides of the site when the screen is too wide. What I find interesting is that JavaScript and browsers have evolved quite a bit. Don’t get me wrong, JavaScript is still a terrible language, but it’s present on virtually every modern computer and, with some care, you can write more or less decent code with it.

• JavaScript is the new BASIC: it’s present on every computer, it’s very easy to start programming with, and nobody likes it (except the people who only know JavaScript).

Simplicity and Code Independence

I’ve always tried to limit my code to avoid external dependencies such as third-party libraries or overly complex environments that I don’t control. Of course, this often isn’t possible, but it’s worth keeping in mind while developing. Keeping things simple makes your life easier down the road.

But when it comes to generative art, I’m even more radical: the code has to be small, self-contained, and free of any external resources. These limitations serve several purposes, from making the code more challenging to write to making your work easy to reproduce and reuse.

Performance Considerations

You also need to be careful about resource usage. In my first experiments, code that ran perfectly on my machine struggled to run on more modest ones.

For continuous drawing, I’m making heavy use of the requestAnimationFrame function, which tries to hit 60 FPS but stops drawing if the user switches to another tab, for example, thereby saving a lot of resources. It’s also important to make sure the function called by requestAnimationFrame is light and fast. Finally, if you’re going to replace the drawing function, it’s very important to remove the previous instance using cancelAnimationFrame, otherwise your code’s performance will degrade quickly.

Trying to keep the code efficient and simple has been an interesting experience. Avoiding processing and reallocation has always led me to learn a few new techniques. For example, in the Matrix-style falling letters effect, to erase the previous letters as new ones appear, it’s far more efficient to cover everything with a semi-transparent image in the background color. That way the alpha keeps accumulating and, slowly, the letters fade until they disappear. This is much more efficient than trying to keep the state of each letter and processing every one of them over and over again.

Conclusion

Exploring generative art has been a rewarding journey, letting me combine programming and creativity. Despite the challenges, it’s exciting to see what you can achieve with simple, efficient code.