5 ms·

Visualizing Code to Fail Faster

117 points by dko 15y ago

lubutu 15y ago
Something I would love to have is a debugger for an interpreted language which visualises the program's state as a graph, say, and you can wind time forward and back. Then, as you make changes to the code the visualisation updates according to what the program's state would have been at this point in the program had it been running the updated code. To me that would feel like magic.
- anamax 15y ago
  > Something I would love to have is a debugger for an interpreted language which visualises the program's state as a graph, say, and you can wind time forward and back. see "debugging backwards in time" by Bil Lewis (yes, one "L" in each word.) http://www.lambdacs.com/debugger/AADEBUG_Mar_03.pdf http://www.lambdacs.com/debugger/AADEBUG_Mar_03.pdf
  - kaens 15y ago
    He gave a talk at google on the subject, it's a great watch: http://video.google.com/videoplay?docid=3897010229726822034 http://video.google.com/videoplay?docid=3897010229726822034
- JoachimSchipper 15y ago
  gdb does this: http://sourceware.org/gdb/news/reversible.html http://sourceware.org/gdb/news/reversible.html, http://sourceware.org/gdb/onlinedocs/gdb/Checkpoint_002fRestart.html http://sourceware.org/gdb/onlinedocs/gdb/Checkpoint_002fRest... (Linux-only, so I've never used those features.) Slapping a nicer interface on it is left as an exercise to the reader. ;-)
  - deleted 15y ago
    [deleted]
- vdm 15y ago
  In Python: http://people.csail.mit.edu/pgbovine/python/ http://people.csail.mit.edu/pgbovine/python/
- sp332 15y ago
  This actually exists in the IDE for Inform7, a DSL for writing interactive fiction (text adventure) games. The feature is called "Skein", and it will graph all your playtests, and highlight in red which ones changed after you change your code. You can see it at 6:20 in this video: http://vimeo.com/4221277 http://vimeo.com/4221277 Inform 7 is just awesome in general. The source code reads like English. Here's a code snippet: http://inform7.com/learn/eg/dm/source_14.html http://inform7.com/learn/eg/dm/source_14.html
szx 15y ago
Am I the only one who feels like the game demo was so awesome that it overshadowed some of the other parts of the presentation, parts that were just as interesting yet probably more feasible? I would kill to have just the algorithm evaluator part become reality.
- unimpressive 15y ago
  No, your not. Personally I think that on a much more practical level the algorithm evaluator would be a godsend. The animation app and the braid demo just seemed too narrow in their application to really be useful in the real world. The algorithm visualizer? I want it; now. It hurts to do code in my head after seeing that, to the point where I almost abandon hope and try to implement it.
karol 15y ago
You've got to have big ego to write, that Bret Victor's innovative ideas are not "entirely abstract art house visualization nonsense". BV's demos set the direction in which the whole field of working with ideas, including designers and programmers should be going. In 2012 programmers shouldn't have to be really good at running the code in their heads while writing it.
- vdm 15y ago
  +1. I think many people feel threatened by these ideas, and the potential to open up programming to a whole cadre of non-professionals who won't need them. The opportunity is that the professionals get/have to work on Real Problems.
haberman 15y ago
This is why it's so shortsighted to say things like: "computers are so fast nowadays that everyone should be using GC/dynamic-typing/etc." A person who says this is limiting their thinking to the way we do things now. Parsers may not be on the critical path of most compilers, but if you could run a parser/linter/static-analyzer on every keystroke, you could start doing things that weren't even possible before. We'll always be able to find ways to use extra CPU cycles to make things more pleasant to use. We'll add more pixels or decrease response times or do deeper or more frequent analysis. There will never be a time when computers are "fast enough" that low level languages and programming for performance become obsolete.
- deleted 15y ago
  [deleted]
- gaius 15y ago
  We'll always be able to find ways to use extra CPU cycles to make things more pleasant to use. That kind of thinking gave us Eclipse.
  - vdm 15y ago
    It's also breaking up our monolithic compilers, giving us incremental, modular Compiler As A Service, which is where the code annotations and feedback will ultimately come from. Microsoft is leading the way. http://msdn.microsoft.com/en-us/roslyn http://msdn.microsoft.com/en-us/roslyn And Clojure looks promising. http://blog.fogus.me/2012/03/27/compiling-clojure-to-javascript-pt-3-the-himera-model/ http://blog.fogus.me/2012/03/27/compiling-clojure-to-javascr...
  - haberman 15y ago
    I must have been unclear, because Eclipse is exactly what I am arguing against. The developers of Eclipse made a choice to write Eclipse in Java. Java is a language that trades performance for developer productivity with features like memory safety, garbage collection, and machine-independent byte-code. Though I wasn't there, I would suspect the rationale for this choice is that computers are "fast enough" that this tradeoff is worth it. The choice to use Java instead of C++ favored the productivity of the Eclipse developers over the run-time performance of Eclipse, and the effects of this choice are so painful that Eclipse has become the poster child of a sluggish desktop app. What I am arguing for is the idea that computers aren't "fast enough" to make compromises like this. Data-intensive applications will continue to be written in low-level languages. Even if a higher-level language could provide basic functionality that is "fast enough," a lower-level language will free up CPU resources that can be spent making the application even more compelling to the end-user. I hope this makes it clear why Eclipse is the antithesis of what I believe.
siavosh 15y ago
A tangent, but I like the fact that more and more people are seeing BV's video and getting inspired by it. It's made a big impact for me, and I'm seing a steady stream of folks referencing it almost a month after it was given. What is just as interesting is that I've also heard incredibly negative reactions to his talk, which is also telling.
- haberman 15y ago
  Wow, what do the negative reactions say?
  - siavosh 15y ago
    Maybe it was an outlier, but a friend had a visceral reaction against the design aesthetics of his demos and thought the principle examples he gave were depressing. Overall, since I've evangelized in my humble ways the message from the talk, I've learned that not everyone believes that a principle based approach is the ideal path. Some are interested in solving hard problems for the sake of solving them, and others are interested in making lots of money. Nothing inherently wrong with either, but still a bit surprising for some reason.
  - deleted 15y ago
    [deleted]
  - forrestthewoods 15y ago
    I was disappointed by the lack of practicality in a lot of the presentation. In some ways there was more flash the substance. The ghost image/time rewind isn't realistic for any real game development. The movie making ipad app was a neat toy but totally impractical in a professional environment. That said it was a great presentation because showing that flash gets the brain gears turning on realistic ways to increase iteration times.
    - enjalot 15y ago
      I like how your handle reminds me of "forest for the trees" as it's pretty appropriate ;) Really though, disappointed? These are prototypes for the next generation of interaction, most people aren't even close to doing just one of the 5 ground breaking ideas he presented, and you expect him to release fully baked products?
poundy 15y ago
Is this editor available publicly? Can I download it and use it for my Javascript coding sessions?
- enjalot 15y ago
  Unfortunately I don't think so, but some people are working on the different pieces: http://gabrielflor.it/water http://gabrielflor.it/water I'm working on making it easier to share discoveries by powering the water project with a gist backend: http://enjalot.com/tributary/2165875/sinwaves.js http://enjalot.com/tributary/2165875/sinwaves.js So many genius ideas in the first 15 minutes of that talk... people will be working for years to realize these things!
- no_gravity 15y ago
  Here is my take on it: http://www.gibney.org/calculator http://www.gibney.org/calculator You type javascript on the left and get the result on the right. I use it myself all the time. You can type js right away or try the examples on the bottom to get a feeling for what its doing.
  - dubya 15y ago
    This is pretty nice. I wonder how hard it would be to import a minimal stats package. That and a table entry widget would make this a superb environment for a 1 semester probability and stats class.
- vdm 15y ago
  Clojurescript proof of concept. http://www.chris-granger.com/2012/02/26/connecting-to-your-creation/ http://www.chris-granger.com/2012/02/26/connecting-to-your-c...
gfodor 15y ago
Better to just link to Bret's work than some commentary that doesn't add much to the conversation. http://worrydream.com/ http://worrydream.com/
- vdm 15y ago
  This comment adds the least to the conversation; why is it at the top?
ylem 15y ago
I think this also has applicability to other domains where quick iterations can be extremely useful--for example, testing data modelling--unfortunately, a lot of codes are too computationally expensive to run in such an interactive fashion...
pella 15y ago
canvas demo from Tobias Nurmiranta http://tnlogy.github.com/tnlogy/ http://tnlogy.github.com/tnlogy/ ( over the number CTRL + Left Click )
- pella 15y ago
  similar demo: http://enjalot.com/tributary/2165875/sinwaves.js http://enjalot.com/tributary/2165875/sinwaves.js http://gabrielflor.it/water http://gabrielflor.it/water
- pella 15y ago
  http://danielchasehooper.github.com/CodeBook/ http://danielchasehooper.github.com/CodeBook/
- vdm 15y ago
  That combines instant preview with a playhead slider for undo. https://github.com/tnlogy/live-coding https://github.com/tnlogy/live-coding (not linked from the demo)
vdm 15y ago
The game demo Bret uses is based on time mechanic concepts developed in the 2009 game Braid by Jonathan Blow. I am not a gamer but I downloaded the game over the weekend because of the talk, and highly recommend it, it's a real work of art with serious production values, and easy to download for Windows, Mac and Linux. http://en.wikipedia.org/wiki/Braid_(video_game) http://en.wikipedia.org/wiki/Braid_(video_game) http://braid-game.com/ http://braid-game.com/ It is very inspiring to see such creativity and the courage to express it from people like Jonathan and Bret.
zdwalter 15y ago
I build an interactive javascript learning website. http://learnjs.info http://learnjs.info tries to help see how code runs and fails
swalsh 15y ago
Well here's one of those videos that will truly change the way you think.

117 points by dko 15y ago

Something I would love to have is a debugger for an interpreted language which visualises the program's state as a graph, say, and you can wind time forward and back. Then, as you make changes to the code the visualisation updates according to what the program's state would have been at this point in the program had it been running the updated code. To me that would feel like magic.

anamax 15y ago
> Something I would love to have is a debugger for an interpreted language which visualises the program's state as a graph, say, and you can wind time forward and back. see "debugging backwards in time" by Bil Lewis (yes, one "L" in each word.) http://www.lambdacs.com/debugger/AADEBUG_Mar_03.pdf http://www.lambdacs.com/debugger/AADEBUG_Mar_03.pdf
- kaens 15y ago
  He gave a talk at google on the subject, it's a great watch: http://video.google.com/videoplay?docid=3897010229726822034 http://video.google.com/videoplay?docid=3897010229726822034
JoachimSchipper 15y ago
gdb does this: http://sourceware.org/gdb/news/reversible.html http://sourceware.org/gdb/news/reversible.html, http://sourceware.org/gdb/onlinedocs/gdb/Checkpoint_002fRestart.html http://sourceware.org/gdb/onlinedocs/gdb/Checkpoint_002fRest... (Linux-only, so I've never used those features.) Slapping a nicer interface on it is left as an exercise to the reader. ;-)
- deleted 15y ago
  [deleted]
vdm 15y ago
In Python: http://people.csail.mit.edu/pgbovine/python/ http://people.csail.mit.edu/pgbovine/python/
sp332 15y ago
This actually exists in the IDE for Inform7, a DSL for writing interactive fiction (text adventure) games. The feature is called "Skein", and it will graph all your playtests, and highlight in red which ones changed after you change your code. You can see it at 6:20 in this video: http://vimeo.com/4221277 http://vimeo.com/4221277 Inform 7 is just awesome in general. The source code reads like English. Here's a code snippet: http://inform7.com/learn/eg/dm/source_14.html http://inform7.com/learn/eg/dm/source_14.html

szx 15y ago

Am I the only one who feels like the game demo was so awesome that it overshadowed some of the other parts of the presentation, parts that were just as interesting yet probably more feasible? I would kill to have just the algorithm evaluator part become reality.

unimpressive 15y ago
No, your not. Personally I think that on a much more practical level the algorithm evaluator would be a godsend. The animation app and the braid demo just seemed too narrow in their application to really be useful in the real world. The algorithm visualizer? I want it; now. It hurts to do code in my head after seeing that, to the point where I almost abandon hope and try to implement it.

karol 15y ago

You've got to have big ego to write, that Bret Victor's innovative ideas are not "entirely abstract art house visualization nonsense". BV's demos set the direction in which the whole field of working with ideas, including designers and programmers should be going. In 2012 programmers shouldn't have to be really good at running the code in their heads while writing it.

vdm 15y ago
+1. I think many people feel threatened by these ideas, and the potential to open up programming to a whole cadre of non-professionals who won't need them. The opportunity is that the professionals get/have to work on Real Problems.

haberman 15y ago

This is why it's so shortsighted to say things like: "computers are so fast nowadays that everyone should be using GC/dynamic-typing/etc." A person who says this is limiting their thinking to the way we do things now. Parsers may not be on the critical path of most compilers, but if you could run a parser/linter/static-analyzer on every keystroke, you could start doing things that weren't even possible before. We'll always be able to find ways to use extra CPU cycles to make things more pleasant to use. We'll add more pixels or decrease response times or do deeper or more frequent analysis. There will never be a time when computers are "fast enough" that low level languages and programming for performance become obsolete.

deleted 15y ago
[deleted]
gaius 15y ago
We'll always be able to find ways to use extra CPU cycles to make things more pleasant to use. That kind of thinking gave us Eclipse.
- vdm 15y ago
  It's also breaking up our monolithic compilers, giving us incremental, modular Compiler As A Service, which is where the code annotations and feedback will ultimately come from. Microsoft is leading the way. http://msdn.microsoft.com/en-us/roslyn http://msdn.microsoft.com/en-us/roslyn And Clojure looks promising. http://blog.fogus.me/2012/03/27/compiling-clojure-to-javascript-pt-3-the-himera-model/ http://blog.fogus.me/2012/03/27/compiling-clojure-to-javascr...
- haberman 15y ago
  I must have been unclear, because Eclipse is exactly what I am arguing against. The developers of Eclipse made a choice to write Eclipse in Java. Java is a language that trades performance for developer productivity with features like memory safety, garbage collection, and machine-independent byte-code. Though I wasn't there, I would suspect the rationale for this choice is that computers are "fast enough" that this tradeoff is worth it. The choice to use Java instead of C++ favored the productivity of the Eclipse developers over the run-time performance of Eclipse, and the effects of this choice are so painful that Eclipse has become the poster child of a sluggish desktop app. What I am arguing for is the idea that computers aren't "fast enough" to make compromises like this. Data-intensive applications will continue to be written in low-level languages. Even if a higher-level language could provide basic functionality that is "fast enough," a lower-level language will free up CPU resources that can be spent making the application even more compelling to the end-user. I hope this makes it clear why Eclipse is the antithesis of what I believe.

siavosh 15y ago

A tangent, but I like the fact that more and more people are seeing BV's video and getting inspired by it. It's made a big impact for me, and I'm seing a steady stream of folks referencing it almost a month after it was given. What is just as interesting is that I've also heard incredibly negative reactions to his talk, which is also telling.

haberman 15y ago
Wow, what do the negative reactions say?
- siavosh 15y ago
  Maybe it was an outlier, but a friend had a visceral reaction against the design aesthetics of his demos and thought the principle examples he gave were depressing. Overall, since I've evangelized in my humble ways the message from the talk, I've learned that not everyone believes that a principle based approach is the ideal path. Some are interested in solving hard problems for the sake of solving them, and others are interested in making lots of money. Nothing inherently wrong with either, but still a bit surprising for some reason.
- deleted 15y ago
  [deleted]
- forrestthewoods 15y ago
  I was disappointed by the lack of practicality in a lot of the presentation. In some ways there was more flash the substance. The ghost image/time rewind isn't realistic for any real game development. The movie making ipad app was a neat toy but totally impractical in a professional environment. That said it was a great presentation because showing that flash gets the brain gears turning on realistic ways to increase iteration times.
  - enjalot 15y ago
    I like how your handle reminds me of "forest for the trees" as it's pretty appropriate ;) Really though, disappointed? These are prototypes for the next generation of interaction, most people aren't even close to doing just one of the 5 ground breaking ideas he presented, and you expect him to release fully baked products?

poundy 15y ago

Is this editor available publicly? Can I download it and use it for my Javascript coding sessions?

enjalot 15y ago
Unfortunately I don't think so, but some people are working on the different pieces: http://gabrielflor.it/water http://gabrielflor.it/water I'm working on making it easier to share discoveries by powering the water project with a gist backend: http://enjalot.com/tributary/2165875/sinwaves.js http://enjalot.com/tributary/2165875/sinwaves.js So many genius ideas in the first 15 minutes of that talk... people will be working for years to realize these things!
no_gravity 15y ago
Here is my take on it: http://www.gibney.org/calculator http://www.gibney.org/calculator You type javascript on the left and get the result on the right. I use it myself all the time. You can type js right away or try the examples on the bottom to get a feeling for what its doing.
- dubya 15y ago
  This is pretty nice. I wonder how hard it would be to import a minimal stats package. That and a table entry widget would make this a superb environment for a 1 semester probability and stats class.
vdm 15y ago
Clojurescript proof of concept. http://www.chris-granger.com/2012/02/26/connecting-to-your-creation/ http://www.chris-granger.com/2012/02/26/connecting-to-your-c...

gfodor 15y ago

Better to just link to Bret's work than some commentary that doesn't add much to the conversation. http://worrydream.com/ http://worrydream.com/

vdm 15y ago
This comment adds the least to the conversation; why is it at the top?

ylem 15y ago

I think this also has applicability to other domains where quick iterations can be extremely useful--for example, testing data modelling--unfortunately, a lot of codes are too computationally expensive to run in such an interactive fashion...

pella 15y ago

canvas demo from Tobias Nurmiranta http://tnlogy.github.com/tnlogy/ http://tnlogy.github.com/tnlogy/ ( over the number CTRL + Left Click )

pella 15y ago
similar demo: http://enjalot.com/tributary/2165875/sinwaves.js http://enjalot.com/tributary/2165875/sinwaves.js http://gabrielflor.it/water http://gabrielflor.it/water
pella 15y ago
http://danielchasehooper.github.com/CodeBook/ http://danielchasehooper.github.com/CodeBook/
vdm 15y ago
That combines instant preview with a playhead slider for undo. https://github.com/tnlogy/live-coding https://github.com/tnlogy/live-coding (not linked from the demo)

vdm 15y ago

The game demo Bret uses is based on time mechanic concepts developed in the 2009 game Braid by Jonathan Blow. I am not a gamer but I downloaded the game over the weekend because of the talk, and highly recommend it, it's a real work of art with serious production values, and easy to download for Windows, Mac and Linux. http://en.wikipedia.org/wiki/Braid_(video_game) http://en.wikipedia.org/wiki/Braid_(video_game) http://braid-game.com/ http://braid-game.com/ It is very inspiring to see such creativity and the courage to express it from people like Jonathan and Bret.

zdwalter 15y ago

I build an interactive javascript learning website. http://learnjs.info http://learnjs.info tries to help see how code runs and fails

swalsh 15y ago

Well here's one of those videos that will truly change the way you think.