500.开发类

不少扩展都是程序员开发的，关于提升开发效率的扩展也是多多的。

在 Chrome 应用商店中，还有专门的一个「开发者工具」分类：

​​

‍

前端页面相关

​​

CSS：

• CSS Variables Editor (opens new window)：可以编辑 CSS 变量，显示所有的颜色
• CSS Peeper (opens new window)：轻松提取某个元素的 CSS 代码，界面直观友好
• Code Cola (opens new window)：可视化编辑在线页面 CSS 样式
• Page Ruler (opens new window)：一款尺寸测量工具
• CSSViewer (opens new window)：更简单直观的 CSS 查看器，开源
• ColorZilla (opens new window)：非常流行的取色器，有 400w 安装量，类似的扩展有 Ultimate Color Picker (opens new window)

‍

JSON：

• JSON Viewer (opens new window)：号称最漂亮的 JSON 美化扩展，100w 用户
• JSON-handle (opens new window)：对 JSON 进行浏览和编辑，以树形图样式展现，10w 用户

‍

字体：

• WhatFont (opens new window)：轻松识别网页上使用的字体
• Font Tester (opens new window)：无需改代码，快速切换字体，调整样式

‍

Cookie 管理

​​

• Best Cookier (opens new window)：可以方便地编辑、查找、监控、导出 Cookie。
• EditThisCookie (opens new window)：您可以添加，删除，编辑，搜索，锁定和屏蔽 cookies
• Chrome-Best-Cookier (opens new window)：集颜值、操作、功能于一体，有多种主题，能监控 JS 对 Cookie 操作

‍

前端开发相关

​​

• LiveReload (opens new window)：实时预览、自动刷新网页，对于前端开发是很有用的小插件
• Set Character Encoding (opens new window)：修改网页编码（GBK，UTF8 等）
• Fake Filler (opens new window)：自动用虚假数据填充表单，专为经常使用表单的开发人员和测试人员而设计
• Mobile Simulator (opens new window)：可以模拟 Web 在各种移动设备上的显示和功能测试
• WAVE Evaluation Tool (opens new window)：可访问性评估工具，确保网站对所有用户都是可访问的，包括残疾人
• ReRes (opens new window)：可以指定 URL 重定向到特定的 URL
• XSwitch (opens new window)：阿里大佬开发，可以实现跨域，重定向 URL
• Moesif Orign & CORS Changer (opens new window)：解除浏览器跨域限制
• VisBug (opens new window)：谷歌开源的一款前端设计、调试工具
• Restlet Client - REST API Testing (opens new window)：Restful API 测试工具（不过我一般都用 Postman）
• Window Resizer (opens new window)：方便地调整浏览器窗口的大小，以便更好地测试和预览不同分辨率的网页和应用程序。
• WEB 前端助手 (FeHelper) (opens new window)：国人开发的一套前端工具集，几乎是必备扩展了，2011 年维护至今，有 JSON 自动 / 手动格式化、JSON 内容比对、代码美化与压缩、信息编解码转换、二维码生成与解码、图片 Base64 编解码转换、Markdown、 网页油猴、网页取色器、脑图 (Xmind) 等贴心工具

‍

框架：

• Angular DevTools (opens new window)：Angular 官方开发，有 30w 用户
• Vue.js devtools (opens new window)：Vue 官方开发，有 100w 用户
• React Developer Tools (opens new window)：Facebook 官方开发，有 400w 用户
• Redux DevTools (opens new window)：Redux 是一个流行的 JS 应用程序状态管理库，该扩展能轻松管理 Redux，有 100w 用户

‍

‍

网站分析相关

​​

• Wappalyzer (opens new window)：可以分析网站用到的技术框架，有 200w 安装量
• Website Technology Checker by Snov.io (opens new window)：Wappalyzer 的平替
• WhatRuns (opens new window)：分析网站服务器信息，编程语言，前端框架，CMD，JS 库，Fonts，提供代码查看器
• Lighthouse (opens new window)：谷歌出品，用于网站的性能测试、分析
• Speedtest by Ookla (opens new window)：测试网络速度和打开网页的速度
• Page load time (opens new window)：使用了 Web Timing API 来精确测量页面加载各个阶段的耗时，非常的简洁清晰
• IP Address and Domain Information (opens new window)：支持更强大的 IP 分析功能
• IP Whois & Flags Chrome & Websites Rating (opens new window)：可以显示网站的国旗，流行度，IP 等其它信息
• User-Agent Switcher and Manager (opens new window)：自定义和切换网站的 User-Agent，查看网页在不同的 User-Agent 下的效果

‍

SEO：

• Ahrefs SEO Toolbar (opens new window)：轻松分析网页和 SEO 情况
• SEOquake (opens new window)：查看一个网站在各大搜索引擎的 SEO 情况
• AITDK SEO Extension (opens new window)：流量/关键词/Whois/SEO 分析器
• Detailed SEO Extension (opens new window)：非常全面详细的 SEO 情况分析工具

‍

GitHub 相关

​​

GitHub 可以说是程序员离不开的网站之一，相关的扩展也是很多的：

• Octotree (opens new window)：在项目左侧添加一个菜单，显示当前项目的整个文件夹结构，非常方便浏览项目
• Octohint (opens new window)：代码智能高亮，提示参数属性
• OctoLinker (opens new window)：直接从代码跳转到 GitHub 对应仓库，相对路径也能跳转，支持很多编程语言
• Enhanced GitHub (opens new window)：也是很强大的扩展，支持显示每个文件大小，下载大文件，直接复制文件到剪贴板等功能，很多功能也被 GitHub 官方添加到了 Feature
• GitZip for GitHub (opens new window)：让你方便地下载文件或子文件夹
• GayHub (opens new window)：优化 GitHub 的阅读体验，支持文件目录树，暗黑主题，大屏
• notifier-for-github (opens new window)：在扩展栏显示 GitHub 未读消息数，支持桌面通知
• Github-hovercard (opens new window)：在查看头像、issue、repo 都时候都会弹出一个悬浮卡片，用以显示更多信息，十分方便
• GitHub-userscripts (opens new window)：收录了很多油猴脚本
• Material Icons for GitHub (opens new window)：替换原有的图标，类似的扩展有 github-file-icons (opens new window)，File Icon for GitHub (opens new window)
• Sourcegraph (opens new window)：在线打开、阅读、运行、调试项目，还有各种 IDE 插件，以及高级功能（需付费）
• Awesome Autocomplete for GitHub (opens new window)：加强 GitHub 的搜索框

‍

Jam

可以说是排查生产问题的神器。可以让任何人轻松地通过一次点击，就创建一个程序员友好的 Bug 报告，记录了所有的操作步骤，支持操作过程录像，记录下了所有的 HTTP 请求和响应的数据，支持各种简单的标记。

​​

全球的巨头如 HP、Dell、Salesforce、联合利华、Autodesk 、迪斯尼等公司都开始使用 Jam 来简化 Bug 报告的流程，用户群已经覆盖 150 多个国家。

推荐阅读：这个女生写的软件，解决了无数程序员最头疼的问题！ (opens new window)

‍

最后

关于开发相关的扩展数不胜数，还有很多关于 AI，各种编程语言的扩展没有列举，欢迎补充。