BT

Início Notícias Netflix.com migra para JavaScript Universal e remove Java de seu pipeline de renderização

Netflix.com migra para JavaScript Universal e remove Java de seu pipeline de renderização

Favoritos

A equipe do Netflix.com trocou seu renderizador HTML baseado em Java por um renderizador JavaScript Universal que pode ser executado no navegador ou no servidor.

Para diminuir o tempo de espera dos usuário, o Netflix removeu o renderizador Java baseado em servidor e reduziu a quantidade de HTML enviada. No post que descreve a mudança, Kristofer Baxter, afirma que não renderizar as partes do aplicativo não visualizadas pelo usuário (dentre outras mudanças) resultou na melhoria do tempo de espera para interação em 70%.

Cada vez que um usuário entrava em qualquer página do netflix.com, a camada Java era responsável por gerar a resposta e a maior parte do HTML necessário para todo o ciclo de vida da página. Frequentemente usuários esperavam pela geração do markup referente à partes da página que não seriam visitadas.

Com o nome "JavaScript Universal", o Netflix arquitetou o novo renderizador de interface de forma a permitir sua execução tanto no navegador como no servidor node.js. Baxter afirma que essa técnica "permite que a aplicação faça renderizações iguais independente da localização do renderizador. A distinção entre servidor e cliente se tornou transparente no modelo em que ambos executam os mesmos processos com poucas chances de saídas diferentes."

Charlie Robbins apresentou a idéia em 2011 no formato em que foi implementada usando JavaScript. Ele a chamou de "JavaScript Isomórfico", o que causou anos de discussões a respeito da adequação do nome. Nos últimos meses, o nome JavaScript Universal ganhou aceitação.

Migrar para um modelo JavaScript Universal não é fácil e requer uma base sólida. Barxter contou ao InfoQ.com que qualidade de código é de suma importância. "Garantir que dois ambientes JavaScript compartilhem um contexto é imprescindível. Sem uma solução arquiteturalmente sólida para esse problema, o código facilmente se divide em diversas ramificações cliente versus servidor", afirmou Baxter.

Apesar de o Netflix ter escolhido o React,js, ele não é a única opção para implementações com esse tipo de transparência. O Ember.js está lançando a tecnologia FastBoot que promete fazer algo similar. Existem também muitas outras bibliotecas que podem ser avaliadas para esse tipo de uso.

O Netflix escolheu o sistema de JavaScript Universal após uma queda de braço dentro da empresa. Baxter explica que outro protótipo desenvolvido com técnicas SPA também foi levado em consideração:

Quando começamos a etapa de prototipação deste projeto, construímos um protótipo para cada uma das arquiteturas propostas. A primeira, uma arquitetura com JavaScript apenas no lado do cliente baseada fundamentalmente no Backbone e no JQuery. A segunda, utilizando JavaScript Universal e o React.js. Após um período de três semanas, as arquiteturas foram apresentadas para um grupo maior de pessoas e o JavaScript Universal com React.js foi o vencedor. De qualquer forma, vamos continuar experimentando com diferentes abordagens para construção de aplicações web.

A lista de organizações desenvolvendo com JavaScript Universal está crescendo. Hotel Tonight, Auto Desk, Tesco e o AirBnb estão desenvolvendo ou já desenvolveram seus produtos com essa arquitetura.

Avalie esse artigo

Relevância
Estilo/Redação

Olá visitante

Você precisa cadastrar-se no InfoQ Brasil ou para enviar comentários. Há muitas vantagens em se cadastrar.

Obtenha o máximo da experiência do InfoQ Brasil.

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

Comentários da comunidade

  • Dúvida

    by rod cez,

    Seu comentário está aguardando aprovação dos moderadores. Obrigado por participar da discussão!

    Ouço muito em falar em trabalhar com node.js no server para esse tipo de situação...
    Basicamente seria o node.js rendenizar as views e o javascript continuar consumindo nossa api ? com outro server side? php/java/.net/python/ruby etc

  • Re: Dúvida

    by claudio santos,

    Seu comentário está aguardando aprovação dos moderadores. Obrigado por participar da discussão!

    Exato.
    Na primeira requisição é identificado no header que o browser precisa de Html, nas demais é uma requisão configurada a responder json, e o server implementado em node.js se vira com essas informações para fornecer exatamente o que vc precisa.

  • Re: Dúvida

    by Wellington Soares,

    Seu comentário está aguardando aprovação dos moderadores. Obrigado por participar da discussão!

    Oi, Claudio,
    Na verdade, a sua resposta é "só" metade do que eles fizeram.... A grande diferença é que esse Backend para renderizar a página é isomórfico (isomorphic.net/). Ou seja, o mesmo código JavaScript que você utiliza pro servidor chamar a sua api, pegar o json, montar os elementos e voltar pro client uma página pronta com a marcação HTML completa, é o mesmo código JavaScript que você vai carregar dentro da página HTML para continuar alterando a página. ;) Abs

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

BT

Seu cadastro no InfoQ está atualizado? Poderia rever suas informações?

Nota: se você alterar seu email, receberá uma mensagem de confirmação

Nome da empresa:
Cargo/papel na empresa:
Tamanho da empresa:
País:
Estado:
Você vai receber um email para validação do novo endereço. Esta janela pop-up fechará em instantes.