Angular Bundle Analyzer CLI Tool
Creating optimized Angular applications is crucial for performance and user experience. A bundle analyzer helps visualize the contents of your Angular application's bundle, identifying large dependencies and potential areas for optimization (e.g., unused code, inefficient imports). This challenge asks you to build a simple command-line interface (CLI) tool that analyzes an Angular bundle and outputs a summary of its contents.
Problem Description
You are tasked with creating a TypeScript-based CLI tool that takes an Angular bundle file as input and provides a summary of its contents. The tool should:
- Accept a bundle file path as a command-line argument. The path should be validated to ensure it exists and is a valid file.
- Parse the bundle file. Assume the bundle file is in a standard format (e.g., a JavaScript file generated by Webpack or Rollup). You'll need to use a library capable of parsing JavaScript files and extracting module information.
rollup-plugin-visualizer's underlying parsing logic can be a good reference, but you don't need to implement the visualization itself. - Calculate and display the following statistics:
- Total Bundle Size: The total size of the bundle in bytes.
- Number of Modules: The total number of modules included in the bundle.
- Top 5 Largest Modules: A list of the 5 modules with the largest sizes, along with their sizes in bytes and their paths (if available).
- Percentage of Bundle Size per Top 5 Modules: The percentage of the total bundle size that each of the top 5 largest modules occupies.
- Handle errors gracefully. If the bundle file is invalid or cannot be parsed, the tool should display an informative error message and exit.
- Provide a clear and concise output format. The output should be easily readable and understandable.
Expected Behavior:
When executed with a valid bundle file path, the tool should print the bundle statistics to the console. When executed with an invalid file path or an unparseable bundle, it should print an error message.
Edge Cases to Consider:
- Empty Bundle: Handle the case where the bundle file is empty.
- Large Bundle: The bundle could be very large. Consider memory usage and potential performance issues.
- Invalid Bundle File: The provided file might not be a valid JavaScript bundle.
- Missing Module Paths: Some modules might not have associated paths. Handle this gracefully.
- Zero-Sized Modules: Modules with a size of 0 bytes.
Examples
Example 1:
Input: bundle.js (a valid Angular bundle file)
Output:
Bundle Analysis:
Total Bundle Size: 1234567 bytes
Number of Modules: 150
Top 5 Largest Modules:
1. /src/app/components/my-component.js - 500000 bytes (40.65%)
2. /node_modules/rxjs/index.js - 300000 bytes (24.32%)
3. /src/app/services/data.service.js - 150000 bytes (12.18%)
4. /node_modules/zone.js/dist/zone.js - 100000 bytes (8.11%)
5. /src/app/app.module.js - 50000 bytes (4.05%)
Example 2:
Input: invalid_bundle.txt (an invalid bundle file)
Output:
Error: Could not parse bundle file. Please provide a valid JavaScript bundle.
Example 3:
Input: non_existent_bundle.js (a file that does not exist)
Output:
Error: Bundle file not found.
Constraints
- Bundle Size: The bundle file can be up to 10MB in size.
- Module Count: The bundle can contain up to 500 modules.
- Performance: The analysis should complete within 5 seconds for a 10MB bundle.
- Input Format: The input should be a single file path provided as a command-line argument.
- Output Format: The output should be printed to the console in a human-readable format as described above.
- Dependencies: You are allowed to use external libraries for parsing JavaScript files and handling command-line arguments.
commander.jsis a good option for CLI argument parsing.
Notes
- You don't need to implement the visualizer part (the graphical representation of the bundle). Focus on parsing the bundle, calculating the statistics, and displaying them in a clear format.
- Consider using a library like
acornoresprimafor parsing JavaScript files. - Think about how to efficiently calculate the sizes of modules and sort them to find the top 5 largest.
- Error handling is crucial. Provide informative error messages to the user.
- The paths of the modules are not guaranteed to be available. Handle cases where paths are missing.
- This is a simplified bundle analyzer. Real-world bundle analyzers are much more complex and handle various bundle formats and optimization techniques. The goal here is to demonstrate your understanding of bundle analysis concepts and your ability to parse and analyze JavaScript code.