JSCity – JavaScript code visualizations using Three.js | Hacker News Reader

JSCity – JavaScript code visualizations using Three.js

github.com

129 pointsbhjs17 comments

It's unfortunate that the author has chosen to wait with giving access to the source code, insisting that it still needs to be "cleaned up".

I can understand the reasons (in most cases it seems to be vanity), but it would often be best to just give access and clearly mark it 'work in progress'. Open source miracles may happen.

What are "open source miracles" for early-developed project?

The problem is most people just criticise/tear-down instead of actually improving open-source projects (just read the Show HN section here...). Building open source projects requires a positive attitude and early stage comments can be discouraging.

Cool to see isomer[0] on here :) Does the visualization mean I'm doing good? Haha - lots of similar-sized buildings, which may suggest it's too modular.

[0]: http://jdan.github.io/isomer/

As design patterns go, optimizing your code library so that it makes a more visually appealing virtual city seems like a bad one.

I wonder if it would be feasible to represent 'traffic' in a 3D code visualization city, representing data movement in a concurrent program. A 'car' would represent a function application such as a dynamic memory operation (there would be a heap building) or of a classes instance member, and it would transport function arguments/instructions/data from one building (class) to the next. Of course, just like in debugging, the only way to get traffic data would be to get a trace of a certain time period of a programs execution.

Of course in concurrent programming, data races can happen within these function applications as well. I can't think of a good way right now to visualize execution within in a function.

Most software starts as a small shed, and ends up as a skyscraper... but with that shed still being the foundation of the scraper.

It would be nice if that could be visualized here :)

Before I read the details I figured it was a picture of number lines committed per contributor. With tall monoliths being single contributor projects, and urban sprawls being multi committer projects. Now, I wonder what that visualization would look like for all these different projects.

To push the metaphor further, one could animate the evolution of the buildings over time based on git history.

Very interesting! JavaScript powering the visualization of JavaScript.

It's meta all the way down.

It would be cool to see a JSCity of JSCity itself on that page.

aside from looking great - what does this tool give us?

A quick visual overview of how complex a codebase is

Only if the author chose to encode the complexity using the same organizational units as picked by this visualization. Backbone is a good example who's complexity is opaque to this visualization.

I cannot imagine someone on a dev meetup saying "we ended up choosing knockoutjs and backbone over angular because their models were more visually appealing than angular's city model" .. this is what I mean when I ask "what do I get out of this?"

The satisfaction of flying an airplane into jQuery.

Reply on news.ycombinator.com