Cool! I wrote something on the same spirit but for Clojure, called FlowStorm http://www.flow-storm.org/

For instrumentation, instead of an instrumenting agent it uses a fork of the official Clojure compiler (in Clojure you can easily swap compilers at dev) that adds extra bytecode. What is interesting about recording Clojure programs execution is that most values are immutable, so you can snapshot them by just retaining the pointers.

Edit: Since the OP demo is about exploring a web app for people interested in this topics I'm leaving a demo of FlowStorm debugging a web app also https://www.youtube.com/watch?v=h8AFpZkAwPo

This is incredibly cool.

I love how good the tooling is in the java/jvm ecosystem. Last time I was this blown away was with jitwatch ( https://github.com/AdoptOpenJDK/jitwatch )

FlowTracker reminds me a little of taint analysis, which is used for tracking unvalidated user inputs or secrets through a program, making sure it is not leaked or used without validation.

search keywords are "dynamic taint tracking/analysis"

https://github.com/gmu-swe/phosphor

https://github.com/soot-oss/SootUp

https://github.com/feliam/klee-taint

Blown away by the demo tracking an HTML element back to the SQL statement that added that value to the database.

I can totally see a future where tools like this are the first line of defense when troubleshooting bugs.

I am not really sure if I get the full picture and how it might be used - but it somehow reminds me of a Smalltalk environment where I can also inspect everything (all are objects and messages and you can trace back and interact with it those).

Very cool! I love the demo video and I could definitely see how this would be useful when diving into an unfamiliar codebase.

Years ago I experimented[1] with a similar concept (wanting something like JavaScript source maps, but for HTML). I didn't manage to find the time to expand on it, but I think web developer tooling would really benefit from this sort of full-stack attribution.

Integration of any solution like this into existing frameworks feels like a big challenge.

[1] HTML Source Maps - https://github.com/connorjclark/html-source-maps https://docs.google.com/document/d/19XYWiPL9h9vA6QcOrGV9Nfkr...

This reminds me (in the best way possible) of the Eve-lang demos of debugging a program by simply asking "why is <the UI element> not here?" Fantastic work!

https://www.youtube.com/watch?v=TWAMr72VaaU&t=164s and https://witheve.com/

If I recall there was a paper on a similar tool that was used for finding SQL-injections dynamically in java programs. Is this the same tool?

Once I had the vision to track data over the internet, like where came the image from, on which cdn was it. Or "what did this string have seen from creation till it reached my screen". This is a step into this direction.

Thanks for this!

Been trying to get this work with VSCode with a project I'm trying to make sense of. Having to take a pause on it right now, but looking forward to getting it working and playing with it.

This is awesome! Reminds me of Java flight recorder!

This looks really cool, I think this could have saved me some time hunting bugs when I was working with Spring in the past.

This is pretty cool! Do you think something similar is possible for c#, too?

That is really cool, really like that there's a browser demo too

Hmm would love to connect this to our gralde builds :)

Very very impressive.

Very impressive!

[flagged]