这 12 款 Chrome 浏览器插件，网页开发必备

时间：2023-07-23 22:09:01 | 来源：网站运营

时间：2023-07-23 22:09:01 来源：网站运营

这 12 款 Chrome 浏览器插件，网页开发必备：作者：Phoebe 前端工程师

作为一名前端开发，Google Chrome 自不必说是我们在 Web 开发过程中使用最多的浏览器了。除了使用方便，以及支持各种最新的网页开发标准外，Chrome 背后还有数量庞大的应用扩展可供使用，使我们的日常编程不再是一件苦差事。

虽然我有朋友表示 Chrome 内置的开发者工具已经足够，不需要任何额外的插件了，但是我从个人的工作经历中感觉到了效率的提高，因此我想把我在用的插件分享出来，希望能给需要的同学一些帮助。

Githunt

如果你经常会花时间在 GitHub 上寻找项目灵感，Githunt 这个插件可能就很适合你。在启用后，它会在你的浏览器新标签页上显示你选择关注的项目列表。

你可以自定义搜索不同语言的项目，查看项目的摘要和项目当前的 issues 情况，并通过点击项目链接跳转前往项目的 Github 进行检查。因为这款插件收录的几乎都是趋势项目，你将可以省下不少时间去做更有效率的事情（比如找 bug 和修 bug）。

ColorZilla

在正式登陆 Chrome 浏览器之前，ColorZillia 就作为 FireFox 上最富盛名的的取色工具知名于前端人士之间。它可以快速识别网页上任何一处角落里的任何颜色，甚至是 1px 大小的边框上的色彩都可以爬取下来，并允许用户将取下的颜色轻松复制到其他程序中使用。

CSSViewer

CSS Viewer 是另一个对前端人员来说简单实用的 Web 开发工具。顾名思义，这个插件在你将鼠标悬停在任何地方时，会自动出现一个小弹窗，显示构成当前鼠标所指向元素的 CSS 参数。

Font Ninja

Font Ninja 是那些平日里喜欢收集各种优秀网页案例并尝试学习的 Web 开发人员的理想选择。 它内置的专利算法快速有效，能在几秒钟内识别出页面中的单个字体。它还能识别出字体的大小、重量和颜色等信息，所有这些都会显示在一个小弹出窗口中。

Check My Links

顾名思义，这是一款专门用来检查坏链和死链的工具。除此以外，它还可以检查页面上的有效链接和重定向链接。这款插件不仅仅对 Web 开发者来说非常有帮助，对做网站 SEO 优化业务的人员来说也很有用。

Dimensions

当你想测量页面元素之间的间隙、尺寸，或是你在页面上看到的任何物体之间的距离，这是一个非常有用的插件。

安装后，你会在你的工具栏上看到一个小十字线图标。在浏览器中打开一个新页面，选择该图标，你会看到屏幕上出现一个十字线。将它拖动到你想测量的页面元素之间，你就会看到具体的数值，简单而优雅。

UX Check

这是一个可用性分析插件，利用内置的用户体验指标算法来评估一个页面的可用性水平。它可以快速找出网页潜在的可用性问题，并允许用户添加注释，进行截图并导出，方便与其他团队成员进行合作。

对于不需要考虑太多细节的轻量级用户体验测试，UX Check 可以为团队节省下不少的时间和资源。

BuiltWith Technology Profiler

这是一款非常适合放在手边的小工具，它可以识别绝大多数网站背后所用的技术栈。例如网络服务提供商、使用的 CMS 平台、网站分析工具、插件、JavaScript 库和其他内容。

安装好插件后，只要在一个页面上点开它，就会出现一个弹出窗口，向你显示该页面上运行的可识别技术。

Web Developer

这是一个包含了多种功能的套装插件。虽然名字是 「Web Developer」，但我认为这个工具也适合其他的开发人员，因为它包含了许多有用的工具可供开发者调用。

安装后，Web Developer 可通过点击工具栏上的小齿轮图标进入访问。插件启动后，你应该能看到一个小的下拉框出现，其中有一系列的选项被组织成标签。选择一个选项卡来访问其中的工具。这里有很多东西，但每个工具都是真正有用的。

EditThisCookie

你可以用这个插件在每个页面的基础上进行编辑、删除、创建和保存 cookies 文件，它还支持将 cookies 导出进行分析、阻止，以及添加进 JSON 文件里等等。基本上你可以通过这款插件对网页 cookies 做任何想做的事情。

JSON Viewer

JSON Viewer 可以在浏览器窗口中把 JSON 数据管理成可快速识别的层次视图。当然，作为技术人员，手动处理 JSON 文件应该是必备技能，但是使用这个插件可以让你的效率和体验相应的提升一些。

Session Buddy

严格意义上这不是一款面向开发者的工具。它比较像传统意义上的文件收藏夹，可以将特定的页面保存起来，以便以后访问。例如，当你发现一篇很有趣的文章但眼下没有时间去读，或者当你的浏览器上打开了太多个标签时，它就可以派上用场了。

以上就是我在日常工作中发现到的好用的插件，如果你有发现到好用的插件是文中没有提到的，欢迎留言！如果你觉得这篇文章对你有所帮助，也请点赞收藏！

（部分资料和图片来源于互联网）