写点什么

成人网站 Pornhub 技术栈首度公开

  • 2019-11-21
  • 本文字数:2865 字

    阅读完需:约 9 分钟

成人网站 Pornhub 技术栈首度公开

成人网站在推动 Web 发展方面所起到的作用无可辩驳。从突破浏览器的视频能力限制,到利用 WebSocket 推送广告(防止被广告拦截器拦截),你必须不断想出各种聪明的办法,让自己处在 Web 技术创新的最前沿。


最近,我有幸采访了大型成人网站 Pornhub 的一位 Web 开发工程师,了解了相关的开发技术、Web API 的改进,以及作为成人网站开发工程师是一种怎样的体验。


注意:因为成人网站这个行业竞争相当激烈,有一些问题他们不能回答我,这一点我表示理解。

成人网站需要显示大量的图像内容,在开发过程中,你是否使用了大量的图片和视频占位符?开发过程中的内容体验和最终产品差距大吗?

实际上,在开发这个网站时我们并没有使用占位符!归根结底,代码和功能才是最重要的东西,至于界面什么的,到了这个时候我们已经很熟悉了。刚开始时有一点难度,但很快我们就适应了。

在开发过程中,你们是如何模拟直播视频流和第三方广告脚本的?它们都是很重要的资源。

播放器被分为两个组件,基本组件实现了核心功能,用于触发事件。开发是单独进行的,在进行集成时,我们需要用到第三方脚本和广告,这样可以尽早发现问题。对于一些特殊情况,我们会与广告主合作,通过手动的方式来触发一些随机事件。

一般页面上至少会有一个视频、一些 GIF 广告、一些直播预览和其他视频的缩略图。你是如何测定页面性能的?以及如何尽量提升页面的性能?> 我们使用了一些测评系统。

  1. 播放器会将视屏播放的性能和用户播放情况发送给我们;

  2. 我们使用了第三方的 RUM 系统;

  3. 我们使用了 WebpageTest,这样就可以知道在某个时段发生了什么事情。

我假设播放器是前端的一个最重要也最复杂的功能。在视频前面插入广告、标记视频的关键部分、改变播放速度,等等,你是如何保持播放器的性能、功能和稳定性的?

我们有一个专门负责开发播放器的团队,他们的首要任务是持续地监控播放器的性能。我们用上了所有可用的工具:浏览器性能工具、WebpageTest、性能指标,等等。每次在发布更新之前,我们都会进行一轮严格的 QA 来保证稳定性和质量。

视频团队有多少专职开发人员?有多少前端开发人员?

我只能说,如果从整个产品的规模来看,我们的团队规模算是中等的。

在从事成人网站开发期间,你看到前端领域经历了哪些发展?有哪些新的 Web API 给你带来很大的帮助?

我看到前端技术在很多方面都有进步。

  1. 从使用纯 CSS 到使用 LESS 和 Mixin,再到使用灵活的栅格系统和图像标签来适应不同的分辨率和屏幕大小;

  2. jQueryjQueryUI 逐渐淡出了我们的视线,我们回到了更加面向对象的纯 JavaScript 编程。一些框架在某些场景下也起到非常有趣的作用;

  3. 我们很喜欢新的 IntersectionObserver API,用它来加载图像非常高效;

  4. 我们还使用了画中画 API,让视频漂浮在页面上,不过现在还在争取用户对这个想法的反馈。

展望未来,有没有哪些 Web API 是你希望发生变化、改进的?或者出现新的 Web API?> 我们希望这些 API 能够发生变化或改进:Beacon、WebRTC、Service Worker 和 Fetch。

Beacon:在 iOS 上有些问题,对 pageHide 事件支持得不太好;

Fetch:没有下载进度,也没有提供拦截请求的方式;

WebRTC:在进行直播时,如果分辨率不够大就会有所限制;

Service Worker:调用 navigator.serviceWorker.register 不会被 Service Worker 的 Fetch 事件处理器拦截到。

WebVR 在过去几年已经有所改进。目前来看,它的作用有多大?成人网站会投入多大精力来支持 VR 内容?Pornhub 的 WebVR 有涉及触觉技术吗?

我们正在研究如何将 WebXR 应用在沉浸式空间场景中。作为最大的内容分发平台,我们有必要为用户提供让他们能够按照自己的方式来体验网站内容的机会。但我们还在探索,在使用这些新媒体时,内容和平台应该是什么样子。

我们是支持 VR、计算机视觉和虚拟主播的一个主要平台,我们将继续推动新技术的发展。

每个页面上都有不同类型的媒体和内容,对于桌面版或移动版来说,最需要考虑的东西是什么?

我们主要考虑操作系统和浏览器对功能方面的限制。比如,iOS 和 Android 在访问权限和功能方面就非常不一样。

一些 iOS 设备不允许在全屏时使用自定义播放器,它们会强制使用原生的 QuickTime 播放器。而 Android 则给了我们完全的控制权限,可以在全屏时使用我们的播发器。

另一个例子是 HLS 视频流,IE 和 Edge 对 HLS 视频流质量非常挑剔,所以我们需要控制视频的质量,否则在播放时就断断续续或者出现重影。

目前 Pornhub 可以支持的最低浏览器版本是哪个?现在还支持 IE 吗?

我们支持 IE 很长时间了,但最近不支持 IE 11 之前的版本。另外,我们也停止支持 Flash 播发器。我们现在主要支持 Chrome、Firefox 和 Safari。

可以分享一下 Pornhub 的技术栈吗?从服务器端到前端,你们使用了哪些库?

基本上,我们使用了这些东西:

Nginx

PHP

MySQL

Memcached/Redis

其他技术还包括 Varnish、ElasticSearch、NodeJS、Go 语言、Vertica。

前端方面,我们主要使用了纯 JavaScript。我们在逐步淘汰 jQuery,并开始使用框架,比如 Vue.js。

在外行看来,成人网站的网页上一般充斥着各种视频缩略图、视频、直播和广告。从开发者的角度来看,是什么东西让一个成人网站变得与众不同?

我们努力让每一个品牌都具备一定程度的独特性,不同的内容、界面体验和功能,还使用了很多不同的算法。

在面试 Pornhub 时,你是怎么想的?你有犹豫过吗?如果有,又是怎么消除这种情绪的?

我没有感到有什么不妥,毕竟这个挑战对我来说充满了吸引力。一想到有数百万人会用到我开发的东西,我就感到很兴奋。这个想法很快就得到了验证,当我开发的功能第一次上线时,我感到很自豪,我还叫我的朋友们也去看看!成人网站永远都不会消亡,它为我们提供了稳定的工作来源。

与开发一般的网站相比,开发成人网站可能会有所不同。当你告诉你的朋友、家人和熟人自己在开发成人网站,你会觉得这是一种耻辱吗?你会犹豫告诉他们这些吗?

我为自己开发的东西感到自豪,我身边的人都知道,也很喜欢它们。这也成了我们的茶余饭后的谈资,非常有意思。

你也在其他地方开发过其他网站,在 Pornhub 的工作氛围有什么不同吗?

这里的氛围非常轻松友好,我不觉得跟在其他地方有什么不同。

作为前端开发人员,你需要与哪些团队密切接触?你们平常常用哪些交流方式?

我们需要与后端开发人员、QA 和产品经理打交道。大部分时间我们会跑到各自的工位上讨论问题,其次是使用聊天工具(Microsoft Teams),然后是电子邮件。

最后,作为一名在成人网站工作的开发工程师,你还有什么想要分享的吗?

我非常高兴能够参与开发这个有如此大规模用户的产品。我们身处技术发展的最前沿,这让一切都变得有趣且颇具挑战性。

后记

这个采访很有启发性。我很惊讶他们在开发时居然没有使用图像。Pornhub 走在 Web 技术的最前沿——WebXR、WebRTC 和 Intersection Observer API。我也很高兴看到他们开始逐步淘汰 jQuery,因为现在的 Web API 很给力。


我很想从他那里挖到更过有关技术和性能的细节,我敢肯定他们的源代码里有很多值得一学的东西。换了是你,你会想问哪些问题?

原文链接

Interview with a Pornhub Web Developer


2019-11-21 14:2359789
用户头像
小智 让所有人认同的文字称不上表达

发布了 408 篇内容, 共 402.9 次阅读, 收获喜欢 1986 次。

关注

评论 11 条评论

发布
用户头像
PHP确实厉害。但是一些公司也在逃离PHP
2020-01-06 20:13
回复
用户头像
可以关注约拍宝
2020-01-03 18:18
回复
用户头像
感觉你在开车,但是没有证据
2019-12-04 20:23
回复
用户头像
大部分情况下,PHP都能非常好的满足WEB业务的需求。尤其是中小规模网站,PHP因为它的高效和简单,更是首选。
2019-11-28 10:30
回复
没有seqing(以下简称SQ)业就没有互联网的发展.以前的人只能在杂志上看S图,最后2G时代手机上可以看相片,也可以看3GP格式的视频,3G时代手机上可以播放更清晰的视频了,屏幕分辨率得到了跨越式的进化,然后步入4G时代,各种非法直播APP,手机用流量随时都能看,国家的提速降费实施后,电脑上在线1080P视频也可以流畅播放.5G了,这不有些VR的SQ影片和设备已经开发出来了...SQ,真的是除了战争之外对社会前进最有推动力的行业了!!!
2019-12-03 17:09
回复
用户头像
实用
2019-11-27 17:09
回复
用户头像
不愧是P(拍)H(黄)P(片), 面向名字技术选型
2019-11-25 11:52
回复
你个小机灵鬼
2019-11-28 11:56
回复
傻逼,真他妈好笑
2019-12-24 00:01
回复
用户头像
PHP牛逼
2019-11-22 10:22
回复
用户头像
PHP语言到现在还是可以做出最好的网站,云计算kubernetes的兴起让各个语言技术栈充分竞争.
2019-11-21 14:30
回复
没有更多了
发现更多内容

用 Nginx 的 auth_request 模块集成 LDAP 认证

冯骐

Python nginx 运维 ldap 认证

四面阿里成功斩获offer,在此分享我的复盘经验总结!

Java架构之路

Java 程序员 架构 面试 编程语言

【经验分享】如何释放企业CMDB价值?——CMDB建设路径浅谈

嘉为蓝鲸

运维自动化 配置中心 CMDB 配置信息 配置管理

交换机配置的自动备份与变更告警

冯骐

Python 运维 网络 备份 multissh

《精通比特币》学习笔记(第一章)

棉花糖

区块链 读书笔记

面试官:如何用SpringCloud从零设计一个大型电商平台?

Java架构追梦

Java 架构 面试 微服务 SpringCloud

在主动要求涨工资这事上,不要学我!从第一份工资800开始说起

四猿外

程序员 涨薪 工资 收入 跳槽

阿里P7亲自讲解!如何快速的开发一个完整的直播app,成功入职腾讯

欢喜学安卓

android 程序员 面试 移动开发

Open-Falcon 中的 LDAP 认证

冯骐

Python 运维 Open-Falcon ldap Go 语言

用 Go 写一个轻量级的 ssh 批量操作工具

冯骐

运维 SSH Go 语言

手把手教学,如何使用低代码快速构建应用程序步骤详解!

优秀

低代码

GitHub上获赞10万star的高并发神级进阶资料,面试官再问高并发问题请你把这篇文章发给他!

Java架构之路

Java 程序员 架构 面试 编程语言

软件开发,如何快速有效缩短项目周期

雯雯写代码

软件开发

思科设备漏洞 CVE-2018-0171 的快速修复

冯骐

Python 运维 安全 网络 交换机

【LeetCode】俄罗斯套娃信封问题Java题解

Albert

算法 LeetCode 28天写作

Golang 中的并发限制与超时控制

冯骐

并发 超时 Go 语言

迄今为止最好用的Flink SQL教程:Flink SQL Cookbook on Zeppelin

Apache Flink

flink

云安全和访问管理

龙归科技

云计算 安全 云端 企业安全

阿里P7亲自讲解!驱动核心源码详解和Binder超系统学习资源,跳槽薪资翻倍

欢喜学安卓

android 程序员 面试 移动开发

神经网络攻防: 02.攻击模型的输出层

P小二

AIPwn AI安全 P小二 神经网络攻防

神经网络攻防:03.使用API修改神经网络参数

P小二

AIPwn AI安全 P小二 神经网络攻防

拍乐云加盟UCloud优云精选计划,构建云上的美好互动

拍乐云Pano

ucloud 云服务 RTC 拍乐云 白板

Pgbouncer最佳实践:系列四

PostgreSQLChina

数据库 postgresql 软件 开源社区

史上最全整合第三方登录的开源库

happlyfox

OAuth 2.0 28天写作 3月日更

用 Go 写一个轻量级的 ldap 测试工具

冯骐

运维 开发 ldap Go 语言

2021总结全网最新、最全、最实用Java岗面试真题!已收录GitHub

比伯

Java 编程 架构 面试 程序人生

Nginx安装后要做的第一件事

运维研习社

nginx WEB安全

Serverless 极致弹性解构在线游戏行业痛点

阿里巴巴云原生

Serverless 微服务 开发者 云原生 消息中间件

区块链产业革命:解决融资租赁之谜

旺链科技

区块链应用 融资租赁

LeetCode题解:190. 颠倒二进制位,移动n,JavaScript,详细注释

Lee Chen

算法 大前端 LeetCode

都 2021 年了,也该抛弃 ExpressJS 了

LeanCloud

大前端 nodejs 框架

成人网站 Pornhub 技术栈首度公开_架构_David Walsh_InfoQ精选文章