awesome-repositories.com
博客
awesome-repositories.com

通过 AI 驱动的搜索，发现最优秀的开源仓库。

探索精选搜索开源替代品自托管软件博客网站地图
项目关于排名机制媒体报道MCP 服务器
法律隐私政策服务条款
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
webpack avatar

webpack/webpack-bundle-analyzer

0
View on GitHub↗
12,667 星标·507 分支·JavaScript·MIT·3 次浏览

Webpack Bundle Analyzer

webpack-bundle-analyzer is a bundle size analysis tool and Webpack build plugin that visualizes the composition of web application assets. It generates an interactive treemap to identify large dependencies and analyze the distribution of modules within the final payload.

The tool functions as a bundle visualizer and a static report generator, exporting analysis data as standalone HTML and JSON files. It supports live bundle tracking via WebSockets during development and allows for the analysis of existing static stats files through a command line interface.

The project provides capabilities for frontend asset analysis and web performance auditing, including the calculation of compressed sizes and the inspection of concatenated modules. It includes utilities for filtering chunks, searching for specific modules, and mapping dependency trees to optimize build metadata.

Features

  • Static Stats Analysis - Analyzes existing Webpack stats files via a command line interface to visualize bundle composition.
  • Build Metadata Inspection - Processes Webpack stats files to analyze bundle composition without needing to trigger a full project rebuild.
  • Bundle Size Analyzers - Calculates and displays raw and compressed module sizes to help developers optimize the final payload.
  • Bundle Size Optimization - Visualizes the Webpack output to find large dependencies and reduce the overall size of JavaScript bundles.
  • Dependency Visualizers - Maps the relationships and sizes of project modules using an interactive treemap for dependency debugging.
  • Frontend Asset Optimization - Examines the composition of production assets to identify which modules occupy the most space in the browser.
  • Bundle - Exports bundle analysis data as standalone HTML and JSON files for sharing and programmatic use.
  • Live Tracking - Updates the module treemap in real-time via WebSockets when used with a development server.
  • Build Tool Plugins - Integrates into the Webpack build process as a plugin to generate reports on module sizes.
  • Analysis Result Exporters - Provides utilities for exporting bundle analysis results into static HTML and JSON formats for sharing.
  • Performance Auditing - Measures compressed file sizes and identifies redundant code to improve page load times and network efficiency.
  • Bundle Analysis - Visualizes bundle content as an interactive treemap.

Star 历史

webpack/webpack-bundle-analyzer 的 Star 历史图表webpack/webpack-bundle-analyzer 的 Star 历史图表

AI 搜索

探索更多 awesome 仓库

用简单的语言描述您的需求 —— AI 将根据相关性为您从数千个精选开源项目中进行排序。

Start searching with AI

Webpack Bundle Analyzer 的开源替代方案

相似的开源项目，按与 Webpack Bundle Analyzer 的功能重合度排序。
  • addyosmani/agent-skillsaddyosmani 的头像

    addyosmani/agent-skills

    60,849在 GitHub 上查看↗

    Agent-skills is a collection of structured instructions and behavioral personas designed to standardize how AI coding agents perform engineering tasks. It functions as a workflow orchestrator that maps natural language intent to repeatable technical sequences and verification checklists. The project distinguishes itself through the use of specialized markdown-defined roles, such as security auditors or test engineers, to apply targeted domain expertise. It employs an evidence-based verification model that requires runtime data or passing tests as mandatory exit criteria to ensure AI-generated

    Shellagent-skillsantigravityantigravity-ide
    在 GitHub 上查看↗60,849
  • antfu/unplugin-iconsantfu 的头像

    antfu/unplugin-icons

    4,876在 GitHub 上查看↗

    unplugin-icons is a universal icon component provider and build-time asset optimizer that transforms diverse SVG libraries into a unified cross-framework interface. It functions as an SVG icon pipeline, converting thousands of icons from various sets into on-demand components or raw strings for use across different frontend frameworks. The tool provides a cross-framework icon library that optimizes bundle sizes by exclusively including the specific icons referenced in the source code. It further simplifies the development workflow through automatic icon importing and the use of aliases to map

    TypeScript
    在 GitHub 上查看↗4,876
  • developit/microbundledevelopit 的头像

    developit/microbundle

    8,135在 GitHub 上查看↗

    Microbundle is a zero-configuration JavaScript module bundler designed to package small libraries and modules into optimized distribution files. It serves as a JavaScript library packager and TypeScript compiler, converting source code into compatible module formats for both browser and server-side runtimes. The tool functions as a bundle size optimizer by mangling object properties and analyzing bundle composition to reduce final file sizes. It also acts as a CSS module processor, converting style imports into external stylesheets or scoped modules to prevent global namespace collisions. It

    JavaScript
    在 GitHub 上查看↗8,135
  • pastelsky/bundlephobiapastelsky 的头像

    pastelsky/bundlephobia

    9,534在 GitHub 上查看↗

    Bundlephobia is a suite of tools for analyzing the composition and size of JavaScript dependencies from the npm registry. It functions as a bundle analyzer and size monitor that calculates the total footprint of frontend packages and stylesheets to determine their impact on page load performance. The project identifies specific components contributing to bundle size through asset composition analysis and package auditing. It also generates visual size indicators and badges that can be embedded in documentation and version control repositories to communicate package dimensions. The platform m

    TypeScriptcostdependenciesnpm-package
    在 GitHub 上查看↗9,534
查看 Webpack Bundle Analyzer 的所有 30 个替代方案→

常见问题解答

webpack/webpack-bundle-analyzer 是做什么的？

webpack-bundle-analyzer is a bundle size analysis tool and Webpack build plugin that visualizes the composition of web application assets. It generates an interactive treemap to identify large dependencies and analyze the distribution of modules within the final payload.

webpack/webpack-bundle-analyzer 的主要功能有哪些？

webpack/webpack-bundle-analyzer 的主要功能包括：Static Stats Analysis, Build Metadata Inspection, Bundle Size Analyzers, Bundle Size Optimization, Dependency Visualizers, Frontend Asset Optimization, Bundle, Live Tracking。

webpack/webpack-bundle-analyzer 有哪些开源替代品？

webpack/webpack-bundle-analyzer 的开源替代品包括： addyosmani/agent-skills — Agent-skills is a collection of structured instructions and behavioral personas designed to standardize how AI coding… developit/microbundle — Microbundle is a zero-configuration JavaScript module bundler designed to package small libraries and modules into… pastelsky/bundlephobia — Bundlephobia is a suite of tools for analyzing the composition and size of JavaScript dependencies from the npm… antfu/unplugin-icons — unplugin-icons is a universal icon component provider and build-time asset optimizer that transforms diverse SVG… didi/mpx — MPX is a cross-platform framework designed to build applications for multiple mini-program ecosystems and the web from… elm/compiler — This project is a functional programming compiler and JavaScript transpiler that transforms a statically typed…