Comments (16)
I'm 100% sure my code base is full of... emh, shit.
But anyway, I would expect to be able to see the charts? (to know the size of the parts of code etc)
from bundle-buddy.
@samccone I will quickly chime-in; I know Bundle Buddy is about duplication, but it also feels like your base UI could be easily adapted to be a better source-map-explorer
. I am glad I don't have dups, but dups is only one part in the path to lose weight. One tool to do it all (or at least more) would be nice, and it seems like you are close to that.
from bundle-buddy.
hey @montogeek, @susielu and I have been working up some ideas on how to do this and how to create a valuable viz for bundles.
Thanks for your interest! we will be sure to file some mocks when we arrive at something.
from bundle-buddy.
I would like to see this project become a better source-map-explorer
, maybe adding a flag or showing a source map visualization even if there is not duplication, this is too good to dont use it as a bundle analyzer/visualizer/explorer.
Any plans @samccone ? I would gladly help!
from bundle-buddy.
Hey all, here is the design document for the next addition to bundle-buddy
https://docs.google.com/document/d/1ycGVBJmwIVs34yhC0oTqv_WH5f0fs2SAFmzyTiBK99k/edit#
Comments and thoughts are welcome.
from bundle-buddy.
Hey @FezVrasta no bundle duplication is a good thing :) it means bundle buddy has nothing to really show you.
In this case what would you like bundle-buddy to show?
cc @susielu
from bundle-buddy.
Would you be able to share the repo w/us so we could use it as an example to test this case with?
from bundle-buddy.
related #25
from bundle-buddy.
nope unfortunately I can't share it 🙁
from bundle-buddy.
Hey @zdrummond I totally agree. This has been something @susielu and I have talked about tackling .. With the goal being to make bundle-buddy a one-stop-shop for exploring exactly is in your bundle.
Thanks!
from bundle-buddy.
Same here. I will try to create simple example, meantime I will explain. I have create-react-app application with following code:
import Loadable from "react-loadable";
const PhoneAsync = Loadable({
loader: () => import("react-phone-number-input"),
loading: () => <span>Loading the phone number</span>
});
webpack creates two files: main.js and chunk.js. Both of those files contain copy of ReactDOM because of this issue catamphetamine/react-phone-number-input#98 (or source-map-explorer is lying)
UPD: I'm not able to reproduce it anymore. Probably some kind of glitch in Webpack
from bundle-buddy.
Both of those files contain copy of ReactDOM because of this issue catamphetamine/react-phone-number-input#98
To clarify for others: this is not an issue of any sort.
react-dom
gets bundled anyway in a web browser.
from bundle-buddy.
yes this is an issue, It delivers two copies of of ReactDOM
from bundle-buddy.
yes this is an issue, It delivers two copies of of ReactDOM
this is an issue, but not the issue you reported.
it's an issue with your bundling process.
from bundle-buddy.
yes and this is issue tracker of the tool which is analyse bundler output, which should show issues of bundler.
from bundle-buddy.
Existing tools for understanding a single bundle
Add this to the list https://webpack.github.io/analyse
User questions
What introduced this dependency? Example: I see lodash.js in my bundle, but I haven't added it. It appears that LibX uses it, and LibX required by MobX.
Also, I wonder if it is possible to implement library which will recommend improvements like:
- use ES6 methods instead of lodash. See underdash, You-Dont-Know-Lodash-Underscore
- detect if packages have type signatures and recommend to use Google Closure Compiler in advanced mode. For example, there are a lot of type signatures in DefinetlyTyped repo, assume we can successfully convert from TypeScript to Closure JSDoc, then we can use advanced mode Closure and shake off more
- Detect if usebuiltins will win something
from bundle-buddy.
Related Issues (20)
- Hosting bundle-buddy and viewing stats using JSON file. HOT 6
- Missing "Synthetic" Async Bundles HOT 1
- CI integration: Add return code HOT 6
- Graph area too small, bundles fall outside of space and are unreachable HOT 2
- Why exit with status code 1 when no duplication is detected? HOT 3
- Invalid 302 redirect when attempting to load HOT 4
- A puzzling situation HOT 1
- The readme.md file looks like it might be incorrect HOT 1
- Error from Uncaught application error HOT 4
- Add esbuild support
- Uncaught TypeError: Cannot read property '0' of undefined HOT 1
- Static HTML report output
- Error from Uncaught application error
- Error from Uncaught application error
- Error from 0
- Error from stats.json HOT 1
- Compatibility issues with latest esbuild version HOT 1
- Distinguish color of filesize and module count
- /esbuild doesnt work on first load
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bundle-buddy.