DOCSEARCHbyAlgolia
Submit Docs

Rsdoctor Build Analyzer

website·Indexed 34 days ago

https://rsdoctor.rs

A build analyzer tailored for the Rspack ecosystem. Rsdoctor provides comprehensive analysis of bundles, compilation, and loaders, featuring a bundle diff tool, diagnostic rules for detecting build issues, and an MCP server for AI-assisted analysis. It includes a CLI (@rsdoctor/cli) and an official GitHub Action for CI/CD integration.

Tokens
24.1K
Snippets
101
Records
183
Agent score
69%

What's inside Rsdoctor

  1. Overview of Rsdoctor build analyzer

    Rsdoctor is a one-stop, intelligent build analyzer designed for the Rspack ecosystem and fully compatible with webpack. It provides visualization and smart analysis to make the build process transparent and optimizable, helping teams identify bottlenecks and improve engineering quality. It supports various frameworks including Docusaurus, Next.js, Nuxt, Re.Pack, Modern.js, Rsbuild, Rspress, and Rslib.

  2. Overview of Rsdoctor build analyzer

    Rsdoctor is a build analyzer designed for the Rspack ecosystem and fully compatible with webpack. It provides visualization and smart analysis to identify build bottlenecks, optimize performance, and improve engineering quality. It supports Rspack, webpack, and frameworks based on them, including Docusaurus, Next.js, Nuxt, Rsbuild, and Rspress. Key capabilities include loader profiling, built-in scanning/detection rules for artifacts and compilation, and support for custom analysis rules.

  3. Overview of @rsdoctor/mcp-server

    @rsdoctor/mcp-server is an MCP (Model Context Protocol) Server tool that enables AI agents to interact with Rsdoctor's local build analysis data via a Q&A interface. It provides four core analysis capabilities:

    • Bundle Analysis: Analyzes bundle size and composition.
    • Dependency Analysis: Analyzes project dependency relationships, duplicate dependencies, and Tree Shaking issues.
    • Bundle Optimization: Provides suggestions for bundle size optimization and code splitting.
    • Compilation Optimization: Analyzes compilation time and provides performance optimization suggestions.

  4. Analyze modules mixed in initial and async chunks [E1006]

    The 'Module Mixed Chunks' rule detects modules that appear in both initial chunks (main entry/synchronous imports) and async chunks (dynamic import()). This duplication increases output size and negatively impacts cache efficiency and first-screen load times.

    Common Causes:

    • A module is both synchronously imported in the main bundle and dynamically imported elsewhere.
    • A file is configured as an entry point but is also dynamically imported in the app code.
    • splitChunks configuration overlaps with entry points.

    Recommendations:

    • Use a consistent import style (either all synchronous or all dynamic).
    • Extract shared dependencies into a single shared chunk via build configuration.

  5. Rsdoctor Build Overview Features

    Rsdoctor provides a high-level build overview consisting of the following capabilities:

    • Project Overview: View current project configuration and version information.
    • Bundle Overview: View information regarding the artifacts built for the project.
    • Compilation Overview: Access data regarding the project's compilation process.
    • Bundle Alert: Perform detection and identify issues based on build artifact data.
    • Compilation Alert: Perform detection and identify issues based on compilation data.

  6. Understand Rsdoctor compilation diagnostic rules

    Rsdoctor provides diagnostic rules that function similarly to ESLint but are integrated directly into the Rspack or Webpack build process. Unlike static code scanners, these rules utilize internal build parameters—such as the ModuleGraph, internal module markings, and post-transformation runtime additions—to identify issues. When a rule is triggered, the diagnostic results are displayed in the CLI and on the final diagnostic summary webpage.

  7. Analyze build artifacts with Rsdoctor Bundle Size module

    The Bundle Size module in Rsdoctor analyzes build artifacts for Webpack and Rspack. It provides insights into resource sizes, duplicate packages, and module reference relationships. It offers two primary visualization modes:

    1. Tree Map: A visual representation of the proportion of resources (Assets) and modules, allowing users to zoom into specific module areas and search for resources.
    2. Tree Graph: A file tree-based view that displays the actual packaged code size of modules within Assets, original code, packaged code segments, and reference relationships.

  8. Analyze custom bundle extensions (e.g., Re.Pack .bundle files)

    Rsdoctor automatically supports custom JavaScript bundle extensions beyond .js, specifically .bundle (used by Re.Pack). No additional configuration is required; Rsdoctor will automatically parse, analyze, and include .bundle files in the Bundle Analyzer Graph and asset statistics.

  9. Optimize loader performance [E1003]

    This rule provides visual warnings about project compilation performance by monitoring loader execution time. If a loader's total cost exceeds the defined threshold, a warning or error is triggered.
    interface Config {
  /** Loaders to ignore (strings or regular expressions) */
  ignore: (string | RegExp)[];
  /** 
   * Total time threshold for the loader in milliseconds. 
   * @default 5000 
   */
  threshold: number;
  /** 
   * File extensions to match in rule checks. 
   * @default ["js", "css", "jpg", "jpeg", "png", "gif", "webp", "svg"] 
   */
  extensions: (string | RegExp)[];
}

  10. Analyze build bundles and artifacts with Rsdoctor

    Rsdoctor provides a suite of bundle analysis features to optimize build artifacts:

    • Bundle Overview: General information about built artifacts.
    • Bundle Alert: Detection of issues based on artifact data.
    • Bundle Analysis: Analysis of relationships between assets, chunks, and modules, including packaged code and size analysis per module.
    • Module Analysis: Analysis of module dependencies.
    • Duplicate Packages Optimization: Inspection and identification of duplicate dependencies within the project.
    • Bundle Diff: Comparative analysis between two different build artifacts.

  11. Understand and use Rsdoctor Compile Alerts

    The Compile Alerts module in Rsdoctor detects specific patterns in compilation data based on predefined rules. When a compilation result triggers a rule, the 'Compile Alerts' module appears at the bottom of the Rsdoctor main interface. This feature is designed to provide visual warnings that help developers identify and optimize project compilation performance.

  12. Analyze project compilation with Rsdoctor

    Rsdoctor offers several tools for deep analysis of the compilation process:

    • Compilation Overview: General data on the compilation process.
    • Compilation Alert: Detection of issues within compilation data.
    • Loader Compilation Behavior Analysis: Analysis of loader data by directory and file, including the compilation behavior of individual files.
    • Loader Time Consumption Analysis: A sequence diagram showing the execution of all Loaders in the project.
    • Plugins Analysis: Data analysis of the plugins utilized in the project.
    • Resolver Analysis: Analysis of Resolver parsing capabilities.
    • Loader Optimization: Tools to analyze and optimize build time consumption specifically related to loaders.