在 IT 產業的上古時代，流傳著許多獨行俠程序員們徒手寫出操作系統、編程語言、瀏覽器等高難度軟件的傳說。隨著行業的成熟，這些故事大多已經塵埃落定。但今天，我們有幸見證了一個正在進行中的年輕故事。這個故事的主人公，讓世界上數以百萬的人，用上了昂貴 Photoshop 軟件的免費替代品。
家住捷克的伊萬·庫茨基爾 (Ivan Kutskir) 是個 90 後自由職業程序員。雖然伊萬從來沒有公司的正式工作，但這不是因為他太菜了，而是因為他太強了：他就讀於捷克最好的大學。自學生時代起，他就靠著自己的編程天賦掙零花錢養活自己。他每月只需工作大約 20 小時，就能賺夠一個月 300 美元的生活費——這大致已經相當於國內不加班月薪三萬的水平。這樣的自由生活給了他極大的空間做自己喜歡的事。在這期間，他寫了許多試驗性的個人項目，從 Flash 小遊戲到 3D 模型渲染工具等等不一而足。這之中一個名叫 Photopea 的圖片編輯器項目，讓今天的他過上了每月被動收入上萬美元的「財務自由」生活。
我們都知道，美國 Adobe 銷售的 Photoshop，是圖片編輯領域公認最為強大的軟件之一。這個龐然大物功能固然強大，但 Adobe 的壟斷地位使它對於普通用戶並不友好：一份正版的 Photoshop CC 軟件國內售價超過 3000 元，對電腦硬件配置有著很高的要求。並且，它的 PSD 格式還是專有的，一般只能用 PS 打開編輯。於是，伊萬在瀏覽器裡折騰各種 3D 文件格式解析器之餘，有了個大膽的想法：我們能在網頁裡打開 PSD 文件嗎？
想法固然大膽，但稍有經驗的程序員都可以看出，這個點子絕對比一開始就喊著「我要重新發明一個 Photoshop」要切實可行得多。伊萬最早的規劃是這樣的：
- 先做一個簡單的 PSD 格式解析器，這以他的經驗來說並不難。
- 再添加一些簡單的 UI 界面，來展示圖層列表和最終的預覽效果。
- 最後支持幾個簡單的功能，比如移動圖層、隱藏圖層、導出 JPG 圖片等等。
這麼點需求顯然難不倒伊萬。在 2013 年，伊萬做出了第一個版本，這就是 Photopea 的起點了：
伊萬在把這個版本發佈試用之後，獲得了出乎意料的好反響。於是，他決定持續維護這個項目，解決用戶的需求，這一維護就做到了今天。一晃六年過去了，現在的 Photopea 是怎樣的呢？
這是現在的 Photopea。你可以看到，最早左側寥寥無幾的工具欄如今已經被填滿了，濾鏡、蒙版、鋼筆、文字、魔棒、曲線等功能更是一應俱全。除了完全支持 PSD 文件和 PNG / JPG / RAW / SVG 等圖像格式外，它甚至還能打開編輯 UI 設計師耳熟能詳的 Sketch 文件。這個強大的作品，得到了全世界用戶的廣泛認可。它到底有多受歡迎呢？舉幾個數據吧：
- Photopea 的用戶量每半年就會翻倍。現在它的每月訪問量已經達到了 280 萬次，每天用戶花費 5500 個小時使用它。
- 人們每天搜索上萬次 “photopea”。在 Google 搜索 “online PS” 和 “online photoshop” 關鍵詞的時候，Photopea 都排在第一名，甚至超過了 Adobe 自己的 Flash 版本。
- 伊萬在國外的 Reddit 網站上和網友互動介紹 Photopea 的「你問我答」活動，獲得了四萬多個贊同和超過 2000 條評論。
- 全世界的志願者無償地將 Photopea 翻譯成了 35 種不同的語言。其中，筆者也貢獻了若干中文翻譯 :)
別以為 Photopea 只靠抄抄 PS 的樣子就能這麼火爆。這樣的圖片編輯器，其實是個非常挑戰 Web 技術極限的產品。它的界面之下，隱藏了許多伊萬的獨門武功，許多技術指標迄今仍然獨步天下。舉幾個容易理解的例子：
- 圖像處理其實非常耗資源。例如一份尺寸 4000x4000 帶十個圖層的文檔，其內存佔用就是單張 1000x1000 圖片的 160 倍，解壓縮後會佔用 640MB 內存。如果用每秒 60 幀的頻率更新，就意味著每秒要在網頁中處理 38GB 的圖像數據！這是對普通程序員非常罕見的挑戰。Photopea 使用了瀏覽器底層的硬件加速技術，打開這一量級的文檔時也能保證基本的可用性。
- 對普通網站來說，瀏覽器是非常穩定的。但對於 Photopea 這樣變態的應用，許多極端情形都能讓瀏覽器級別的互聯網基礎設施暴露出問題。截至今天，Photopea 已經找到了 Chrome 的約 50 個 bug，以及 Firefox 的約 30 個 bug。到現在，伊萬甚至已經可以繞過瀏覽器標準的 bug 反饋流程，直接寫郵件找 Chrome 團隊熟悉的開發者交流，幫助他們改進。某種程度上，Photopea 改善了瀏覽器的穩定性。
- 現在的 Web 應用正在變得日趨膨脹。打開淘寶、網易等網站的首頁時，消耗的流量幾乎不可能低於 2MB。那麼像 Photopea 這樣功能強大得多的應用，它的體積多大呢？為了追求極致，伊萬幾乎完全不使用第三方代碼庫，並自己實現了代碼的壓縮算法，最終整個應用只會消耗你 1.4MB 的流量。
- 幾乎你能看到的每個知名網站，都有相當高昂的服務器運維成本。谷歌有幾十萬臺服務器，一年的成本是天文數字。猜猜 Photopea 一年的服務器成本有多高？20000 美元？2000 美元？答案是—— 20 美元。由於 Photopea 堅持只使用瀏覽器自身的能力，因此它的運維成本幾乎為零，也很好地保護了用戶隱私。
現在的 Photopea 已經完全是個成熟的商業級產品了。那麼，Photopea 的背後也有一支強大的團隊在維護它嗎？伊萬的故事裡最為不可思議的一點，在於即便到了今天，所有 Photopea 的工作，包括開發新功能、修復 bug、聽取用戶反饋到發佈官方博客，仍然只由他自己完成！可以說，他一個人花了幾年，就寫出了 Adobe Photoshop 一大支精英團隊，三十多年來積累出的那些最常用的功能。直到現在，他還在會定期在 Photopea 官方博客上發佈更新：
光是單槍匹馬地開發運營 Photopea，就已經夠不可思議了。不僅如此，伊萬還開源了不少為了 Photopea 自研的技術，包括字體解析、PNG 圖片編解碼和 ZIP 壓縮算法等等。由於工作需要，同樣身為程序員的筆者，也使用並閱讀過伊萬編寫的代碼。他的代碼是什麼風格的呢？在筆者個人的印象裡，出身烏克蘭的伊萬，寫的代碼體現著一種蘇式的工業美學——既沒有精緻的設計模式，也沒有應用流行的新式語法，更不講究換行縮進等優雅的排版，可代碼本身就是簡單明瞭、一步到位、性能優良且十分耐用。這些開源代碼的許可協議也十分寬鬆，在 GitHub 上獲得了上千個 Star。
看到這裡，我們對伊萬的技術水平應該不用再贅述了吧。不過相信一些同學肯定會問，像他這樣開發完全免費的軟件，還要開源義務勞動，是怎麼讓自己「財務自由」的呢？這就是個經典的技術商業化問題了。那麼伊萬的策略是怎樣的呢？在發佈 Photopea 的頭三年裡，伊萬沒有用 Photopea 為自己掙一分錢。到了 2017 年，伊萬開始全職開發 Photopea，在上面投放了廣告，這獲得的廣告收入一下就讓他自給自足了。然而不得不說，伊萬的商業化做得非常剋制：廣告只佔很小的頁面空間，你也可以選擇捐贈開通高級會員來去除廣告。
但不管是否付費，用戶能使用的功能都是完全一致的！即便在這麼「不懂得做生意」的策略下，伊萬的收入也已經非常豐厚了。按照他告訴筆者的說法，他不久就可以在布拉格全款買房啦。別忘了，他的收入屬於完全的被動收入，可不需要 996 加班呢。這麼看來，伊萬已經妥妥地實現了國人夢寐以求的「財務自由」了。那麼，他過的生活應該是什麼樣的呢？他需要天天自己一個人拼命工作嗎？他有個八臺顯示器環繞滾動著代碼的頂級工作室嗎？他會出手購置豪車一擲千金嗎？就在今年的五一，筆者在出遊歐洲之際有幸在布拉格見到了伊萬。我所看到的他的生活狀態，可能和你想象的大相徑庭。這是筆者和伊萬在布拉格 Letna 公園的合影：
線下看到的伊萬給筆者的感受，是他幾乎完全不追求技術之外的奢侈物質生活。到今天，他仍然和朋友合租、用著平價的安卓手機、還沒買房買車、作息時間規律、坦言一年也極少光顧布拉格的高級餐廳。而他是怎麼開發 Photopea 的呢？沒有頂配的蘋果電腦、沒有低調奢華的機械鍵盤、甚至連一個外接顯示器都沒有——只有普通臥室裡的一臺普通 ThinkPad 筆記本電腦，如此而已。他用來編寫代碼的軟件也是老掉牙的 Notepad++，並沒有安裝現在前端程序員中流行的各種工具。說實話，如果他來國內的互聯網大公司面試前端開發，以某些面試官對工具苛刻的標準，他說不定連一面都過不了。然而就是在這樣的環境裡，他一個人開發出了 Photopea。看看他的桌子，要不是知道他其實比我不差錢得多，我都想給他贊助點什麼了：
伊萬和 Photopea 的故事夠酷嗎？別忘了，他的工作成果是能夠讓我們每個人都能享受到的。作為普通用戶，使用和分享 Photopea 就是對他最大的支持了。儘管直到今天，由於一些網絡問題，Photopea 的中國用戶佔比還非常低，但我們和伊萬正在為你解決這個問題！今天我們很高興地告訴大家，筆者所在的廈門稿定科技和伊萬達成了正式合作，特別推出 Photopea 的中國版——稿定在線 PS。
https://ps.gaoding.com/?hmsr=ivan-intro-juejin#/
稿定 PS 和原版 Photopea 有什麼關係呢？可以說，這就是個對國內用戶最為友好的版本：
- 原版 Photopea 難以在大陸訪問，稿定版則部署在國內，幾乎可以秒開。
- 原版 Photopea 沒有中文字庫，稿定版則內置了主流的中文商業字體。
- 原版 Photopea 界面默認是英文的，稿定版則默認中文。
- 原版 Photopea 默認有廣告，稿定版則為國內用戶免費去除了廣告。
- 原版 Photopea 和稿定版，在功能上完全一致。
希望大家有機會能多多體驗，看看 Photopea 是否有我們說的這麼好用吧！如果你有任何問題反饋，或希望使用伊萬的開源代碼，也可以關注他的 GitHub 賬號噢。
GitHub地址：https://github.com/photopea
最後送上兩個彩蛋：
- 本文所有配圖均使用稿定 PS 編輯。
- 稿定 PS 還支持手機，快打開體驗吧！
傳送門 - 稿定在線 PS
https://ps.gaoding.com/?hmsr=ivan-intro-juejin#/
筆者供職於稿定科技 Web 工具團隊，亦為本次 Photopea 引進的中方負責人。全文內容已徵得 Ivan Kutskir 本人同意，確保其真實有效，同時歡迎媒體轉載。
原鏈接：https://juejin.im/post/5d1178c3e51d45108223fc92
閱讀更多 Echa攻城獅 的文章
