Webtools MCP Server
2025.04.01
0
JavaScript网页分析性能优化SEO审计开发工具浏览器自动化开发效率
Webtools MCP Server 是一个基于 Model Context Protocol 的服务，提供全面的网页分析工具，包括 HTML 提取、Markdown 转换、截图功能、调试控制台、高级性能分析以及 Lighthouse 驱动的网页审计（性能、可访问性、SEO 等）。该工具主要用于网页开发、测试和优化场景。
View on GitHub
Overview
基本能力
产品定位
Webtools MCP Server 是一个专业的网页分析工具集，旨在帮助开发者、测试人员和 SEO 专家进行网页内容的提取、转换和分析，以及性能优化和审计。
核心功能
- HTML 内容提取：支持 JavaScript 渲染和代理。
- Markdown 转换：提取干净的内容并转换为 Markdown 格式。
- 截图功能：支持全页和元素级截图，可模拟不同设备。
- 调试控制台：捕获控制台输出、网络请求和错误跟踪。
- Lighthouse 审计：全面的网页审计，包括性能、可访问性、SEO 等。
- 高级性能分析：包括布局抖动检测、CSS 变量影响分析等。
- 网络活动分析：详细的请求和响应分析，瀑布图可视化。
- 代码覆盖率分析：识别未使用的 JavaScript 和 CSS 代码。
- 核心 Web Vitals 分析：包括 LCP、CLS、FID/INP 等指标。
- 跨设备和网络测试：模拟不同设备和网络条件进行测试。
适用场景
- 网页内容提取和转换
- 网页性能优化和分析
- SEO 和可访问性审计
- 跨设备和网络条件下的网页测试
- 开发调试和错误跟踪
工具列表
webtool_gethtml：原始 HTML 内容提取webtool_readpage：Markdown 转换webtool_screenshot：截图捕获webtool_debug：调试控制台webtool_lighthouse：Lighthouse 网页审计webtool_performance_trace：高级性能分析webtool_network_monitor：网络活动分析webtool_coverage_analysis：代码覆盖率分析webtool_web_vitals：核心 Web Vitals 分析webtool_performance_test：跨设备和网络测试
常见问题解答
- Chrome 安装问题：Chrome 通过 Puppeteer 自动安装，无需单独安装。
- 连接问题：检查 URL 格式和网站可用性，或启用代理。
- JavaScript 渲染问题：增加超时时间，检查导航错误。
- 截图问题：确保选择器正确，增加视口大小。
- Lighthouse 审计超时：增加超时设置，减少审计类别。
使用教程
使用依赖
- Node.js：版本 14 或更高
- Chrome/Chromium：通过 Puppeteer 自动提供
安装教程
全局安装：
npm install -g @bschauer/webtools-mcp-server
或使用 npx：
npx @bschauer/webtools-mcp-server
调试方式
示例调试命令：
webtool_debug({
url: "https://example.com",
captureConsole: true,
captureNetwork: true,
captureErrors: true,
captureLayoutThrashing: true,
timeoutMs: 15000,
});