# Avaliação arquitetural do sistema da *Netflix* **Aluno:** Rodrigo Eloy Cavalcanti **Matrícula:** 118210111 A [*Netflix*](https://www.netflix.com/br-en/) é um sistema que oferece serviços de *streaming* de filmes e séries, sendo a maior empresa no seguimento de *streamings* no mundo, com mais de 220 milhões de assinantes mensais. Essa avaliação arquitetural foi feita a partir de métricas retiradas da plataforma *Netflix* utilizando o plugin [GoogleLighthouse](https://developer.chrome.com/docs/lighthouse/overview/). Esta ferramenta permite que sejam extraídas métricas importantes para avaliar a páginas web, sendo estas subdivididas nas seguintes categorias: - [Performance](#Performance); - [Acessibilidade](#Acessibilidade); - [Boas práticas](#Boas-praticas); - [SEO](#SEO). Essa análise avaliativa será seguimentada com enfoque na análise de cada métrica. ## Performance ![](https://i.imgur.com/6F5MnLE.png) A categoria "performance" no *lighthouse* é um conjunto de métricas como: - ***First contentful Paint***: Tempo que o primeiro elemento é renderizado na tela; - ***Largest Contentful Paint***: Tempo que o elemento mais pesado da tela demora para ser renderizado. - ***Time to Interactive***: Tempo necessário para que o usuário consiga interagir com a tela; A partir dessas e outras métricas, o *lighthouse* classificou a performance do site da *Netflix* como **61/100**, evidenciando que existem diversos pontos que devem ser revisados para melhorar sua performance. A seguir estão dois dos principais pontos que fizeram a página perder 39 pontos no score definido: - ***Reduce unused JavaScript***: O lighthout apontou alguns arquivos cujo partes do código contido neles não são utilizados pela aplicação. Esse fato faz com que os arquivos sejam mais pesados e o tempo da requisição aumente em cerca de 1.56 segundos. - ***Use HTTP/2.0***: Muitas das requisições utilizam o HTTP/1.1 o que torna a requisição mais lenta em comparação a requisição feita com HTTP/2.0. O uso de HTTP/1.1 acarretou num aumento de 1.1s no tempo da requisição Dessa forma para melhorar essa performance, é possível utilizar analisadores estático de código como [*Sonarqube*](https://www.sonarqube.org/features/multi-languages/?gads_campaign=South-America-SonarQube&gads_ad_group=Multi-Language&gads_keyword=javascript%20sonarqube&gclid=CjwKCAjw6fyXBhBgEiwAhhiZsqZlJuCn0zafDTsPqwGsYsUdFQNydySWFOgPU5OBRDvX6ry6ZP7EJRoCwaQQAvD_BwE) a fim de encontrar esses códigos que não estão sendo utilizados e removê-los. Além disso, para a resolução do problema relacionado ao HTTP, caso não exista um motivo muito específico que não possa ser resolvido com HTTP/2.0, é interessante que a *Netflix* faça a transição do uso de HTTP/1.1 para HTTP/2.0. Apesar das métricas de performance apontarem que a *Netflix* possui uma performance média, em comparação com outros serviços de streaming é evidente a diferença de performances das suas plataformas, como *disney+* **(13/100)** e *HBO max* **(25/100)**. O único serviço que possuia performance comparável à *Netflix* foi a *prime video* com um score de **(57/100)**. Essa comparações evidenciam que a *Netflix* lidera a qualidade da performance de seu serviço em comparação aos seus concorrentes de mercado, o que, claro, não significa que ela não pode melhorar. ## Acessibilidade ![](https://i.imgur.com/bO9Tjht.png) A acessibilidade no *lighthouse* é um conjunto de métricas que definem qual o quão bem uma pessoa PCD (Pessoas Com Deficiência), ou alguém que utiliza a plataforma de formas menos comuns, conseguiria usufruir e utilizar as funcionalidades dispostas no site. Algumas das métricas utilizadas para verificar questões de acessibilidade: - ***The page has a logical tab order***: Alguns usuários utilizam a tecla *tab* para fazer a navegação nas páginas que acessa e essa métrica define se a página em questão possui uma ordem lógica na movimentação do usuário dentro página através da tecla *tab*; - ***Interactive elements indicate their purpose and state***: Essa métrica analise se os elementos interativos possuem indicativos visuais do seu propósito e do seu estado no momento de acesso. No caso da *Netflix*, esta possui um score de **100/100** no quesito de acessibilidade, explicitando que a empresa possui a preocupação de implementar uma página que qualquer tipo de pessoa consiga acessar e utilizar seus serviços. Enquanto isso serviços como *Prime Video* **(88/100)**, *HBO max* **(84/100)** e *Disney+* **(68/100)** possuem um *score* de acessibilidade bem mais baixo, porém intermediário. ## Boas praticas ![](https://i.imgur.com/UjoH5jM.png) Essa categoria leva em consideração métricas mais gerais de boas práticas relacionadas ao usuário e à aplicação para calcular o *score* final. Algumas das métricas utilizadas para o cálculo do *score* final e que foram pontos apontados como problemas no sistema da *Netflix* são: - ***Requests the notification permission on page load***: Métrica relacionada ao popup de permissões de acesso da *Netflix* a determinados dados ou ferramentas da máquina do usuário sem apontar um propósito ou contexto específico. - ***Includes front-end JavaScript libraries with known security vulnerabilities***: Utilização na aplicação de bibliotecas que possuem vulnerabilidades conhecidas. Para aumentar o *score* dessa categoria é necessária a implementação de notificações de permissões que sejam mais específicos em relação ao tipo de acesso que está sendo pedido. Além disso, é interessante que sejam utilizadas bibliotecas na construção do código que tenham sido bastante testadas para o máximo de cenários possíveis e que possuam o menor número de vulnerabilidades, a fim de sanar o problema *"Includes front-end JavaScript libraries with known security vulnerabilities"* previamente citado. Com relação aos outros serviços de streaming, a *Prime video* possui um ótimo *score* nesse requisito, com um *score* de **92/100**, enquanto a *HBO max* possui **75/100** e na *Disney+* não foi possível coletar esse dado com a ferramenta. ## SEO ![](https://i.imgur.com/htBJE8E.png) A categoria SEO (*Search Engine Optimization*) está relacionado ao quão bem o site performa em relação a motores de busca, ou seja, o quão recomendado o site vai ser em relação à outros em a partir de algumas métricas definidas, como: - ***Document has a \<title> element***: O HTML *document* possui uma tag de título que é exibido na aba do navegador; - ***Page has successful HTTP status code***: A página possue requisições HTTP com códigos de sucesso; - ***Page is blocked from indexing***: A página está bloqueada de ser indexada pelo motor de busca; - **Document does have a meta description**: A tag *meta* do HTML *document* possui uma propriedade de descrição explicitada. No caso da *Netflix* a página possui problemas nas últimas duas métricas, onde a página em questão é bloqueada de ser indexada por motores de busca e não possui uma tag *meta* para descrição do conteúdo da página. No caso do ponto *"Page is blocked from indexing"*, este não necessariamente é um problema que deve ser consertado, já que para bloquear a indexação por motores de busca os desenvolvedores precisam explicitar isso, evidenciando talvez que esse bloqueio seja intencional por parte do sistema. Além disso, a adição da tag *meta* com a descrição do conteúdo da página deveria ser adicionado. Além disso, em relação a outros serviços de streaming, ao contrário de todos os pontos anteriores a *Disney+* ganha em disparada com um score de **(92/100)**, enquanto *Prime video* tem um score de **(82/100)**, assim como a *Netflix*, e por fim, a *HBO max* com **(73/100)** de score. Essa diferença do SEO na plataforma da *Disney+* mostra que ela foi desenvolvida e mantida focando muito mais em ser recomendada por motores de busca do que na experiência do usuário com a plataforma, uma vez que todas as outras métricas de usabilidade do sistema são baixas. ## Conclusão A partir das métricas analisadas no documento acima é possível afirmar que apesar de a plataforma da *Netflix* possuir diversos pontos que podem e devem ser melhorados, é evidente que a plataforma foi criada com objetivo e cuidado de ser *user-friendly*, se preocupando com a usabilidade do sistema por parte do usuário. Tal fato fica evidente ao analisarmos os *scores* das categorias [acessibilidade](#Acessibilidade) e [boas práticas](#Boas-praticas), sendo o primeiro um dos maiores *scores* dentre as suas concorrentes e com um *score* máximo para o segundo, respectivamente. Além disso, a plataforma possui a melhor pontuação dentre as outras no seu nível de [desempenho](#Desempenho), porém, esta também pode ser melhorada bastante, com a remoção de códigos *JS* não utilizados e a adoção do HTTP 2.0 nas requisições, por exemplo.