分享一個實現夜間模式的瀏覽器擴展

最近花了些時間，作一個瀏覽器上實現夜間模式的擴展。目前已在谷歌、火狐、360瀏覽器中上架，從瀏覽器擴展/附加組件中搜索「夜間助手」便可安裝使用。

一些演示

爲何要作這個擴展？

就咱們程序員的工做而言，須要長時間地接觸瀏覽器，或在瀏覽器上進行開發，或搜尋一些資料、教程等。但長時間的白底黑字，以及在晚上瀏覽時，屏幕會讓人感受比較刺眼，這樣既不利於咱們溫馨地上網，也不利於眼睛的健康。

不過瀏覽器中早有一些夜間/護眼的擴展，爲何還要本身開發呢？按照個人使用經驗，它們大多有如下一些問題：

1. 平臺單一，不少擴展只出如今一個瀏覽器上。若是想在其餘瀏覽器上獲得相似的效果，只能尋找其餘擴展。
2. 過渡效果不佳，刷新頁面或打開一個新標籤時，會有很明顯的白色背景一閃而過，這是一個比較致命的問題（這裏指頁面已經加載完成後的空白，擴展受限於瀏覽器，頁面還未加載時的空白暫無解決辦法，在某些瀏覽器中安裝深色主題能夠緩解這一問題）。
3. 侵入性強，直接改變了原網頁的背景、文字顏色等。合理的搭配在某些時候能夠起到良好的效果，但也可能形成原網頁模糊不清，色彩混亂。

因此做爲開發瀏覽器擴展的小白，也以爲有必要本身作一個夜間模式擴展，畢竟這跟本身的工做、生活息息相關。

因爲這裏不是「從零開始作一個瀏覽器擴展」的教程，關於技術就不過多解釋，實際上該擴展的代碼也十分簡單。下面能夠分享一些參考文檔，以及在谷歌、火狐、360瀏覽器中開發擴展的一些異同，供感興趣的小夥伴們參考。

在谷歌、火狐、360瀏覽器中開發擴展的區別

各瀏覽器的擴展開發文檔

• 谷歌瀏覽器： developer.chrome.com/extensions/…
• 火狐瀏覽器： developer.mozilla.org/zh-CN/docs/…
• 360瀏覽器： open.se.360.cn/open/extens…

按照做者的經歷，它們之間大同小異。谷歌瀏覽器擴展能夠不加修改地發佈在360瀏覽器上，而在火狐瀏覽器上，基本上把chrome對象改成browser就能夠正常運行了，因此上面的文檔只學習一個就差很少了。

因爲做者剛接觸瀏覽器擴展開發不久，上面的表述還只是泛泛而談，更多的仍是須要自行探索。

最後

此擴展的功能還不是太完善，目前只實現了拖動調節屏幕亮度的功能。歡迎你們使用(夜間助手)，若有建議歡迎提出，後續會考慮改進。

源碼地址：Night-Mode