dtools - Web 开发者工具

全面的 Web 开发者工具扩展，提供性能指标、技术栈检测和调试工具。

# 🛠️ dtools - Web 开发者工具 ## 标题 **dtools - 强大的 Web 开发者工具浏览器扩展** ## 介绍 dtools 是一款功能强大的浏览器扩展，专为 Web 开发者设计，集成了多种实用的开发调试工具、性能监控指标和技术栈自动检测功能。无论您是在开发、调试还是优化网站，dtools 都能为您提供全方位的支持。 ### 核心功能 **📄 页面信息分析** - 快速查看页面的完整 URL 信息（协议、主机名、路径、查询参数、哈希） - 自动提取 Meta 标签信息（描述、关键词、作者、视口设置等） - 支持 Open Graph 和 Twitter Card 元数据解析 - 提供图片统计和标题结构分析 - 详细的 DOM 结构统计信息 **🔍 全面技术栈分析** - 广泛的前端技术支持：自动检测页面所使用的各类技术，涵盖主流开发框架、UI组件库、工具函数库等。 - 深度集成内容识别：准确识别内容管理系统（CMS）、数据分析工具及内容分发网络（CDN）的使用情况。 - 清晰的架构洞察：不仅列出技术名称，更提供详细的DOM结构统计分析，帮助开发者快速理解应用架构。 - 打包工具检测：当下最流行的web develop打包工具分析。 **📊 性能指标监控** - 核心 Web Vitals 指标：LCP（最大内容渲染）、FID（首次输入延迟）、CLS（累积布局偏移）、FCP（首次内容渲染） - 网络性能分析：TTFB（首字节时间）、DNS 查询时间、TCP 连接时间、SSL 握手时间、请求/响应时间 - DOM 性能指标：DOM 交互时间、DOM 完成时间、DOM 处理时间、资源加载时间、页面完全加载时间 - 自动性能评分系统（优秀/待改进/较差） **💻 设备信息查看** - 操作系统和浏览器详细信息 - 屏幕分辨率和视口尺寸 - User Agent 字符串解析 - 网络状态、内存、CPU 核心数 - 语言、时区、平台信息 **🗜️ 图片压缩工具** - 支持多种图片格式 - 批量处理功能 - 可调节压缩设置 - 最大尺寸和尺寸限制 - Web Worker 支持，提升性能 **💾 存储管理** - 存储分析：LocalStorage、SessionStorage、Cookies 概览 - 存储查看器：查看、编辑、删除 LocalStorage 和 SessionStorage 项 - Cookie 查看器：查看、编辑、删除 Cookie，提供详细信息 **🔧 API 客户端** - 内置 Postman 风格的 API 测试工具 - 支持多种 HTTP 方法（GET、POST、PUT、DELETE 等） - 自定义请求头和请求体 - 响应查看和格式化 - 请求历史记录 **🛠️ 实用工具集** 包含 14+ 种开发者实用工具： - URL 编解码 - Base64 编解码 - JWT 令牌解析和验证 - JSON 格式化和美化 - 哈希计算（MD5、SHA1、SHA256、SHA512） - UUID 生成器 - Lorem Ipsum 文本生成器 - Meta 标签生成器 - Unix 时间戳转换器 - 颜色选择器和转换器 - CSS box-shadow 生成器 - 正则表达式测试器 - User Agent 解析器 - 二维码生成器 **⚙️ 其他特性** - 多语言支持：中文、英文、日文 - 打赏支持：支持开发者持续改进 - 设置功能：可自定义语言偏好 - 标签页状态持久化：记住最后活动的标签页 ### 使用场景 - **前端开发调试**：快速查看页面信息、检测技术栈、分析 DOM 结构 - **性能优化**：监控核心 Web Vitals 指标，识别性能瓶颈 - **API 测试**：快速测试接口，无需切换工具 - **日常开发**：使用内置工具集提高开发效率 - **学习研究**：了解网站使用的技术栈和架构 dtools 致力于为 Web 开发者提供一站式开发工具解决方案，让开发更高效、调试更便捷。