chrome前端插件推荐

用了这么久的Chrome，感受越用越顺手了。之前总以为firefox的插件给力，如今Chrome的插件也跟上步伐了，愈来愈给力了。今天推荐几个Web前端相关的插件，来武装你的Chrome，让它给你的工做带来更大的便利。

如下插件排名不分前后（都比较给力）

（一）调试类插件

1.firebug:大名鼎鼎的firebug,虽然Chrome自带的审查元素就很牛叉，不过有的地方仍是firebug用得要顺手些。审查元素+firebug,双剑出鞘，威力惊人啊。

2.WebDeveloper:这个也是名气很大的插件，不错值得推荐使用。

3.code cola :一款在线修改css的插件，使用很傻瓜化，能够彻底不用神马css代码，拖动滑块，选择属性是类的操做帮你很迅速的修改css。至关帅气（国人开发的哟，绝对要支持），对于css不是很熟的童鞋，此插件吐血推荐啊！

4.Editor Lite:一个在线编辑html代码的插件，能够当成一个简洁版的Dw编辑器，一些少点的代码能够在此插件内，很快的编写，还加入了w3c认证功能，灰常不错。

（二）检测优化类：

1.Yslow：这个没必要多说，yahoo出品的检测web前端性能和提供优化建议的神器。

2.PageSpeed:以前《双陈记》就推荐过的谷歌出的东东，和Yslow一块儿，堪称业界的干净莫邪啊！

3.Monster:这个插件能够检测你网站的代码错误和警告，给出改进建议，还有总体评分。不错的东东。

4.浏览器兼容测试工具：测试网站的兼容性插件。

5.Resolution Test:一个测试各个显示分辨率下的显示状况的插件

（三）辅助类

1.EyeDropper:一个取色插件，功能不错，取色很方便快捷。

2.Awesome Screenshot:Capture& Annotate:一个不错的截图插件，在贴图上还能够进行标注，添加文字等。

3.IE tab：这个东东，应该不少童鞋用过，用蛋疼的ie模式浏览（彷佛有点必备的意思）。

（四）SEO类：

1.SEO for Chrome:一个综合的SEO查询插件。

2.Woorank:这个以弹出新页面的方式对网站进行SEO相关查询（洋文）。

3.百度Seo工具：查询各大搜索引擎的收录数很外链数，百度首页位置的查询。

4.PageRank StatusR查询，Alexa排名，网站地址查询等

到此推荐完毕。以上全部插件均可以去Chrome的应用商品免费下载使用，须要的童鞋赶快尝试吧！

Chrome的应用商品地址：https://chrome.google.com/webstore?hl=zh-CN

 

=================

 

愈来愈多的前端开发人员喜欢在Chrome里开发调试代码，Chrome有许多优秀的插件能够帮助前端开发人员极大的提升工做效率。尤为Chrome自己是能够登陆的，登陆后你全部的插件都会自动同步到每个登陆后的Chrome的，很是方便啊。

Postman - REST Client

Postman是Ajax开发的神器，对于Restful开发方式特别有帮助，能够用来模拟各类请求来测试API的正确性，好比用来模拟Ajax请求。它还支持认证，好比简单的用户名/密码，或者Oauth1.0。Rest Console也是一个不错的选择。

Edit This Cookie

这是一个强大的cookie管理器。你能够添加、删除、编辑、搜索、保护和阻止cookies。Cookies也是一个很是强大的Cookie工具。

Web Developer

安装Web Developer扩展后，会在浏览器的工具栏中添加一个按钮，点击该按钮，会弹出各类Web开发工具。此扩展工具的做者同时也是很是流行的Firefox扩展Web Developer extension for Firefox的做者。。

JSON Lint

一个在线验证和格式化JSON文件的应用。

网页截图

截取网页为图片，支持窗口截图，区域截图和整个网页截图三种方式。支持水平和垂直翻页截取超大网页，新版引进自动截图保存功能。截图后，能够利用图片编辑工具编辑图片，而后将编辑后的图片保存为PNG格式的图片文件，而且提供了高亮工具，涂改工具和文字添加工具。

YSlow

YSlow能够分析网页，并为改善网页性能提出修改建议，这些功能基于高性能网页的规则集。YSlow能够根据预约义的三个规则集或用户自定义规则集来对网页进行分级。，PageSpeed Insights是谷歌开发的相似功能的插件。

ColorZilla

能够从页面上任何一点获取颜色，维护获取历史等。

Measure It!

MeasureIt！ 给你测量一个网站中的任何元素的尺寸（像素宽度和高度）。 Page Ruler也是一个不错的选择。

JavaScript Errors Notifier

安装该扩展后，会在Chrome地址栏中以图标形式提示JavaScript错误，由于Chrome默认只有打开console才会显示错误。

Window Resizer

此扩展能够调整浏览器窗口的大小，以适应各类屏幕分辨率。这对于Web设计师和开发者很是有用，能够帮助他们在不一样的屏幕分辨率下测试网站布局。

Firebug Lite

Firebug的精简版容许您检查的HTML，CSS和JavaScript代码，生活在任何页面。 你也能够编辑代码，当即测试新的变化。 这是一个开发者最喜欢的Firefox扩展Firebug的精简版。

JQuery 扩展

jQuery扩展让你在当前网页中运行JavaScript和jQuery命令。

Pretty Beautiful Javascript

该扩展可使Javascript文件更容易阅读。其整合了Beautifier和Prettify的功能，能够为代码添加语法高亮。用法是在新窗口里输入js文件的URL或者在查看HMTL源代码时点击js文件的连接。若是是在Chrome的控制台里的资源选项里查看代码则推荐使用Chrome自带的"pretty print"功能，也就是点击"{ }"图标。

IE Tab

在Chrome中打开IE浏览器标签页，你能够打开一个标签来运行Internet Explorer，让你看到的网页在IE浏览器看起来如何。

参考文献

10个针对Web开发者的优秀Chrome插件