Transcript

For a while now I've been trying to improve the way I program. I've made some progress. I can edit my programs live, and the tooling that enables it is not much code.

Here is the template I create new apps from. It starts out with something silly: every time I click with my mouse it draws a random rectangle.

Here is the code for this app.

There's not much right now, but it grows from here and in principle the app continues running as it evolves.

But debugging is still hard. It takes a long time to streamline my thinking about each new problem. I often print information to the terminal, and then struggle to visualize the text my program is printing. And if I draw debug information on the canvas, it competes for space with the app.

So I think I need new infrastructure. There are probably tools I could use that are too hard to build while deep in something else. One such tool is a windowing system. As my app runs it can dump things to other windows, and I can show them separately from my app.

Here's a window where it just prints text like I would otherwise send to the terminal.

Here's a window that plots what I draw to a 2D surface very like the app, except I can add instruments like these axes and dimensions.

The metaphor for the space is also different. My actions can have different meanings. Where the app uses mouse clicks to add new rectangles, here I can pan around.

Here's another view. This time I have some splits and multiple windows in them.

Each of these windows is a log I can scroll around in. But the stuff in the log is graphical. This one shows each rectangle drawn separately. This one focuses on just their positions, this one on just their dimensions. This one shows just widths, and this one just heights. All these windows have the same metaphor, and actions have similar meanings. But the data in them is different.

Finally, here's yet another debug view of this app. This time it's showing the sequence of actions in time rather than space, looping back when it reaches the end. I can also adjust the replay speed.

The code for this windowing system lives with my app, and this is all there is. I have some event handlers to choose from over here, and I can compose them together to create windows here. Then I compose layouts from the windows here. My app will grow downward and to the right, and lower level infrastructure will be easy to ignore above and to the left.

Hopefully this infrastructure will be helpful the next time I dig myself into a hole. It's easier now to create new places to draw debug information.

This post is part of my Freewheeling Apps Devlog.

Comments gratefully appreciated. Please send them to me by any method of your choice and I'll include them here.