I've always wanted a tool that can create a flowchart from the flow control of a piece of code. Ideally it would be bidirectional - you could drag and drop things in the flowchart and the text sourcecode would change, and vice versa. There are a million tools that do this with object or class diagrams, but I've never seen one that does it with imperative flow control code (if/then, switch/case, while & for loops, etc.).
I'm months away from a soft launch but I'm building language and environment for declarative, functional programs with a graph-reduction computation model -- basically instead of typing code that gets parsed into an AST you just write the AST
Nodes of the graph re-write themselves as soon as their prerequisites are fulfilled (Kind of an event-driven graph reduction)
I've been dreaming up all kinds of things you can do once your program is emitting 'change' events -- I want to do webGL trees (like the kind made of wood) that update themselves with the state of the graph, and let people program their own sounds for each kind of event -- you could listen to how quickly a program is running, hear how many things are coming off the stack.
If you listened to it every time, you would hear when something changed.
Ultimately my goal is to make source-code more curiosity-inducing, to make the computation of user requests kind of always-present, in the background (like the whirring and grunts of the old machines in Engelbart's mother-of-all-demos, cleverly mic'd by Stewart Brand so the audience could hear the machine at work, tho it was miles away), and then when a user actually looks at the code, they're greeted with something they might eventually intuit by hacking around with it. You could pause and back up and edit the state and replay, such that the IDE is always in debug mode -- hopefully with some groovy sounds and visuals.
I have a very rough draft with mock up gifs at https://lookalive.software if you'd be inclined to give any first impressions
Interesting! This way of structuring & evaluating a program seems analogous to how spreadsheets work, but with a hierarchical instead of a tabular data model. I could see it being helpful to new programmers for building intuition about how code works.
And translating a program's execution into sound and being able to hear changes sounds really fun.
Awesome! (For some reason, the demo gif doesn't display for me in Safari, but I can see it in Chrome/Firefox.)
I feel like this sort of thing could really be an essential tool in teaching programming. I've been working on a somewhat similar project for visualizing execution of javascript code (but it works by instrumenting the code, rather than interfacing with a debugger, so that it can all be done in the browser), which I'm hoping to release soon.
Could you check if the issue with the demo has been fixed? GitHub's image host doesn't support WebP (which I use for better quality at a smaller size), so I've moved it to my own server where the MIME type should be correct.
Your interactive project sounds interesting, let us know when it's out :)
It still won't display in Safari. I wasn't familiar with WebP but it sounds like maybe Safari just doesn't support that format at all: https://caniuse.com/#search=WebP
This could be a simple / cheap way to get a time-travelling debugger. Run your code through vardbg generating a video. If that run results in unexpected behaviour then you can step back and forward through the video and see where things went wrong.
I like it. Anything that helps programmers to more quickly understand code is a potential move forward. ( I think it'd be best to have a variety of such tools available, to suit different learning styles.)
24 comments
[ 3.4 ms ] story [ 67.1 ms ] threadNice job!
Does anyone know of anything similar for PHP?
Nodes of the graph re-write themselves as soon as their prerequisites are fulfilled (Kind of an event-driven graph reduction)
I've been dreaming up all kinds of things you can do once your program is emitting 'change' events -- I want to do webGL trees (like the kind made of wood) that update themselves with the state of the graph, and let people program their own sounds for each kind of event -- you could listen to how quickly a program is running, hear how many things are coming off the stack.
If you listened to it every time, you would hear when something changed.
Ultimately my goal is to make source-code more curiosity-inducing, to make the computation of user requests kind of always-present, in the background (like the whirring and grunts of the old machines in Engelbart's mother-of-all-demos, cleverly mic'd by Stewart Brand so the audience could hear the machine at work, tho it was miles away), and then when a user actually looks at the code, they're greeted with something they might eventually intuit by hacking around with it. You could pause and back up and edit the state and replay, such that the IDE is always in debug mode -- hopefully with some groovy sounds and visuals.
I have a very rough draft with mock up gifs at https://lookalive.software if you'd be inclined to give any first impressions
And translating a program's execution into sound and being able to hear changes sounds really fun.
I feel like this sort of thing could really be an essential tool in teaching programming. I've been working on a somewhat similar project for visualizing execution of javascript code (but it works by instrumenting the code, rather than interfacing with a debugger, so that it can all be done in the browser), which I'm hoping to release soon.
It's actually an incorrectly named .webp file that's why.
Your interactive project sounds interesting, let us know when it's out :)
However, you could use RevPDB: https://morepypy.blogspot.com/2016/07/reverse-debugging-for-...
https://m.imgur.com/atQnWj6
Kudos to the author.