Independentemente de sua posição em relação à pornografia, seria impossível negar o enorme impacto que o setor de sites adultos teve no avanço da Web. Desde a ampliação dos limites de vídeo do navegador até a a divulgação de anúncios por meio do WebSocket para que os bloqueadores de anúncios não os detectem, o senhor precisa ser inteligente para inovar na vanguarda da Web.
Recentemente, tive a sorte de entrevistar um desenvolvedor da Web no maior site adulto da Web: Pornhub. Eu queria saber mais sobre a tecnologia, como as APIs da Web podem melhorar e como é trabalhar em sites adultos. Aproveite!
Observação: o setor adulto é muito competitivo, portanto, houve algumas perguntas que eles não puderam responder. Respeito a necessidade que eles têm de manter seus truques em segredo.
Os sites adultos obviamente exibem muito conteúdo gráfico. Durante o processo de desenvolvimento, o senhor usa muitas imagens e vídeos de espaço reservado? Qual é a distância entre o conteúdo e a experiência de desenvolvimento e o produto final?
Na verdade, não usamos placeholders quando estamos desenvolvendo os sites! No final, o que importa é o código e a funcionalidade; a interface é algo com o qual estamos muito acostumados neste momento. Definitivamente, há um pouco de curva de aprendizado no início, mas todos nós nos acostumamos rapidamente.
Quando se trata de streams de câmeras e scripts de anúncios de terceiros, como o senhor zomba desses recursos importantes e dinâmicos durante o desenvolvimento do site e dos recursos?
Para o desenvolvimento, o player é dividido em dois componentes. O player básico implementa a funcionalidade principal e dispara eventos. O desenvolvimento é feito em uma sala limpa. Para a integração nos sites, queremos que esses scripts e anúncios de terceiros sejam executados para que possamos encontrar problemas o mais cedo possível no processo. Em circunstâncias especiais, trabalharemos com os anunciantes para nos permitir acionar manualmente eventos que normalmente seriam aleatórios.
Uma página comum provavelmente tem pelo menos um vídeo, anúncios GIF, algumas visualizações de artistas de câmera e miniaturas de outros vídeos. Como o senhor mede o desempenho da página e como mantém a página com o máximo de desempenho possível? Há algum truque que o senhor possa compartilhar?
Usamos alguns sistemas de medição.
- Nosso player nos informa métricas sobre o desempenho da reprodução de vídeo e o uso geral
- Um sistema RUM de terceiros para o desempenho geral do site.
- Instâncias privadas do WebpageTest para criar scripts de testes nos data centers do AWS disponíveis. Usamos isso principalmente para ver o que pode estar acontecendo em um determinado momento. Ele também nos permite visualizar a “cascata” de diferentes locais e provedores.
Devo presumir que o recurso mais importante e complexo do front-end é o player de vídeo. Desde a incorporação de anúncios antes dos vídeos, marcação de momentos de destaque do vídeo, alteração da velocidade do vídeo e outros recursos, como o senhor mantém o desempenho, a funcionalidade e a estabilidade desse ativo?
Temos uma equipe dedicada que trabalha estritamente no player de vídeo e sua primeira prioridade é monitorar constantemente o desempenho e a eficiência. Para isso, usamos praticamente tudo o que está disponível: ferramentas de desempenho de navegadores, testes de páginas da Web, métricas etc. A estabilidade e a qualidade são garantidas por uma sólida rodada de controle de qualidade para todas as atualizações que fazemos.
Quantas pessoas fazem parte da equipe de vídeo dedicada? Quantos desenvolvedores de front-end fazem parte da equipe?
Eu diria que, considerando o tamanho do produto, o tamanho da equipe está próximo da média.
Durante o tempo em que trabalhou em sites para adultos, como o senhor viu o cenário de front-end mudar? Quais novas APIs da Web tornaram sua vida mais fácil?
Sem dúvida, vi muitas melhorias em todos os aspectos do mundo front-end;
- De CSS simples a finalmente usar LESS e Mixins, a um sistema de grade flexível com consultas de mídia e tags de imagem para acomodar diferentes resoluções e tamanhos de tela
- O jQuery e o jQueryUI estão se afastando lentamente, de modo que estamos voltando à programação orientada a objetos mais eficiente no JS básico. As estruturas também são muito interessantes em alguns casos
- Adoramos a nova API IntersectionObserver, muito útil para uma maneira mais eficiente de carregar imagens
- Também começamos a brincar com a API Picture-in-Picture, para ter aquele vídeo flutuante em algumas de nossas páginas, principalmente para obter feedback dos usuários sobre a ideia.
Olhando para o futuro, há alguma API da Web que o senhor gostaria que fosse alterada, aprimorada ou até mesmo criada?
Algumas delas que gostaríamos que fossem alteradas ou aprimoradas: Beacon, WebRTC, Service Workers e Fetch:
- Beacon: alguns problemas no IOS em que ele não funciona bem com eventos pageHide
- Fetch: Não há progresso de download e não oferece uma maneira de interceptar solicitações
- WebRTC: As camadas de simulcast são limitadas até mesmo para compartilhamento de tela, se a resolução não for grande o suficiente
- Trabalhadores de serviço: Fazer chamadas para navigator.serviceWorker.register não é interceptado por nenhum manipulador de eventos Fetch do service worker
A WebVR tem se aprimorado nos últimos anos. Qual é a utilidade da WebVR em seu estado atual e qual é o esforço que os sites adultos estão fazendo para oferecer suporte ao conteúdo de VR? A háptica tem alguma função na WebVR em seus sites?
Estamos investigando o webXR e a melhor forma de nos adaptarmos aos casos de uso de computação espacial emergentes e, como a maior plataforma de distribuição, precisamos oferecer suporte a criadores e usuários da forma como eles quiserem experimentar nosso conteúdo. Mas ainda estamos explorando como o conteúdo e as plataformas devem ser nesses novos meios.
Fomos a primeira grande plataforma a oferecer suporte a RV, visão computacional e artistas virtuais, e continuaremos a promover novas tecnologias e a Web aberta.
Com tantos tipos diferentes de mídia e conteúdo em cada página, quais são as maiores considerações quando se trata de desktop vs. celular, se houver alguma?
Funcionalidade restrita pelo sistema operacional e pelo tipo de navegador, principalmente. iOS vs. Android é o exemplo perfeito quando se trata de um conjunto completamente diferente de acesso e recursos.
Por exemplo, alguns dispositivos móveis iOS não permitem que tenhamos um player de vídeo personalizado enquanto estivermos em tela cheia, eles forçam o player QuickTime nativo. Isso deve ser levado em consideração quando desenvolvemos novas ideias. O Android, por outro lado, nos dá controle total e podemos levar nossos recursos para o modo de tela cheia.
O streaming adaptativo em HLS também é outro exemplo: o IE e o Edge são exigentes quando se trata da qualidade do streaming HLS, pois precisamos evitar algumas das qualidades mais altas, caso contrário, o vídeo ficaria constantemente travado e com artefatos.
Qual é o suporte mínimo atual do navegador para os sites adultos em que o senhor trabalha? O Internet Explorer está sendo eliminado?
O IE foi compatível com o senhor por muito tempo, mas recentemente deixamos de oferecer suporte a qualquer navegador anterior ao IE11. Com isso, também paramos de trabalhar com o Flash para o player de vídeo. Estamos nos concentrando principalmente no Chrome, Firefox e Safari.
De forma mais ampla, o senhor pode falar um pouco sobre a pilha típica de um site adulto? Servidor e/ou front-end? Quais bibliotecas o senhor está usando?
A maioria dos nossos sites usa as seguintes bibliotecas como base:
- Nginx
- PHP
- MySQL
- Memcached e/ou Redis
Outras tecnologias como Varnish, ElasticSearch, NodeJS, Go e Vertica são usadas quando apropriado.
Para o front-end, usamos principalmente o Javascript básico, estamos nos livrando lentamente do jQuery e estamos apenas começando a brincar com estruturas, principalmente Vue.js
Do ponto de vista de alguém de fora, os sites adultos geralmente parecem ser muito parecidos: muitas miniaturas de vídeo, conteúdo de vídeo agregado, artistas de câmeras, anúncios. Como alguém que trabalha neles, quais são os recursos diferenciais que tornam os sites adultos únicos?
Trabalhamos muito para dar a cada marca alguma exclusividade em diferentes níveis: biblioteca de conteúdo, UX e conjuntos de recursos, e em vários algoritmos diferentes.
Antes de se candidatar e fazer a entrevista para o seu atual empregador, o que o senhor pensava sobre a possibilidade de trabalhar em sites adultos? O senhor tinha alguma hesitação? Em caso afirmativo, como o senhor conseguiu acabar com seus medos?
Na verdade, isso nunca me incomodou, pois o desafio era muito atraente. A ideia de milhões de pessoas interagindo potencialmente com os recursos nos quais eu trabalhava era realmente motivadora. Isso se provou verdadeiro muito rapidamente, a primeira vez que algo em que trabalhei foi lançado, fiquei super orgulhoso e, de fato, disse a todos os meus amigos que fossem conferir! O fato de que a pornografia nunca vai morrer também é tranquilizador para a estabilidade no trabalho!
Com relação ao produto final, dizer que o senhor trabalha em sites adultos pode não ser a mesma coisa que trabalhar em uma agência web local. Existe algum estigma em contar a amigos, familiares e conhecidos que o senhor trabalha em sites adultos? Há alguma hesitação em contar às pessoas que o senhor trabalha em sites adultos?
Tenho muito orgulho de trabalhar com esses produtos, as pessoas próximas a mim estão cientes e fascinadas por isso. É sempre uma fonte incrível de conversas, piadas e é genuinamente interessante.
Tendo trabalhado em agências fora da indústria adulta, há alguma diferença na atmosfera quando se trabalha em sites adultos?
O ambiente aqui é muito descontraído e amigável. Não noto nenhuma diferença importante em relação à cultura de trabalho em outras agências, a não ser o fato de que aqui é muito maior do que em qualquer outro lugar em que trabalhei anteriormente.
Sendo um desenvolvedor front-end, com quais equipes o senhor trabalha mais próximo? Quais são os métodos de comunicação diária mais comuns?
Trabalhamos igualmente com desenvolvedores de back-end, testadores de controle de qualidade e gerentes de produto – na maioria das vezes, simplesmente vamos até a mesa de cada um e conversamos. Caso contrário, o bate-papo (MS Teams) é muito comum. Depois vêm os e-mails.
Por fim, há algo que o senhor gostaria de compartilhar como desenvolvedor front-end que trabalha em sites adultos?
É muito empolgante fazer parte da criação de como os usuários experimentam um produto tão amplamente utilizado. Em geral, estamos na vanguarda das tendências e das grandes mudanças tecnológicas à medida que são lançadas, o que torna o trabalho divertido e desafiador.
Fim da entrevista
Achei nossa entrevista muito esclarecedora. Fiquei um pouco surpreso por eles não usarem imagens ao desenvolver recursos e designs. É empolgante ver que o Pornhub continua a avançar nos limites da Web com WebXR, WebRTC e Intersection Observer. Também fiquei feliz em ver que eles consideram o conjunto atual de APIs da Web suficiente para começar a abandonar o jQuery.
Eu realmente gostaria de ter conseguido obter dicas técnicas mais específicas com eles, especialmente sobre desempenho e hacks inteligentes. Tenho certeza de que há muito conhecimento a ser aprendido por trás do código-fonte deles! Que perguntas o senhor teria feito?
