雖然有點標題黨的嫌疑，但是內容絕對是滿滿的的乾貨。很多擴展功能比較單一，直接用一張圖就能很清楚說明它的用途啦。出於篇幅的限制，我在這裡會重點介紹一些我個人比較用得上的一些擴展。因為平時前端開發的比較多，所以偏向前端程序員的擴展可能會比較多一些。

我本人對 chrome 擴展比較挑，一般有同類型的擴展我會選擇維護比較積極的，使用人數更多的。像有些 3 年都沒更新過的擴展我基本上是不會用的，除非這個擴展本身功能比較簡單，不需要更新。我平時有事沒事就會去 chrome 擴展市場去逛逛，所以積累的優秀擴展比較多。一大波圖片即將襲來, 請在 wifi 條件下或者流量充足的情況下閱讀。

讓 chrome 更好用的擴展

Chrome Better History

這是一個用來替代 chrome 自帶的查看歷史記錄功能的擴展，界面設計的很簡潔，比較贊的是可以很方便的查看不同日期的歷史記錄。

Grammarly for Chrome

其實包括很多編輯器和 ide 都有類似的擴展用來糾正英文的拼寫錯誤。當你在網頁中的編輯框中編輯文本時，這個擴展能提示你單詞的拼寫錯誤，你少了標點符號和混淆單詞提示等, 高級版功能更多，不過標準版就已經夠用了。

Webtime Tracker

統計你瀏覽各個網站的時間，以圓環圖和列表的形式展示，簡潔專一。

uBlock Origin

攔截廣告的擴展有很多，比較有名的有 Adblock，Adblocks plus，AdGuard， uBlock Origin 等，各有各的特點，挑一個安裝就行了，安裝多個完全沒必要，浪費內存還容易起衝突。感覺用來攔截廣告的擴展後，瀏覽網頁就沒怎麼碰到過噁心的廣告，彈窗了。清爽了不少，實在必備神器啊。

Enable Copy

遇到限制複製粘貼和右鍵的網頁是不是很頭痛？安裝這個擴展後，點下擴展按鈕就能解決了～

Chrome清理大師

非常輕巧實用的清理工具，沒有其他亂七八糟的功能。

高效網頁截圖編輯擴展

這款截圖工具不但截圖功能豐富，還可以在截圖之後直接標註。

劃詞翻譯

一款小巧實用的劃詞翻譯工具，設置項很豐富。

Wappalyzer

一款可以分析網站用到的技術框架的擴展。

IP Whois & Flags Chrome & Websites Rating

可以顯示網站的國旗和其它信息。

另一款更強大的 ip 分析擴展是 IP Address and Domain Information

擴展管理器（Extension Manager）

簡單易用的擴展管理器，點擊已啟用的擴展圖標即可禁用，還有搜索和分組功能。

Copyfish ?? Free OCR Software

一個 ocr 文字識別擴展。

Markdown Preview Plus

一款可以讓你在瀏覽器中閱讀 markdown 文件的擴展，配色還是挺護眼的。

Markdown Here

官方描述:

Markdown Here允許你在發送電子郵件之前用Markdown語法編輯並轉換它(讓它看起來漂亮極了!)。

?這對於那些不喜歡在撰寫電郵時反覆擺弄排版按鈕的人無疑是好消息。 它特別適合那些要在電子郵件中插入代碼的程序員們 —— 沒錯，它甚至支持語法高亮顯示。 對於我們之中的數學家們而言，Markdown Here也支持轉換TeX公式。

類似的網站 - 發現相關網站

Proxy SwitchyOmega

代理管理擴展，方便快速切換各種代理模式。

Tampermonkey

很多網友叫這個擴展叫油猴，本質上是一個管理注入網站的 javascript 腳本的擴展。使用它我們可以自定義某個網站打開時注入的腳本，也可以去一些論壇直接安裝別人分享的腳本。油猴搭配 idm 對於治療百度網盤蝸速有奇效,，比較受歡迎的腳本還有破解會員之類的。推薦腳本源 greasyfork, 還有一個顯示當前網站所有可用腳本的腳本 Userscript+。

Stylus

油猴是用來注入 javascript 腳本的，而這個是用來注入 css 樣式的。

Infinity 新標籤頁

這個擴展被太多人推薦過了，非常良心的一款新標籤頁擴展，有很多地方都可以自定義。本文的封面就是這個擴展。

HTTPS Everywhere

加密網路瀏覽，自動使用 HTTPS 連接訪問站點，更加安全。

還有一些都用得上的擴展我就簡單列一下：

  • Black Menu for Google? 一個菜單擴展讓你快速使用 Google 提供的各種服務
  • crxMouse Chrome? 手勢 極大的擴展了 chrome 的手勢功能
  • Fatkun圖片批量下載
  • IE Tab 解決 chrome 無法使用網銀的問題
  • Note Board - Sticky Notes App
  • MEGA 免費 50 G 的網盤
  • Office Online 在瀏覽器中查看、編輯和創建 Office 文件。
  • PDF Viewer chrome 瀏覽 pdf
  • Screencastify - Screen Video Recorder 網頁錄屏
  • OneTab 合併所有標籤頁，節省內存
  • Tabs Outliner 將標籤頁樹狀顯示
  • Speedtest by Ookla 測試網路速度和打開網頁的速度
  • Surfingkeys
  • Vimium 像 vim 一樣操控網頁
  • Volume Master 音量調節器
  • 為什麼你們就是不能加個空格呢？
  • Listen 1 音樂聚合
  • Video Speed Controller 視頻加速擴展，可以用來做壞事（。＾▽＾）
  • Hover Zoom 滑鼠懸浮到圖片上顯示大圖
  • 右鍵搜 擴展右鍵菜單
  • 關燈看視頻

網站加強擴展

github 相關的擴展比較多。

Awesome Autocomplete for GitHub

加強 github 的搜索框。

File Icon for GitHub, GitLab and Bitbucket

給 github 倉庫文件添加圖標。

Octohint

github 代碼智能高亮。

OctoLinker

直接從代碼跳轉到 gtihub 對應倉庫。

Isometric Contributions

立體顯示 github Contributions 的擴展。

Octotree

在左側添加一個文件瀏覽器，可以更快的在文件之間跳轉。

Sourcegraph

這個擴展厲害了，將 github 變得和 IDE 一般，集成各種功能。

和 github 相關的還有幾個我就簡要介紹一下了

  • GayHub
  • Refined GitHub 這個和上面的都是對 github 整體進行加強的擴展
  • GitHub Hovercard 這個加強了 github 懸浮在某些元素上的功能

v2ex plus

官方介紹：

優雅便捷的 V2EX 擴展

  • 帖子會話詳細.
  • 帖子列表主題預覽.
  • 只看樓主功能.
  • 樓主回復背景色高亮(顏色可自定義).
  • 感謝愛心顏色自定義.
  • 插入表情與圖片(weibo或imgur).
  • 回復內圖片旋轉.
  • 一鍵簽到與自動簽到.
  • 新消息通知提醒並改變擴展按鈕顏色.

One more thing... ^-^

YouTube?廣告攔截器

這個廣告攔截器會刪除YouTube上的所有廣告。前貼片視頻廣告，文字和橫幅廣告。

還有一個和 youtube 相關的擴展 Magic Actions for YouTube?

眼不見心不煩（新浪微博）

新浪微博加強擴展，不過評論有些負面評價，我也不知道是不是真的，平時不怎麼玩微博。

新浪微博圖牀

簡單好用的新浪微博圖牀,支持選擇/拖拽/粘貼上傳圖片,並生成圖片地址,HTML,UBB和Markdown等格式,支持瀏覽和刪除歷史記錄

嗶哩嗶哩助手：bilibili.com 綜合輔助擴展

嗶哩嗶哩彈幕網輔助擴展，擁有視頻區和直播區的人性化功能。

bilibili嗶哩嗶哩下載助手

bilibili 嗶哩嗶哩 B站 下載助手 幫你下載版權受限（能看不能緩存）的 番劇 視頻。

前端擴展

ColorZilla

取色器。

CSSViewer

css 查看器。

EditThisCookie

EditThisCookie 是一個 cookie 管理器。您可以添加，刪除，編輯，搜索，鎖定和屏蔽cookies！

下面是知乎登入後的 cookie 編輯頁面。

JSON Viewer Awesome

美化 json 內容。

Lighthouse

谷歌官方出品的一個網站性能測試，分析擴展。

下面是這個擴展生成的知乎首頁的一份測試報告，可以看出知乎根本沒做 pwa 。

LiveReload

一款讓你不使用 webpack 構建項目也能享受熱載入的擴展。

Page Ruler

一款尺寸測量工具。

ReRes

很實用的一個開發工具，官方介紹：

Change the response of the request. ReRes可以用來更改頁面請求響應的內容。通過指定規則，您可以把請求映射到其他的url，也可以映射到本機的文件或者目錄。ReRes支持單個url映射，也支持目錄映射。

User-Agent Switcher and Manager

這個擴展能讓你自定義網站的 user-agent，切換不同的 user-agent，查看網頁在不同的 user-agent 下的效果。

WEB前端助手(FeHelper)

這個就不用介紹了吧，很多開發者都在用，國內開發者開發的一套前端工具集。

Restlet Client - REST API Testing

一款 restful api 測試工具，不過我一般都直接用 postman。

VisBug

谷歌公司開源的一款前端設計，調試工具。

Moesif Orign & CORS Changer

解除瀏覽器跨域限制。

還有一些我就簡要介紹一下了：

  • React Developer Tools facebook 官方開發 react 開發擴展。
  • Redux DevTools redux 開發擴展
  • lucid A React-GraphQL developer tool
  • Vue.js devtools vue 官方開發 vue 開發擴展
  • Puppeteer Recorder 錄製 puppeteer 腳本
  • SEOquake 查看一個網站在各大搜索引擎的 SEO 情況

chrome app

Gliffy Diagrams

有了它，就可以替代 processon, draw.io 之類的在線畫圖工具了。

Secure Shell App

一個終端模擬器，ssh 客戶端，有興趣可以體驗一下，我自己是沒怎麼用過。

Text

一款文本編輯器，支持語法高亮，還可以保存內容到 Google Drive 上。

寫在最後的一些話

這篇文章有點長，能看到這也是不容易。很多人是文章太長就不看的（＞人＜；）。別看我說了這麼多擴展，我平時也不會把這麼多插件全開著，有些擴展還是挺佔用內存的。有些人可能不知道怎樣查看 chrome 的資源佔用情況，方法很簡單: 右擊 chrome 標籤欄可以看到一個打開任務管理器的選項。點擊就可以打開 chrome 任務管理器，在 chrome 任務管理器就可以看到各種擴展資源佔用情況。

一般情況下我只會啟用少部分我常用的擴展。我電腦內存 16 G，其實多開幾個擴展倒無所謂，我只是怕擴展之間會起衝突，或者對我的網頁內容造成一些隱性 bug，畢竟我目前還是搞前端開發的。如果有什麼問題或者你有更好的擴展推薦，不妨在評論區留言，我一般都會積極回復。

感謝您的閱讀，如果對你有所幫助不妨加個關注，點個贊支持一下O(∩_∩)O。


推薦閱讀：
相關文章