关键词

网页调试性能分析内存检测浏览器自动化

项目简介

这是一个基于 Model Context Protocol (MCP) 的浏览器调试服务器，通过持久化的浏览器连接为LLM客户端提供网页调试、性能监控和内存分析能力。

主要功能

  • 页面导航：控制浏览器跳转到指定URL
  • Console 异常检查：收集页面错误、警告和日志信息
  • 元素状态检查：分析DOM元素的属性、样式、可见性和交互性
  • 缓存状态监控：获取 LocalStorage、SessionStorage、Cookies 和 IndexedDB 状态
  • 性能数据分析：收集 Performance Timeline 和页面加载指标
  • 内存堆栈分析：获取堆快照、跟踪对象分配、检测内存泄漏
  • Lighthouse 性能报告：生成包含性能、可访问性、最佳实践和SEO的完整报告
  • 屏幕截图：辅助调试的可视化工具

安装配置

在 MCP 客户端（如 Cursor、Claude Desktop 等）的配置文件中添加以下配置：

{
  "mcpServers": {
    "puppeteer-debugger-mcp": {
      "command": "npx",
      "args": ["-y", "@aliex7664/puppeteer-debugger-mcp@latest"]
  }
}

配置完成后，重启 MCP 客户端即可使用。'npx' 会自动下载并运行最新版本的包，无需手动安装。

基本使用方法

配置完成后，MCP客户端可以通过调用以下工具进行网页调试：

  1. 导航到页面：使用 'navigate' 工具访问目标网站
  2. 检查错误：使用 'get_console_errors' 获取控制台日志
  3. 分析性能：使用 'get_performance' 收集性能数据
  4. 检查元素：使用 'check_element' 分析特定DOM元素
  5. 内存分析：使用 'get_heap_snapshot' 和 'track_allocations' 进行内存泄漏检测

环境要求

  • Node.js 20 或更高版本
  • Chrome 或 Chromium 浏览器

信息

分类

开发者工具

访问项目