mcpField
I
imagedimensions-mcp

imagedimensions-mcp

本地服务
github.com/Bishop81开发工具011 周前更新
代码仓库

关于 imagedimensions-mcp

imagedimensions-mcp 是面向开发者的 MCP 服务，用于审计公开网页的图片性能。服务端扫描会报告图片原始尺寸与渲染尺寸、过大的图片及格式，无需本地浏览器。

主要功能

  1. 01比较原始尺寸与渲染尺寸
  2. 02标记尺寸过大的图片
  3. 03报告图片格式分布
  4. 04统计图片总数和可见数量
  5. 05显示现代格式占比

适用场景

  1. 01查找网页中过大的图片
  2. 02在开发期间检查图片格式
  3. 03排查可能由图片造成的 LCP 延迟

MCP 相关

向 MCP 客户端提供 scan_image_dimensions 工具；该工具在服务端扫描公开网页 URL，并返回文本报告和结构化结果。

配置

本地服务的配置在各客户端中通用，复制后粘贴到客户端的 MCP 配置文件即可。

mcp.json · 通用配置
{
  "mcpServers": {
    "bishop81-imagedimensions": {
      "command": "npx",
      "args": [
        "-y",
        "imagedimensions-mcp"
      ],
      "env": {
        "IMAGEDIMENSIONS_API_BASE": "<IMAGEDIMENSIONS_API_BASE>"
      }
    }
  }
}
启动命令npx -y imagedimensions-mcp
需要配置的环境变量
IMAGEDIMENSIONS_API_BASEOverride the scan API base. Defaults to https://imagedimensions.com.

本地服务需要在你的电脑上安装运行环境（如 Node.js 18+）。各客户端的配置文件位置不同，请参考客户端文档。

安装包
npmimagedimensions-mcp0.1.2

工具

1

收录的工具列表 · 更新于 3 周前

参数类型必填说明
urlstring是要审查页面的公开 URL。
oversizedThresholdnumber否图像被标记为尺寸过大的面积超出比率阈值。默认值为 4（每个维度约为 2 倍）。

详细介绍

imagedimensions-mcp

一个 MCP 服务，可审计任意公开网页上的图片—— 原始尺寸与渲染尺寸、超大图片检测及格式分布——让 AI Agent （Claude、Cursor、Windsurf 等）在开发过程中检查图片性能。

由 imagedimensions.com 提供支持。扫描在服务端运行，因此无需本地浏览器或 Chrome 安装。

安装 / 运行

// Claude Desktop / any MCP client config
{
  "mcpServers": {
    "imagedimensions": {
      "command": "npx",
      "args": ["-y", "imagedimensions-mcp"]
    }
  }
}

工具

scan_image_dimensions
参数类型描述
urlstring（必填）要审计页面的公开 URL。
oversizedThresholdnumber（可选）用于标记超大图片的面积超出比例。默认值为 4（每个维度约为 2 倍）。

返回文本报告及结构化内容：

  • 图片总数 / 可见图片数及 CSS 背景图片数
  • 现代格式占比（WebP + AVIF）
  • 格式分布
  • 超大图片列表（原始尺寸 → 渲染尺寸、超出比例、格式、src）
  • imagedimensions.com 上完整可视化报告的链接

Agent 使用示例：“审计 https://example.com 上的图片”、“此页面上哪些图片过大并影响 LCP？”、“此网站有多少百分比的图片使用了现代格式？”

为什么“超大”很重要

图片下载尺寸远大于其渲染区域，会浪费带宽并拖慢最大内容绘制（Largest Contentful Paint）——这是网页上最常见的图片性能问题。参见 相关说明。

配置

  • IMAGEDIMENSIONS_API_BASE — 覆盖 API 基础 URL（默认值为 https://imagedimensions.com）。

许可证

MIT

评论

支持 Markdown

第一次接触 MCP？

从协议是什么，到在客户端里装上第一个服务，这几条回答覆盖了大多数入门问题。

一个开放协议，规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话，MCP 服务负责提供工具、资源和提示模板，两者通过标准消息通信，同一个服务可以被不同客户端复用。