不管你對色情行業持有何種觀點，都不能否認成人網站的產業對於推動網絡發展的巨大影響力。從推動瀏覽器對視頻的限制到為了廣告不被屏蔽，而通過WebSocket推送廣告，你不得不在網絡前沿領域創新上變得更聰明。
最近，我（原作者）足夠幸運的能採訪到了一位Web開發人員，供職於最大的成人網站：PornHub。我想了解下技術相關的事情，web APIs 還能怎麼改進以及在成人網站工作的感受。有趣！
備註：成人產業競爭非常激烈，所以有一些問題他們不能回答。我尊重他們需要保密的需要。
Q：成人網站顯然要顯示很多色情的圖片和視頻。在開發過程中，你們會用其他的圖片和視頻把色情的圖片和視頻替換掉嗎？開發中的內容和體驗距離最終產品有多遠呢？
A：實際中，在開發網站時，我們不替換圖片和視頻！在最後重要的是網站的代碼和功能，我們很快就習慣了網站的界面內容，當然一開始肯定“學習曲線”有點陡，但我們都很快適應了
Q：當有視頻流和第三方廣告腳本，你們怎麼在網站和功能的開發過程中模擬如此重要的，動態的資源？
A：在開發中，播放器功能分為兩個部分。基礎播放器執行核心功能和觸發事件。開發是在一個“乾淨”的環境進行的。
對於網站上的集成，我們想執行第三方的腳本和廣告，以便我們能儘早找到問題。在特殊情況下，我們會和廣告客戶合作，允許我們手動觸發通常是隨機的事件。
Q：一個普通頁面可能有至少一個視頻，GIF廣告，一些直播視頻的預覽和其他視頻的縮微圖。你怎麼評估頁面性能，怎麼儘可能保證高性能？有什麼技巧可以分享麼？
A：我們用了一些評測系統。
我們的播放器會向我們報告視頻回放性能和一般操作的指標
整體網站性能使用第三方RUM(Real User Monitoring )系統。
在可用的AWS數據中心中用WebpageTest編寫測試腳本。我們用這個主要是為了看看在給定的時間可能發生的情況。它還允許我們以不同的位置查看“瀑布型”報表
Q：我不得不假設前端最重要和最複雜的功能是視頻播放器。從在視頻之前添加廣告、標記視頻的亮點、更改視頻速度和其他功能，您如何保持播放器的性能、功能和穩定性？
A：我們有一個專門的團隊針對視頻播放器進行嚴格工作，他們的首要任務是不斷的監控性能和效率。
為了做到這一點，我們使用了幾乎所有可用的工具：瀏覽器性能工具、網頁測試、各項指標等。穩定性和質量是在每次更新時由QA做一輪可靠的測試來保證的。
Q：視頻團隊有多少人？前端團隊有多少人？
A：我想說的是，基於產品的規模，團隊人數趨於行業平均值
Q：你工作在成人網站的這段時間裡，你看到了前端有什麼變化嗎？有什麼新的APIs使你工作變得更容易嗎?
A：在前端世界的每個方面，我絕對都看到了很多改進；
從普通CSS到最終使用LESS和Mixins，到使用具有媒體查詢和圖片標籤的flexible Grid system，以適應不同分辨率和屏幕尺寸。
jquery和jqueryUI正在慢慢地離開，因此我們將回到純js中更高效的面向對象編程。在某些情況下，框架也非常有趣。
我們喜歡新的IntersectionObserver API，對於更有效地加載圖片非常有用。
我們也開始使用Picture-in-Picture API，在我們的一些頁面上播放浮動視頻，主要是為了獲得用戶對這個想法的反饋。
Q：展望未來，有沒有Web APIs 是您希望修改、改進甚至自己創建的呢？
A： 其中一些是我們希望修改或改進的；Beacon、WebRTC、Service Workers和Fetch：
Beacon：在IOS上的一些問題，它不能很好地處理pageHide事件
Fetch：沒有下載進度，也不提供攔截請求的方法
WebRTC：如果分辨率不夠大，即使是屏幕共享，Simulcast layers也是被限制的
Service Workers：調用navigator.servicework.register不會被任何服務工作進程的fetch事件處理程序攔截
Q：網絡虛擬現實(WebVR) 技術在過去幾年裡一直在進步——在目前的狀態下，WebVR有多大用處？成人網站對內容的支持力度有多大？觸覺在你網站上的WebVR中有應用嗎？
A：我們正在研究WebXR以及如何最好地適應新興的空間計算用例，作為最大的分發平臺，我們需要支持創作者和用戶，不管怎樣他們希望體驗我們的內容。但我們仍在探索這些新媒體的內容和平臺應該是什麼樣的。
我們是第一個支持虛擬現實、計算機視覺和虛擬表演者的主要平臺，並將繼續推動新技術和開放網絡。
Q：由於每頁都有這麼多不同類型的媒體和內容，在桌面與移動（如果有的話）之間，最大的考慮是什麼？
A：功能主要受操作系統和瀏覽器類型的限制。當涉及到完全不同的訪問和功能集時， iOS與Android是一個完美的例子。
例如，一些iOS移動設備不允許我們在全屏模式下自定義視頻播放器，它們強制使用原生的QuickTime播放器。我們在想新點子時必須考慮到這一點。另一方面，Android給了我們完全的控制權，我們可以將我們的功能應用到全屏模式。
適配HLS (HTTP Live Streaming)中的數據流是另一個例子，當HLS的數據流質量很好時，IE和Edge很挑剔，因此我們需要阻止某些更高質量的數據流，否則視頻會不斷卡頓併產生偽影。
Q：你工作的成人網站目前支持的最低版本瀏覽器是什麼？Internet Explorer是否被淘汰？
A：我們支持IE很長一段時間了，但最近放棄支持任何比IE11更老的版本。同時，我們也停止在視頻播放器上使用Flash。我們主要關注Chrome、Firefox和Safari。
Q：更廣泛地說，你能分享一下典型的成人網站用到的技術棧嗎？服務器端和(或)前端？你們在用哪些庫？
A：我們的大多數網站都以以下內容為基礎：
Nginx ，PHP ，MySQL ，Memcached and/or Redis
其他技術像：Varnish, ElasticSearch, NodeJS, Go, Vertica 用在需要的地方
對於前端，我們主要用的普通Javascipt，我們正慢慢捨棄JQuery，我們剛剛開始使用框架，主要是Vue.js
Q：從局外人的角度來看，成人網站似乎非常相似：許多視頻縮略圖、聚合視頻內容、攝像機前的表演者、廣告。作為一個在成人網站工作的人，成人網站的獨特之處是什麼？
A：我們非常努力地為每種類型的人提供不同層次的獨特性；主要通過內容庫、用戶體驗和功能集，以及許多不同的算法。
Q：在申請和麵試你現在的公司之前，你對可能在成人網站工作有什麼想法？你有什麼猶豫嗎？如果有，你的擔心是如何平息？
A：這從來沒有真正困擾過我，最終的挑戰是如此吸引人。數百萬人有可能與我所研究的功能進行交互的想法真的很有激勵作用。
事實很快就證明了這一點，我第一次做的東西上線時，我非常自豪，我真的告訴我所有的朋友去看看！色情電影永遠不會消亡的事實也讓工作穩定得到了保證！
Q：就最終產品而言，分享您在成人網站工作的信息可能與在本地網絡公司工作的信息不同。告訴朋友、家人和熟人你在成人網站上工作有沒有一種恥辱感？告訴別人你在成人網站工作有什麼猶豫嗎？
A：我很自豪能為這些產品工作，也為此著迷，我身邊的人都很清楚。它總是一個超級棒的話題，笑話和真正趣味的來源。
Q：在成人行業以外的機構工作過後，在成人網站工作的氣氛有什麼不同嗎？
A：這裡的氣氛非常輕鬆友好。我沒有注意到其他機構的工作文化有什麼重大差異，除了這裡比我以前工作過的任何地方都要大得多。
Q：作為前端開發人員，哪個團隊和你工作接觸的更多？日常溝通最常見的方法是什麼？
A：我們和後端開發，QA測試和產品經理接觸時間是同等的--大部分時間我們去對方的桌子前直接溝通，如果不面對面溝通，就用Microsoft Teams。最後是Emails。
Q：最後，你作為工作在成人網站的前端，有什麼事情想分享下嗎？
A：作為創造用戶如此廣泛使用的產品的一部分，這真的很令人興奮。我們通常處於科技發展趨勢和重大變革的前沿，這使我們保持了科技的樂趣和挑戰性。
採訪結束
我覺得我們的採訪很有啟發性。我有點驚訝他們在開發功能和設計時沒有使用圖片。看到Pornhub使用WebXR, WebRTC和Intersection Observer，推動著網絡的前沿領域，真是令人興奮。我也很高興看到他們認為當前的Web APIs足夠用，開始捨棄jQuery。
我真希望我能從中得到更多具體的技術提示，尤其是有關性能和巧妙的技巧。我敢肯定他們的源代碼背後有很多需要學習的知識！
你會問什麼問題？
閱讀更多 程序員前線 的文章
