JinDaGe - playwright-lighthouse-mcp MCP Details

article

README

🚀 Playwright-Lighthouse MCP 服务器

本项目是一个使用 Playwright 和 Lighthouse 分析网站性能的 MCP 服务器。借助模型上下文协议 (MCP)，大语言模型（LLMs）能够执行网站性能分析，为网站性能评估提供了便捷有效的解决方案。

🚀 快速开始

本服务器可助力大语言模型进行网站性能分析，以下为使用前的准备步骤。

✨ 主要特性

性能分析：使用 Lighthouse 进行专业的性能分析。
截图捕获：支持对当前打开页面进行屏幕截图捕获。

📦 安装指南

先决条件

需要安装 Node.js 18 或更高版本。
安装 npm 包管理工具。

安装步骤

# 克隆仓库
git clone https://github.com/kbyk004/playwright-lighthouse-mcp.git
cd playwright-lighthouse-mcp

# 安装依赖项
npm install
npx playwright install

# 构建项目
npm run build

💻 使用示例

基础用法

调试 MCP 服务器

npm run inspector

与 MCP 客户端集成

此服务器专为支持模型上下文协议 (MCP) 的客户端设计，例如可与桌面版的 Claude 集成。

在桌面版配置文件 (~/Library/Application Support/Claude/claude_desktop_config.json) 中添加以下内容：

{
  "mcpServers": {
    "playwright-lighthouse": {
      "command": "node",
      "args": [
        "/path-to/playwright-lighthouse-mcp/build/index.js"
      ]
    }
  }
}

高级用法

可用工具

1. run-lighthouse

对当前打开的页面运行 Lighthouse 性能分析。参数说明：

url：要分析的网站 URL。
categories：要分析的类别数组（默认：["performance"]），可用类别包括 "performance"、"accessibility"、"best-practices"、"seo"、"pwa"。
maxItems：每个类别显示的最大改进项数量（默认：3，最大值：5）。

2. take-screenshot

捕获当前打开页面的屏幕截图。参数说明：

url：要捕获的网站 URL。
fullPage：如果为 true，则捕获整个页面的截图（默认：false）。

📚 详细文档

输出格式

分析结果包含以下内容：

每个选定类别的总体评分，带颜色指示器。
每个类别中的关键改进区域。
保存报告文件的路径。

📄 许可证

本项目采用 MIT 许可证，详细信息请查看 LICENSE。

playwright-lighthouse-mcp