這個開發者把調試時間砍了80%，用的方法卻讓Tampermonk

從15分鐘寫代碼到1小時調試，這個比例讓多少userscript開發者血壓飆升。

一位剛發布首款產品的開發者算過賬：真正折磨人的不是寫邏輯，是DevTools窗口切來切去、CSS選擇器復制粘貼、console里翻錯誤這三件套。他花了15分鐘實現功能，調試拋光卻吃掉40-60分鐘——時間黑洞占比高達80%。

于是他做了Page Proxy，一個帶圖形界面的userscript管理器。不是取代Tampermonkey，是給寫腳本的人配了個加速器。

01 兩個痛點，一個解法

第一個痛點很具體：調試流程像打地鼠。print調試、刷新頁面、console里撈錯誤，循環往復。他想要的是DevTools的即視感，但代碼和選擇器生成能聯動，省去來回搬運的體力活。

第二個痛點更隱蔽：重復造輪子。快捷鍵監聽、模擬按鍵這些需求，每次都要重新查文檔寫樣板代碼。他列了兩個典型場景——Alt+V觸發功能、JS模擬Esc鍵——幾乎每個腳本都寫，每次都像第一次。

Page Proxy的應對很直接：內置常用模式的API，開箱即用。圖形界面負責快速生成CSS選擇器和代碼骨架，把"想法到可用"的鏈路壓縮到最短。

02 從"獨特"到"好用"的翻車現場

最初的設計方向差點讓項目夭折。開發者想做個web app，理由是"獨特"。

技術現實很快打臉：CSP（內容安全策略）讓大量網站直接罷工，登錄態也保不住，帶登錄墻的內容全軍覆沒。更荒誕的是，用戶得先打開一個網頁，才能調試另一個網頁——這種獨特，用起來像行為藝術。

轉向瀏覽器擴展是止損，也是回歸常識。側邊面板的設計讓調用方式和DevTools一致，隨時可觸達。最終定稿的界面干凈得多，橙綠配色是他用Realtime Colors挑的，特意避開AI網站泛濫的藍紫漸變。

UI設計是他作為程序員的執念。為此現學了Figma，把"能自己畫界面"從愿望清單劃掉。

03 一個小時的草圖，三個月的彎路

功能藍圖是一小時趕出來的流程圖，未經修飾。實際開發中，產品已經偏離初稿很遠——這種漂移對首個項目來說幾乎是宿命。

但核心目標沒動：讓用戶從"有個想法"到"腳本跑起來"的耗時，從小時級降到分鐘級。圖形界面不是給新手準備的糖衣，是給熟練開發者省時間的工具。

目前Page Proxy支持Chrome和Firefox，定位很克制——不搶userscript管理器的飯碗，專打創作環節的效率補丁。

開發者放出了早期設計稿和流程圖原稿，姿態很直白：第一款作品，求試用，求反饋。沒有"顛覆""革命"的修辭，只有調試時間占比80%這個數字，和想把比例打下來的執念。

如果你也寫過userscript，那個15分鐘寫代碼、1小時調試的賬，算出來是多少？