整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
家好，我是 Echa。
今天來分享 50 個超實用的 Chrome 瀏覽器擴展！
JSON Viewer Pro 用于可視化JSON文件。其核心功能包括：
輸入界面如下：
格式化之后：
JSONVue 是一個JSON數據查看器，主要用來格式化JSON數據：
Library Sniffer 是一款給開發者使用的工具，能夠探測當前網頁所使用的類庫、框架和服務器環境，為開發者提供了方便。
Wappalyzer 擴展可以用來識別網站背后的底層技術。通過此擴展，可以了解特定應用程序是否是用 React、Vue、Angular、PHP等編寫的。還可以訪問有關 Web 服務器、編程語言、框架、內容管理系統、分析的信息工具、數據庫等。
WhatRuns 擴展程序只需單擊一下即可找到任何網站上使用的技術。
使用PerfectPixel插件可以將設計圖加載至網頁中，與已成型的網頁進行重疊對比，以幫助開發和設計人員規范網頁像素精度。這是一款可以優化前端頁面顯示的Chrome插件。
可以使用此擴展程序快速清除緩存，無需任何確認對話框、彈出窗口等。可以在選項頁面上自定義要清除的數據和數量，包括：應用程序緩存、緩存、Cookie、下載、文件系統、表單數據、歷史記錄、索引數據庫、本地存儲、插件數據、密碼和 WebSQL。
VisBug 是一個使用 JavaScript 構建的開源網頁設計調試工具，它可以讓用戶使用點擊式和拖放式界面來查看網站的元素。
Debug CSS 是一個幫助調試CSS的插件。他可以顯示出頁面元素的輪播，按住Ctrl，并將鼠標懸浮在元素上，即可查看其信息：
CSS Viewer 是一款適用于 Web 開發人員的高效 Chrome 擴展。顧名思義，CSS 查看器可以顯示將鼠標懸停在任何網頁上的元素的 CSS 屬性。
EditThisCookie 是一個 cookie 管理器。可以添加，刪除，編輯，搜索，鎖定和屏蔽cookies。
React Developer Tools 是開源 JavaScript 庫 React 的 Chrome DevTools 擴展。它允許我們在 Chrome 開發者工具中檢查 React 組件層次結構。安裝此插件之后，將在 Chrome DevTools 中獲得兩個新選項卡："?? Components" 和 "?? Profiler"：
Vue.js devtools 是一款基于chrome瀏覽器的用于調試Vue.js應用程序的插件，可以使得開發人員大大提高調試效率。支持用戶對DOM結構數據結構進行解析和調試功能。
Augury 可以幫助開發人員在 Google Chrome 瀏覽器中調試和分析 Angular 應用程序。
Firebug Lite是火狐瀏覽器中著名的開發者工具firebug插件移植到Chrome中的插件，在Chrome中安裝了Firebug Lite插件以后，開發人員可以像在火狐瀏覽器中使用firebug一樣熟悉的方式來調試網頁內容，其包含了基本的HTML、CSS以及Javascript的調試功能，用于幫助網頁前端開發工程師快速地調試網頁，以便及時地找到網頁中的BUG并及時修復。
HTML Validator 在 Chrome 的開發者工具中添加了 HTML Validator。HTML 頁面的錯誤數通過瀏覽器狀態欄中的圖標顯示，詳細信息可以在瀏覽器的開發者工具中查看。
Web Developer 擴展為帶有各種 Web 開發工具的瀏覽器添加了一個工具欄按鈕。該擴展適用于 Chrome 和 Firefox，并且可以在這些瀏覽器支持的任何平臺上運行，包括 Windows、macOS 和 Linux。
Requestly 是一款Chrome和Firefox瀏覽器插件，提供URL轉發、修改HTTP請求和結果、插入腳本等功能。
Window Resizer 主要用來調整瀏覽器窗口的大小以模擬各種屏幕分辨率。
Responsive Viewer 是在一個視圖中顯示多個屏幕的 Chrome 擴展程序。該擴展將幫助前端開發人員在開發響應式網站/應用程序時測試多個屏幕。
此插件允許直接從瀏覽器發送跨域請求，而不會收到跨域錯誤。可以使用此插件覆蓋 Request Origin 標頭，并將 Access-Control-Allow-Origin 設置為 *.
ColorPick Eyedropper 是一個放大的吸管和顏色選擇器工具，可讓從網頁等中選擇顏色值。
CSS Peeper 用于檢查和復制元素樣式的優秀工具，使用 CSSPeeper 可以將鼠標懸停在網頁中的任何元素上，然后單擊鼠標即可復制元素的樣式。
24. Dimensions
Dimensions是一款能幫助使用者對網頁上各種元素屬性之間的距離進行測量的Chrome頁面元素測量插件，該插件在點擊啟動插件圖標后，可以對頁面中圖像、輸入字段、按鈕以及視頻等頁面元素之間上下左右的方位尺寸進行測量，同時還可以通過使用快捷鍵來快速啟用或關閉該插件的功能，簡單實用。
Site Palette 用于生成調色板。設計師和前端開發人員必備的工具。可以通過這款插件輕松獲取網站的配色方案。
ColorZilla 是一款功能強大地提取網頁色彩的工具；也是個快速的對顏色進行調節的Chrome插件，許多的用戶將這款軟件稱呼為顏色吸取插件，它提取的顏色是非常的多樣化，還可生產css顏色的代碼等。
當我們想查看網頁中文字的字體時，最常用的方法就是在控制臺查看文字的字體樣式。那還有沒有更簡單的方法呢？WhatFont 就是一個查看網頁字體的Chrome擴展。只需要的點擊擴展圖標，再點需要查看為文字即可：
Fonts Ninja 可以從任何網站識別字體、添加書簽、試用并購買它們。
使用 BrowserStack 快速啟動擴展在任何瀏覽器中啟動一個新的測試會話。最多可設置 12 個瀏覽器以實現快速訪問并最大限度地減少切換瀏覽器所花費的時間。
Toby 是一款 Chrome 新標簽頁工具，能夠將未讀的標簽頁分組顯示在新標簽頁中，這樣就能把所有未看完的標簽頁都關閉了。分組相當于多個 Chrome 窗口，將你的標簽頁都拖進 Toby 中，就不需要實時開著占地方了。
該擴展提供了每日熱門開發者新聞，不需要再浪費時間搜索高質量的文章了。
Momentum 擁有漂亮的新標簽頁面，每日更新精彩背景壁紙圖片，可設置每日新鮮事焦點以及跟蹤待辦事項，無廣告，無彈窗。
The Great Suspender 是一個輕量級的擴展用來減少 Chrome 的內存占用。如果同時打開許多選項卡，在可配置的時間之后未查看的選項卡將在后臺自動掛起，從而釋放該選項卡消耗的內存和 CPU。
Session Buddy是一個可以幫助用戶查看、新增、編輯當前網站Session狀態的Chrome插件。用戶可以利用該插件保存網站當前的狀態以便在關閉Chrome或關閉計算機后恢復，從而達到節省內存的作用。
Octotree 旨在讓 GitHub 體驗更好。通常，為了檢查 Github 中的子文件夾，需要手動單擊文件夾并導航。Octotree 擴展解決了這個問題。此擴展在項目的左側顯示存儲庫的目錄結構，這有助于更好地理解文件夾結構。
1_EKF88oqIyX6FzgueCKdtXg.gif
File Icons for GitHub and GitLab 可以將 GitHub 和 GitLab 上的原始文件圖標替換為特定文件類型的圖標。
ax DevTools 是一個快速、輕量級但功能強大的測試工具，由 Deque 開發的世界上最值得信賴的可訪問性測試引擎 axe-core 驅動。使用 ax DevTools 在網站開發過程中查找并修復更多可訪問性問題。
OctoLinker 可以將特定語言的語句（如 include、require 或 import）轉換為鏈接。當打開一個包含多個導入語句的文件并且想要快速打開它時，只需將鼠標懸停在鏈接的文件上并單擊即可打開。
此擴展可幫助 Web 開發人員分析網頁是否違反最佳實踐。
Check My Links 是一個鏈接檢查器，它可以抓取網頁并查找損壞的鏈接。
Checkbot 是用于驗證一組HTML頁面上的鏈接的工具。Checkbot可以檢查一個或多個服務器上的單個文檔或一組文檔。它會創建一個報告，該報告匯總了引起某種警告或錯誤的所有鏈接。
Google Page Speed Insighs 是一款旨在優化所有設備上的網頁、提高網頁加載速度的工具。
META SEO inspector是一款可以幫助用戶分析網頁的meta信息并得到SEO評估的谷歌瀏覽器插件。
Ghostery 是強大的隱私保護擴展程序。其主要有以下功能：
AdBlock 用來在YouTube、Facebook、Twitch和其他你喜愛的網站上攔截廣告和彈窗。
番茄工作法（Pomodoro?）時間管理助理。? 長短兩種休息時間 ? 帶有倒計時顯示的工具欄圖標 ? 追蹤Pomodoro歷史和統計訊息 ? 可配置的長休間隔 ? 可配置的定時器時長 ? 桌面與新標簽頁通知 ? 超過20種音效可選的聲音通知 ? 計時器秒針走動音效
Loom 可以用來快速錄制視頻，并且能夠將錄制的視頻上傳到指定的網頁中，Loom還支持在用戶點擊啟動插件時，立即捕捉屏幕圖像，同時開始視頻錄制操作，還可以將錄制好的視頻復制到粘貼板中存儲。
GoFullPage 是一款全屏截圖插件（整個網頁截圖），完整捕獲您當前頁面的屏幕，進行滾動截圖，而無需任何額外的權限。單擊擴展程序圖標，然后將其傳輸到屏幕快照的新標簽頁中，可以在其中將其下載為圖像或PDF，甚至只需拖動即可，保存到桌面。
BetterViewer 可以提供更好的圖像查看體驗，旨在替代基于 Chrome 瀏覽器中內置的圖像查看模式。使用時，只需在頁面右鍵點擊圖片，選擇“在新標簽頁中打開圖片”即可。
svg-grabber 是一個快速預覽并從網站獲取所有 svg 的工具。可以用來預覽、下載和復制網站中所有 SVG 圖標和插圖的代碼。
第一步， 先關注我】
大家好， 我是胡侃侃。
相信絕大部分人心中最好用的瀏覽器是谷歌Chrome瀏覽器，它簡潔、快速、穩定、而且有著豐富的拓展插件。 然后我這里用了十幾年的Chrome吐血推薦Microsoft Edge 瀏覽器。
而且Microsoft Edge 瀏覽器本身是基于基于谷歌 Chromium 內核的全新瀏覽器，具有像Chrome 瀏覽器一樣的高效穩定的特點。 Microsoft Edge瀏覽器， 最大的優勢在于和系統深度整合， 還實現了Chrome賬號輕松同步。 Edge內置的網頁休眠功能同樣也是好用到起飛。 當然用Edge來替換掉手上的國產瀏覽器也是一個不錯的決定。
傳送門>>
本篇是基于Chrome和Edge瀏覽器的插件， 通過使用這些插件來提高瀏覽器的效率， 讓本身已經非常方便的瀏覽器， 更加強大和增加效率。 本文瀏覽器插件下載是以Edge瀏覽器為準， 在Chrome下面有同名的插件， 需要大家自己去搜索一下。 但Chrome因為Google被關閉訪問的問題， 所以有些插件獲得并沒有那么容易。
在Edge外接程序界面直接搜索和下載， 傳送門>>
下面我們來點評一下有哪些神級插件， 可以讓我們的工作效率得到翻倍提升吧。
一句話點評， ublock origin，比adblock功能更強，資源占用更低。
來自值友的@GN-001的點評，
ublock現在已經非吳下阿蒙了，adblock已經老已了，ublock的元素抓取比較麻煩，adblock方便點，但是adblock太臃腫了，大家打開第一個頁面ublock而可以，但adblock無法攔截!而且占用很高！我用adblock很久了后來出現這個問題，我就在群里問了下他們，他們叫我試試ublock后面就再也沒有換回去了！ublock的抓取元素是有問題的，多個元素在一起他不能一起抓只能一個一個，但他有個問題，他一次只能抓一個，你重新抓的時候他之前抓的就失效，不知道是我不會操作還是本來就有這個問題！adblock就完全沒有這個問題，adblock交互好點！易用點！
傳送門>>
傳送門>>
老牌廣告攔截器， 一款被稱為最佳廣告攔截的工具，在谷歌開發者商店有著破十億的下載量，可想而知它是多受歡迎的呢！Adblock的強項就是攔截過濾網頁廣告，無論是視頻廣告、橫幅廣告，還是彈窗廣告，它都能有效攔截。
AdBlock 是最好的廣告攔截工具，擁有超過 6500 萬用戶，同時也是最受歡迎的擴展程序之一，下載量已突破 3.5 億！
傳送門>>
Infinity New Tab Pro 讓你可以自定義你的新標簽頁. Infinity新標簽頁 (Pro) 將原生新標簽頁替換為您保存的書簽，并提供了多種快捷實用的功能。 自定義標簽頁，可以將網頁裝扮成類似安卓的應用，支持多種搜索引擎切換，支持切換各種精美壁紙，具有 數據備份同步功能。
谷歌很多功能現在都已經無法使用了， 我過去很多信息都保留在Gmail里面， 這里使用這個可以訪問google搜索，gmail，谷歌學術搜索等谷歌產品， 不包含Youtube 谷歌Drive。 傳送門>>
有人說： 如果一個瀏覽器沒有安裝油猴，那可以說是沒有靈魂的。油猴腳本與擴展的功能大致相同，都是賦予瀏覽器更多實用功能，但相比之下更加輕便。
在Microsoft Edge上面， 油猴叫做Tampermonkey。 最早是Mozilla Firefox的一個附加組件， 在FF上面叫Greasemonkey。它讓用戶安裝一些腳本使大部分HTML為主的網頁于用戶端直接改變得更方便易用。Greasemonkey可替網頁加入些新功能、修正網頁錯誤、組合來自不同網頁的數據、或者數繁不及備載的其他功能。寫的好的Greasemonkey腳本甚至可讓其輸出與被修改的頁面集成得天衣無縫，像是原本網頁里的一部分。
現在油猴也是一個跨瀏覽器的用戶腳本插件， 支持Edge，Chrome，FF等多種主流瀏覽器。
傳送門>>
安裝完成油猴以后， 可以看到瀏覽器右上角有一個油猴的圖標， 點擊圖標， 點擊獲得新腳本， 即來到了油猴的安裝腳本頁面。
我這里舉個例子， 我看微博， 只想看我關注過的人， 去除一些不需要的微博推薦， 這樣的過濾腳本， 在油猴里面叫做， Yet Another Weibo Filter。
我們來到了油猴腳本安裝頁面Greasy Fork， 可以直接點擊， 安裝此腳本。 也可以查看這個腳本被下載過多少次。
如上圖， 搜索， Yet Another Weibo Filter。
其實很多用戶， 和我一樣并不希望進入 GreasyFork，去手動查找用戶腳本，或者我根本就不知道這個網站是不是有可以優化的腳本。 那么下載這個Userscript+, 這個腳本可以自動發現適合當前網站的腳本。
暴力猴是一個開源的腳本管理器， 暴力猴是一款非常強大瀏覽器腳本的管理工具。暴力猴的使用要更加方便，而且同樣強大，通過安裝相應站點的腳本信息，我們可以更加方便的進行各類操作。例如：電影站點的解析、網盤的高速下載、資源搜索與下載、廣告屏蔽等等。 回頭我會仔細說說暴力猴和油猴。
值友點評：violent monkey易用性比tamper高多了。
傳送門>>
傳送門>>
值友@娜娜奇推薦： 目前用的crxMouse,也不知道是不是最優解。這個還支持超級拖拽。目前發現這個插件，如果在新建空白tab中和加載失敗的頁面中會鼠標手勢失效
也有值友推薦了smartUp手勢， 這個我沒有用過， 我也展現出來供大家參考。
傳送門>>
值友點評： lastpass安全性不如keepassxc，多機同步可以用網盤中轉，手機也一樣用
傳送門>>
傳送門>>
這個擴展可以讓你上網只記住一個密碼，便可以登錄所有需要密碼的網站。在安裝該擴展之后首次登錄需要密碼的網站時，擴展會自動記錄下你的密碼，下一次就不需要輸入了。雖然會記錄你的密碼，但這個擴展一定是安全的，所以不必擔心安全問題。
LastPass是免費的密碼管理器，跨平臺同步，自動登錄， 只需要記住一個賬戶密碼， 就可以管理所有賬戶密碼。 解決了密碼難記的問題。
風險提示： 銀行密碼重要信息密碼不要交給他管理， 另外這個只有密碼提示， 無法找回密碼。
同樣的一個密碼管理器
傳送門>>
工具很強大，支持的筆記很多，支持ervernote, onenote, 語雀，為知等所有主流筆記，支持markdown，支持圖床，體驗絕對比原版的好。傳送門>>
傳送門>>
印象筆記·剪藏(Evernote Web Clipper)， 使用印象筆記·剪藏擴展程序一鍵保存精彩網頁內容到印象筆記帳戶，不用復制粘貼編輯再整理，信息收集快人一步。看見什么，「剪」什么。 調研好幫手，剪藏任意文章或網頁， 保存到指定筆記本，并添加網頁， 用印象筆記同步到任意設備， 搭建個人知識庫。
傳送門>>
免費的筆記管理軟件和印象筆記·剪藏一樣的功能，可以保持網頁內容至OneNote，OneNote為Win10系統自帶office軟件。
官方出品的瀏覽器主題皮膚， 使用全新瀏覽器主題個性化設置 Microsoft Edge，此主題的靈感源自 Master Chief 在神秘的外星人環形世界(稱為 Halo)中的歷險經歷。此主題更改了瀏覽器和新標簽頁的外觀，營造出靈感源自游戲的精美而又引入入勝的視覺體驗。你還可以將不同主題應用至各個個人資料，以便輕松區分家庭、學校或工作。傳送門>>
傳送門>>
該插件可以幫助用戶在打印網頁或者PDF文件之前對打印的內容進行調整，比如調節打印的字體大小、去除打印頁面中的所有圖片、刪除網頁中的廣告、刪除多余的文字等方便的自定義打印的功能。
傳送門>>
優秀的截圖插件, 可以捕獲任何網頁的全部或部分。添加注釋，評論，模糊敏感信息，以及一鍵上傳。
傳送門>>
圖片助手(ImageAssistant)是一款運行于chromium(chrome環境下開發)及其衍生瀏覽器(如：360安全瀏覽器、360極速瀏覽器、獵豹瀏覽器、百度瀏覽器、UC瀏覽器等)提供分析、提取網頁中的圖片并以多種篩選方式輔助用戶選取下載等功能的瀏覽器擴展軟件。
傳送門>>
是否看到網頁、微博上的視頻很想保存留念或使用， 這個插件一鍵下載網頁中的視頻
傳送門>>
使用更純凈的百度 1.屏蔽百度廣告推廣 2.阻止百度追蹤 3.去除百度資訊與熱榜。
這篇文章總結了前面幾篇關于Edge瀏覽器經驗的合集， 每一個都是本人自己嘗試過無數次以后的經驗總結，分享給大家，
收藏不等于會了。
收藏不等于會了。
收藏不等于會了。
收藏是點贊的十倍， 為什么， 同學們！
這么養眼的文章難道不點贊嗎？ 點贊美三代， 關注富一生！
更多的內容歡迎關注我的個人號來查找，這樣也方便交流。
全文完~~
ublime Text 已成為了目前最流行的代碼編輯器之一。它的反應速度、簡單易用性以及豐富的插件生態，讓眾多前端開發者們為之傾倒。
為了幫助開發者們更便捷地使用 Sublime Text ，我們決定制作一個 Sublime Text 擴展列表，它包含了我們日常使用的一些插件。當然，如果我們所列舉的插件中沒有你喜歡的，也隨時歡迎你在評論中與我們分享它們。
1.插件包管理器
首先，我們將從包管理器開始。Package Control 是 Sublime Text 的插件包管理器，它提供了 Sublime 中插件包的安裝與刪除。若你沒有安裝它，那么我們后續推薦的插件，你也就無法嘗試咯。
2.JavaScript 與 NodeJS 代碼段
一個用于編寫常見 JavaScript 代碼段的集合插件。為什么要費勁逐個敲下 document.querySelector（'selector'）文本，你只需要利用快捷鍵 qs，并按下 Tab鍵，剩下的代碼，Sublime 將幫你自動補全。
3.Emmet
與上述的插件類似，Emmet 也是一款讓你更快捷編碼的插件。但 Emmet 適用于 HTML 與 CSS 代碼的編寫，它可以讓你一次性輸入長標簽、嵌套元素或者整個頁面模板。
如果你覺得 Emmet 有些復雜，那么你可以嘗試一個叫做 HTML 代碼段的插件。它更簡單易用，并且使用文檔寫的也很直接。
譯者注：Emmet 的前身是大名鼎鼎的 Zen coding，相信前端開發者們不會陌生。這里再分享一個使用手冊，希望對你有所幫助。
4. Advanced New File
一款助你在 Sublime 中快速創建新文件的插件。你只需要使用菜單，并利用快捷鍵 ctrl+alt+n打開提示框，寫入新文件的路徑，即可配置新文件。
該插件還支持自己編寫路徑保存，甚至文件夾的名稱也可以自動完成。
5. Git
一款可以直接在 Sublime 命令選項面板中工作的 Git 集成插件。該插件提供了一些常用的 Git 命令，你可以在 Sublime 中完成，諸如添加、提交或查看 Git 日志等功能。
6. GitGutter
一個非常實用的 Sublime 擴展。它會告訴你自上次 Git Commit 以來已經改變的代碼行，并給出相應的概述。你也可以用它來與你已提交到 Git 上的文件進行詳細的對比。
7. Side Bar Enhancements
在 Sublime Text 中，你可以在左側面板中了解正在進行的項目。雖然，它為你提供了一些使用文件的基本選項，但默認的操作是相當有限的。
當你右鍵菜單選項的時候，這個插件將會為你提供超過 20 個選項來增強你的可操作性。包括在瀏覽器中打開、復制以及其他有用的功能。
8. ColorPicker
一個小巧實用的取色器。它可以快速地抓取十六進制的色值，使用非常簡單。你可以在單獨的窗口打開它，從調色板中取色，或使用滴管在屏幕的任意位置取色。
9. Placeholders
Sublime Text 3 有一個內置的 Lorem Ipsum（占位符） 生成器，你可以使用它來創建虛擬文本。而該插件則擴展了占位符生成器的功能，你就可以通過 Sublime Text 快速地生成占位符圖像、表單、列表和表。
10. DocBlockr
一個可以向函數添加詳細注釋的插件。DocBlockr 可以幫助你輕松地為函數添加相應的描述，包括參數、返回的值和變量類型。
11. SublimeCodeIntel
一個智能代碼自動補全插件，它能幫你索引你的源文件，并能讓你快速地找到并跳轉到相應的函數中。
所以，這個擴展適用于流行以及相對冷門的編程語言。
12. Minify
一個代碼美化與壓縮的插件，適用于 CSS、HTML、JavaScript、JSON 和 SVG.
此包依賴于外部 Node.js 庫進行縮小和美化，故你需要單獨安裝它們。
npm install -g clean-css uglifycss js-beautify html-minifier uglify-js minjson svgo
13. Sublime Linter
此插件能夠幫助開發人員檢測代碼中存在的語法錯誤，不規范的或者錯誤的代碼寫法。它支持各類開發語言。
但 Sublime Linter 本身只是一個基礎的框架，所以使用的時候，你還需要安裝單獨的插件來滿足不同語言的使用需求。
14. Color Highlighter
你可以在許多 IDE 和文本編輯器中看到顏色高亮功能，而 Sublime 中是不支持顏色預覽的。但是，有了這款插件，在你使用 Sublime 時就能夠幫你檢測出 CSS 文件中的顏色碼。無論是 Hex 碼，或是 RGB 碼都能很好的顯示。
15. Language Packs
雖然 Sublime Text 具有超過 50 種編程語言代碼的高亮顯示。但是，仍然有部分框架和 Web 開發語言，目前還不支持。不過，由于編輯器插件的性質，社區也能夠為任何編程語言創建和提供相應的包。
額外的彩蛋：主題
在 Sublime Text 上安裝一個漂亮的主題，勢必會使你能夠更愉快地編寫代碼。當然，這里也有一些我們喜歡的主題與你分享：
感謝你的閱讀。若你有所收獲，歡迎點贊與分享。
注：
英文原文：15 Awesome Sublime Text Plugins For Web Development
作者：Danny Markov
譯者：IT程序獅
譯文地址：
https://zhuanlan.zhihu.com/p/52545760
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
