前端工程師-前端工程師常用工具

1、前端工程師常用工具雖然有一段時間不做前端工程師，但還是免不了做前端的思維，碰到了很好的前端實用工 具帖還是忍不住轉(zhuǎn)了過來。這個帖子被轉(zhuǎn)了好多次了，也不知道原本的作者是誰，但無論是誰都 是萬分的感謝，沒有您的整理也沒有大家的方便。 帖子整理了前端工程師常用的工具手冊以及一些著名的相關(guān)博客，是工作中不可缺少的資料。 概要： 概要： 在線工具集 常用 Firefox 插件 IE 下的調(diào)試工具 參考手冊 批處理工具 IDE 及其他工具 Bookmarklet 前端開發(fā)者社區(qū)及權(quán)威網(wǎng)站 推薦訂閱的博客和網(wǎng)站 前端開發(fā)工具集在線工具集 o o o o o o o o 棄他了 o o o o o o 其他：

2、 GUID 生成器 做某些東西(Firefox 插件)時需要唯一資源標(biāo)志符時用 W3Counter WebWait - Benchmark Your Website CSS 類： CSS 選擇器性能測試 CSSTidy CSS 格式化工具 CSS Compressor CSS 壓縮 書籍類： Book Shelf 2.0 beta 薦，分類很清晰，下載很方便 Book Go! 原版圖書免費下載鏈接收集站 51CNNET.NET JavaScript 類： Beautify JavaScript JavaScript 格式化工具，效果很理想 AJAX Libraries API Regex Te

3、ster Compressor Packer 以前一直用這個壓 JS，自從有了 TBCompressor，就放常用 Firefox 插件 支付寶安全控件 和 旺旺協(xié)議 網(wǎng)購專用，F(xiàn)irefox+浦發(fā)網(wǎng)銀，無敵了 Firebug 這個不用介紹了吧，附空幃的外部編輯器亂碼修正版o o o o o Firecooike 支持 Cookie 的查看和編輯 Jiffy 調(diào)試性能的，用起來比較麻煩，沒試過 YSlow Why Slow? YUI 出品 Pixel Perfect 把設(shè)計稿直接拖到 Firefox 里進行對比 Rainbow for Firebug JS 高亮，性能不是很理想 Fiddler

4、 開關(guān) 簡化在 Firefox 里切換 Fiddler 的操作，感謝 Taobao UED 的空幃同學(xué) Web Developer DevBoi 把 Html, Dom, JavaScript 等手冊放在側(cè)欄里，可以自定義增加，快捷鍵 Ctrl+F9?？梢栽谶@里找到更多的 Package。 RefControl 針對每個站點發(fā)送想要的 HTTP Referer GreaseMonkey 看某個網(wǎng)站不爽，寫個小腳本來優(yōu)化下還是不錯的 HttpFox 查看當(dāng)前 Http 鏈接狀態(tài)，類似 IE 下的 HttpWatch User Agent Switcher 切換 User-Agent，同時開發(fā) i

5、phone 和 web 版本的時候很方便 FoxyProxy 穿墻工具，配合專業(yè)代理公布器使用很和諧IE 下的調(diào)試工具 Fiddle2 非常強悍的一款 http 流查看工具，默認支持 IE，其他瀏覽器可以設(shè)置將 DocumentScriptsBrowserPAC.js 設(shè)為代理進行使用。 Firefox 下可用上述”Fiddler 開關(guān)”進行快速 切換。支持插件。 IE Developer Toolbar 查看元素、禁用緩存、禁用 CSSJS、Outline 元素、查看生成 的源碼等功能，IE8 自帶了一個加強版的。 Microsoft Script Debugger + Companion.

6、JS 調(diào)試 JS 用，雖然報錯還是有誤差，但是 我已經(jīng)滿足了。安裝順序是：Microsoft Script Debugger，Companion.JS，在”IE 選項-高級”里取消 取消 禁用腳本調(diào)試。 o o 多版本 IE 共存兩種方案： IE7/8 + IE Tester 大眾型配置，可以基本滿足日常需要。 IE6 + Internet Explorer Collection 在 IE 6 用戶占絕對優(yōu)勢以及 IE 6 神奇 bug 滿天飛的時代，我還是推薦這種方案，因為只有神奇的原裝 IE 6，才能抵擋運營神奇的問題。另 外如果還有其他機器可供支配的話， 建議再裝個 IE 8 + IE

7、Tester， 因為 IE 8 下的 Developer Toolbar 還是有很大改進的，調(diào)試起來會方便一些。 o o o 以下三個軟件相對不重要些： HttpWatch http 流查看 Instant Source 可查看 JS 生成的源碼 NetLimiterPro 網(wǎng)速限制參考手冊 資料。 蘇昱的 CSS 中文手冊和 Dom 中文手冊 JScript 語言參考 XML 指南 XMLHTTP 參考手冊 XHTML、CSS & DOM W3C 手冊 玉伯整理的版本，包含了 W3C 手冊以及其他有用的 jQuery 1.2.6 API 和 jQuery and jQuery UI

8、Reference 1.2 Apache 2.2 中文版參考手冊在線版 MySQL 5.1 參考手冊 (在線版) PHP 手冊 YUI Cheatsheet Cheat Sheet Roundup - Over 30 Cheatsheets for developers 23 個 Cheatsheet 打包下載批處理工具 TBCompressor 淘寶 UED 的 JS/CSS 壓縮工具，詳見玉伯的介紹 pngOptimizer png 優(yōu)化工具 jpegTran jpeg 去冗余 meta 工具IDE 及其他工具 Editplus v301 漢化版 Tortoise SVN 移動版本的 Ap

9、ache + PHP 灰?；页：糜?，灰?；页Ｒ苿?，見明城的說明 Axure 下載+注冊碼Bookmarklet(右鍵另存 右鍵另存) 右鍵另存 Firebug Lite 官方介紹 Xray 官方介紹 MRI 官方介紹 + window.document.documentElement.outerHTML+ ”>查看生成的源碼，+ window.document.documentElement.outerHTML+ ”);)()”>打開新窗口查看生成的源碼 for IE開發(fā)者社區(qū)及權(quán)威網(wǎng)站 Mozilla Developer Center (MDC) YAHOO! Developer

10、 Network (YDN) Dev.Opera Apple Developer Connection MSDN IBM Developers 中國 (Web 前端開發(fā)技術(shù)專題) WebKit AOL Developer Network SlideShare - Share PPT 在線 PPT 分享，資源豐富 Google Doctype Web 開發(fā)人員的百科全書 W3C (香港，中國) Posit ion Is Everything HTML Dog 維基百科推薦訂閱的博客和網(wǎng)站(排名不分先后 推薦訂閱的博客和網(wǎng)站 排名不分先后) 排名不分先后 o 國外 內(nèi)容聚合：A List Apar

11、t，Ajaxian，Smashing Magazine，456 berea street，Script & Style，CSS Globe，CSS-Tricks，SitePoint o o o o 國內(nèi) 內(nèi)容聚 合：Blueidea，無憂腳本，網(wǎng)頁設(shè)計師(W3CN)，JavaScript 教程網(wǎng) 團隊 Blog：淘寶，口碑，阿里巴巴國際站，阿里巴巴中文站，阿里巴巴中文站 前端開發(fā)團隊(方凳)，阿里媽媽，支付寶，阿里軟件，19 樓，九天音樂，金蝶與友商網(wǎng) o 個人 Blog，這里列出的是原創(chuàng)并更新相對頻繁的博客，如有遺漏，請告之：懌 飛，手氣不錯，Realazy，old9(需穿墻術(shù))，沙

12、灘涼鞋(空幃)，射雕(玉伯)，Aether，振之，嗷嗷， JunChen，爆牙齒，秦歌，克軍，5key，小志，Rage(正淳)，麥雞，云烈，老冒，番茄紅了，Joyqi， 盧力，CSS 森林(Ghost)，Twinsen，Gulu77，Rlog，Dlog，子鼠，西風(fēng)坊 用 Yahoo!開發(fā)團隊總結(jié)的網(wǎng)站性能優(yōu)化的 34 條黃金守則（三）JavaScript 和 CSS Yahoo!開發(fā)團隊總結(jié)的網(wǎng)站性能優(yōu)化的 34 條黃金守則（二）服務(wù)器 Yahoo!開發(fā)團隊總結(jié)的網(wǎng)站性能優(yōu)化的 34 條黃金守則（一）內(nèi)容 浮動標(biāo)簽清除浮動方法小結(jié) 前端工程師 經(jīng)典海量 jQuery 插件 一些 IE 瀏覽器不支持的很有用 CSS 屬性 Yahoo!開發(fā)團隊總結(jié)的網(wǎng)站性能優(yōu)化的 34 條黃金守則（四）圖片、Coockie 與移動應(yīng) 團隊 B