danvk / source-map-explorer

Analyze and debug space usage through source maps
Apache License 2.0
3.83k stars 101 forks source link

Support exploring things other than source maps #135

Closed danvk closed 1 year ago

danvk commented 5 years ago

I was wondering what what the major contributors to the size of a JSON file were today and thought it might be nice to visualize with a tree map!

This would obviously be a big change, but there are many things that could reasonably be visualized with tree maps:

@nikolay-borzov, thoughts?

danvk commented 5 years ago

I think the way to do this would be to specify the --json output format of source-map-explorer and have a separate tool that reads that in and visualizes it.

nikolay-borzov commented 5 years ago

Could you provide an example what do you mean by contributors to JSON file size? Is JSON file somewhat bundled? I thought if a JSON is referenced within Webpack project it ends up inside a bundle and can be handled my current functionality.

danvk commented 5 years ago

Sorry, I mean within a single JSON file. For example, I have a 50MB GeoJSON file. I'd like to know which is using more space: the geometries (coordinates) or properties? And within the properties, is it the keys? The values? A specific property? A tree map is a great way to answer this question.

nikolay-borzov commented 5 years ago

I think it should be a separate utility. I can't imagine how we can leverage most of the existing source-map-explorer code. Perhaps we can extract visualization logic into separate package

danvk commented 5 years ago

Right, the idea is that source-map-explorer currently does two things:

  1. Figures out how many bytes of your JS file came from each source file.
  2. Visualizes a hierarchy of things with sizes.

You can do the first without the second (--json) but not the other way around, and I think there are uses for that. I'll think about what a good structure might be.

danvk commented 1 year ago

I built this out as a separate utility a few years ago: https://github.com/danvk/webtreemap