Web前端開發Chrome插件

參考：http://www.cnblogs.com/sosoft/p/3490481.html

愈來愈多的前端開發人員喜歡在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"功能，也就是點擊"{ }"圖標。

WhatFont

用於查看當前頁面使用了哪些字體，Firebug和Webkit Inspector也能夠查看字體，可是遠沒有WebFont方便，WebFont能夠經過把鼠標懸停在元素上來查看字體。同時還支持查看網絡字體，如Typekit 和 Google Font API。

IE Tab

在Chrome中打開IE瀏覽器標籤頁，你能夠打開一個標籤來運行Internet Explorer，讓你看到的網頁在IE瀏覽器看起來如何。