Hacker News new | past | comments | ask | show | jobs | submit login
Show HN: Hosted JavaScript dependency tree graphs for GitHub READMEs (github.com/fiatjaf)
56 points by fiatjaf on July 11, 2017 | hide | past | favorite | 6 comments



Nice one.

Glitch (the hosting service) is returning 504 errors, but it's easy to run it locally:

    cd /tmp
    git clone https://github.com/fiatjaf/node-dependencies-view.git
    cd node-dependencies-view/
    npm install
    npm start
Then in the browser

    http://localhost:3000/username/repoName
Feedback:

* In repos containing many modules, the svg is really too wide, even when decreasing ratio to 0.1. A more space-efficient layout could possibly be found. Vertical instead of horizontal, perhaps?

* Fails to render anything whenever a module is not found (e.g. `require('./params')`). Proper fallback may be implemented.


Thank you for the feedback and run instructions.

I don't know how to make Graphviz reorganize the nodes in a more vertical ratio. If you set the "ratio" parameter to, say, 0.5, or 1, it will output a very vertical graph, but at the expense of really small letters. I have to dig more into http://www.graphviz.org/Documentation/dotguide.pdf


I recently came across a neat graph project, which could help you solve part of the problem. https://github.com/fogleman/GraphLayout via https://www.michaelfogleman.com/


Looks like:

    graph [rankdir = "LR"]
I often skim the Gallery looking for an example that roughly like something I want and then click to view its source. In this case this one seems left to right:

http://graphviz.org/content/psg


Question: How is your approach better than just recursively traversing package.json files? Seems like you're downloading a lot of stuff onto your server when you could keep it all in the client.


I'm not recursively traversing package.json, just making a graph out of a single repository. External packages are only referenced by name, not on their internals.

Reading the whole repository has the advantage of making links between files in that same repository visible, instead just an opaque mass of packages depending on packages.

Also, recursively fetching thousands of package.json files will sometimes (most times, I would argue) be more resource-intensive than just downloading a single repo.

Finally, it's been done on the server because that way the generated image can be placed on GitHub's README.md.




Consider applying for YC's Spring batch! Applications are open till Feb 11.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: