背景
20天前, 釋出了一篇文章講述我自己寫的瀏覽器外掛, 幫助自己在閱讀微信讀書網頁端的時候解放雙手的故事. 主要核心點就是自動閱讀. 本次釋出做了很多更新, 先睹為快!
當時我就是寫著玩的, 一個非常小眾場景的小眾需求, 卻沒有想到使用的人還挺多的. 期間有2個人讓我印象非常深刻.
這個世界不只有程式設計師
路人甲
一個類似花開富貴頭像的老哥+了我好友, 說是無法安裝外掛. 於是就有了以下對話.
到這我真愣住了. 這是啥意思? 讓我寫個微信讀書app嗎? 於是我就追問
原來他不懂技術啊. 我以為是同行呢. 隨後我就遇到了第二個路人
路人乙
我釋出外掛沒幾天就有人到了專案倉庫給我提issue
都會提issue了, 這總是同行了吧?
居然又不是. 我才意識到, 我隨手寫的外掛居然能幫助到很多外行. 說實話, 這時候我有點成就感了. 我相信大家一定經歷過這個心理狀態, 就是用自己的技術幫別人解決了很剛需的痛點.
大刀闊斧重構
既然那麼久多需要這款外掛, 那我可得好好打磨打磨了.
從龍珠換成高科技的機器人
Before
之前是一顆龍珠, 滑鼠hover會亮一下. 這裡用龍珠沒有任何含義, 單純實在不知道該放什麼.
After
這次我換成了科技感十足的機器人, 更有'助手'的感覺.
列舉畫素替換為百分比調整
Before
對於頁面寬度設定, 列舉了幾個常用的尺寸. 而這種方式有個弊端, 就是在大顯示器上, 2000px也許是最大值了, 而對於筆記本尺寸2000px則可能出現了滾軸.
After
百分比的設定更適合不同的顯示器裝置. 當你設定為百分百時, 任意尺寸的裝置都是滿屏的體驗.
適配雙欄
這個就沒有Before了, 因為我開發的時候還沒有這玩意. 前不久官方才推出的雙欄模式
所謂雙欄, 則是頁面不再以滾動的方式閱讀, 而是和紙質書籍一樣翻頁閱讀. 那麼就不存在自動閱讀的場景了, 只有翻頁. 為此我做了兩件事情.
- 雙欄模式也支援設定屏佔比. 也就是百分比的設定也對雙欄模式生效.
- 翻頁不只是方向鍵可用, 滾軸、wasd都可使用.
修復海量bug
因個人水平和精力有限, 無法覆蓋所有測試場景. 比如在有些書籍下, 滾軸無法使用等嚴重問題. 這些問題在這次大重構中都得到了充分的驗證與修復. 如果還有什麼問題, 歡迎留言或者聯絡我.
獨一無二的logo
在商店輸入"微信讀書助手"關鍵詞, 能查到一堆差不多logo的
因為這就是微信讀書官方的logo. 本來也沒啥, 但是當各個外掛都開始使用這個logo的時候, 就有點真假美猴王的味道了.
我選擇用AI生成了一個類似的logo, 外掛名字上也帶上了我自己的標識.
上架更多商店
在一開始我只上架了火狐和谷歌. 谷歌不多說, 標配產品. 而火狐並不是因為有多好用, 而是我這麼多年一直習慣除了開發以外的場景都用火狐. 其他瀏覽器商店, 我壓根就沒考慮.
而普通人, 用chrome的比例其實並不高, 360、edge、safari等, 市佔率並不低. 因為普通人並不知道什麼叫瀏覽器相容, 只知道電腦裡有啥瀏覽器就用啥. 我的這款產品並不是針對程式設計師的, 為了幫助到更多的人, 我開始上架360、edge等. 但是不得不說, 稽核是真的慢, 不同的廠商有不同的慢法.
火狐瀏覽器
每個版本我都會上架. 但是都0.0.8了, 現在上架的版本中最新版卻是0.0.4
360瀏覽器
稽核中, 一個版本也沒能上線
Edge瀏覽器
稽核中, 也是一個版本都沒能上線
谷歌瀏覽器
還真別說, 谷歌就是谷歌, 稽核的真挺快的.
非常棘手的bug
在之前的版本中存在一個非常複雜的bug, 在極個別情況下, 滾動滾軸時頁面反覆跳躍. 這個bug的根本原因是微信讀書存在一個特殊的場景, 在後續我會專門開篇講述這個bug的前因後果以及為什麼無法修復.
商店地址
- Chrome: 微信讀書助手 - 前夕
- Firefox: 微信讀書助手 - 前夕
- 360: 稽核中
- Edge: 稽核中
倉庫地址: https://github.com/Eve-Sama/weread-web-extension
我是前夕, 專注於前端和成長. 公眾號: 前夕小課堂
轉載需註明出處