{"id":"121c55a2-1ab4-48f3-9192-f0dece2a6877","owner_id":"07ea33ea-78bd-4578-bad2-1cf5323cab07","parent_id":null,"slug":"novas-melhorias-mais-performance-e-outras-6-melhorias","title":"Novas melhorias: Mais Performance e outras 6 melhorias 🎉","body":"Mais uma semana se passou desde a [última publicação](https://www.tabnews.com.br/filipedeschamps/novas-melhorias-rss-e-mais-7-melhorias) sobre as melhorias no TabNews e ao longo desse tempo **7 novas implementações** foram feitas!\n\n_* Observação: Eu demorei para escrever a publicação de hoje porque eu queria tentar encaixar mais uma implementação que vai melhorar as **notificações por email** e outras coisas relacionadas, mas vou lapidar alguns detalhes da implementação antes de fazer o deploy 🤝 então, vamos para as melhorias que já entraram em **Produção**:_\n\n## 1) Ainda mais performance nas páginas\n\nAgora todos os metadados de uma página são computados apenas no lado do **servidor** e isto faz uma **grande diferença** em publicações com **muita formatação** porque, por exemplo, para utilizar o `body` de uma publicação dentro de uma metatag de `description` você precisa limpar toda formatação do **Markdown**.\n\nOlha **impacto** que isso possa ter e para comparação, nota o campo **`Performance` antes desta implementação**:\n\n![Performance da página antes da otimização - 44 pontos](https://i.imgur.com/VJaasko.png)\n\nAgora veja o que aconteceu **depois da implementação**:\n\n![Performance da página depois da otimização - 73 pontos](https://i.imgur.com/lQP5Ufp.png)\n\nPara uma página pesada, o score saiu de **44** para **73** pontos, o que é muito bom!!! E ainda temos margem para melhorar, o que é **ótimo**! Nota ali as propriedades `Speed Index`, `Time to Interactive` e principalmente `Total Blocking Time` que interessante. Melhorar isso melhora tudo, desde a experiência para pessoas usando o site em aparelhos com menos performance, até o nosso score em **SEO**. Quem puder se focar nessas tarefas  para entender o que está acontecendo seria simplesmente **sensacional**!\n\nEsta implementação que fez o score pular de 44 para 73 pontos foi realizada por [kaique-soares](https://github.com/kaique-soares), que recebeu uma refatoração muito massa de [aprendendofelipe](https://github.com/aprendendofelipe) e as informações podem ser conferidas [por essa Issue*](https://github.com/filipedeschamps/tabnews.com.br/issues/650) 🎉\n\n## 2) Implementar Rate-Limit\n\nFoi dado mais um passo para tornar o TabNews mais seguro e agora nós implementamos Rate-Limit **em todos os endpoints sensíveis da API**, faltando apenas 1 endpoint não sensível que ainda não entrou na lista por um bug no Next.js que estamos acompanhando de perto 🤝\n\nO legal é que agora qualquer endpoint pode ter seu rate-limit controlado dinamicamente e por variáveis de ambiente, onde conseguimos configurar **limites globais** e **limites específicos** para cada **endpoint** e cada **método** HTTP.\n\nE para guardar o `state` das requisições estamos utilizando o **Upstash**, que é um serviço que consegue disponibilizar uma instância de **Redis** distribuída **globalmente** e por enquanto este é o atual consumo e custo:\n\n![Custo do Upstash](https://i.imgur.com/CcEQw0b.png)\n\nEsta implementação foi realizada por mim e teve total participação do [aprendendofelipe](https://github.com/aprendendofelipe) porque para um dos upgrades de dependências ele importou o módulo `nextjs-progressbar` para dentro do projeto e participou de todas as pesquisas sobre o bug do Next.js, custos do Upstash e todas essas informações podem ser conferidas [por essa Issue*](https://github.com/filipedeschamps/tabnews.com.br/issues/639) 🎉\n\n## 3) Mensagem muito mais bonita para lista de conteúdos vazia\n\nAntes, quando você entrava na página exclusiva de algum usuário aqui do TabNews e esse usuário não tivesse feito nenhuma publicação, aparecia uma mensagem completamente desalinhada de **Nenhum conteúdo encontrado**:\n\n![Mensagem desalinhada de nenhum conteúdo encontrado](https://i.imgur.com/Dma2Gd5.png)\n\nMas isso **não é TabNews**, então agora você irá encontrar uma mensagem **muito mais bonita**:\n\n![Mensagem bonita e alinhada de nenhum conteúdo encontrado](https://i.imgur.com/6f1BKsS.png)\n\nCom um **detalhe extremamente massa**: se você estiver **logado** e acessar a sua própria página, será apresentado um botão para você criar o seu primeiro conteúdo:\n\n![Botão para criar conteúdo](https://i.imgur.com/37shFx8.png)\n\nEsta implementação foi realizada por [luantoningalvan](https://github.com/luantoningalvan) e as informações podem ser conferidas [por essa Issue*](https://github.com/filipedeschamps/tabnews.com.br/issues/663) 🎉\n\n## 4) Breaking change: remoção da propriedade `username` do objeto `content`\n\nFinalizando a breaking change da API, encerramos a movimentação de remover a propriedade `username` do objeto `content` e substituir ela pela propriedade `owner_username`.\n\nEsta implementação foi realizada por mim e as informações podem ser conferidas [por essa Issue*](https://github.com/filipedeschamps/tabnews.com.br/issues/619) 🎉\n\n## 5) Limpar todas as informações locais ao fazer Logout\n\nPara tornar as informações digitadas aqui dentro do TabNews mais **seguras e privadas**, agora ao ser feito o Logout, **todas as informações de rascunho** das publicações que ficam salvas em `localStorage` são deletadas.\n\nAntes era removido apenas o cache do `user` que guarda coisas como a quantidade de `tabcoins`, `tabcash` e as `features` do usuário logado, mas agora irá deletar tudo, incluindo novas informações que possam ser adicionadas em cache no futuro:\n\n![Limpeza total do localStorage usando o método clear()](https://i.imgur.com/N8Yr17h.png)\n\nEsta implementação foi realizada por [rodrigoKulb](https://github.com/rodrigoKulb) e as informações podem ser conferidas [por essa Issue*](https://github.com/filipedeschamps/tabnews.com.br/issues/669) 🎉\n\n## 6) Breaking change: estratégia `best` movida para `relevant`\n\nComo antecipado [nesta publicação](https://www.tabnews.com.br/filipedeschamps/breaking-change-na-api-do-tabnews-sobre-o-objeto-content), nós estamos deprecando a `strategy` `best` e substituindo ela para `relevant` no endpoint que lista os conteúdos.\n\nAté então, o endpoint `/api/v1/contents` aceitava 3 tipos de estratégia:\n\n| Estratégia | Descrição |\n|-|-|\n| [/api/v1/contents?strategy=best](https://www.tabnews.com.br/api/v1/contents?strategy=best) | Ordena pelos conteúdos mais **relevantes.** |\n| [/api/v1/contents?strategy=new](https://www.tabnews.com.br/api/v1/contents?strategy=new) | Ordena dos conteúdos mais **novos** para os mais **antigos**. |\n| [/api/v1/contents?strategy=old](https://www.tabnews.com.br/api/v1/contents?strategy=old) | Ordena dos conteúdos mais **antigos** para os mais **novos**. |\n\nMas o nome da estratégia `best` não faz sentido, pois ela não lista os **melhores** conteúdos e sim os mais **relevantes para aquele momento**, por isto ela está sendo renomeada para [relevant](https://www.tabnews.com.br/api/v1/contents?strategy=relevant). Em paralelo, a estratégia `best` poderá ser usada no futuro para ordenar as publicações **apenas pelas `tabcoins`** para um **dia** em específico. Por exemplo, mostrar qual foi a publicação mais popular do dia `X`.\n\nPor hora, a estratégia `best` continua disponível na API e caso você possua algum `client` que implementou a paginação dos conteúdos do TabNews, **fortemente** sugerimos você utilizar o cabeçalho `Link` para que sua aplicação **automaticamente** utilize os links corretos. Isto significa que, se você utilizar este cabeçalho, você não precisará alterar sua aplicação para se adaptar a essa mudança. Caso queira mais informações sobre como isso funciona, sugiro ler [essa publicação](https://www.tabnews.com.br/filipedeschamps/nova-melhoria-paginacao-na-api-e-no-site).\n\nEsta implementação foi realizada por mim e as informações podem ser conferidas [por essa Issue*](https://github.com/filipedeschamps/tabnews.com.br/issues/658) 🎉\n\n## 7) Preenchimento retroativo de TabCoins\n\nTudo sobre esta tarefa já foi antecipado [nesta publicação](https://www.tabnews.com.br/filipedeschamps/tabcoins-retroativamente-preenchidas-e-com-um-bonus-de-10-tabcoins) e ela foi implementada por mim com participação de [aprendendofelipe](https://github.com/aprendendofelipe) e as informações podem ser conferidas [por essa Issue*](https://github.com/filipedeschamps/tabnews.com.br/issues/652) 🎉\n\n## Conclusão\n\nHá várias coisas que estão sendo feitas no TabNews com um **carinho extremo**, carinho que muitas vezes você **não irá encontrar** em ambientes corporativos. Nós podemos nos dar o luxo de fazer as coisas com calma, com qualidade, se importando **de verdade** com você que está lendo essa mensagem aqui e este **carinho** é um dos motivos que eu acredito vividamente que o TabNews será o \"Blender\" ou \"Godot\" da criação e leitura de conteúdos sobre Programação e Tecnologia no Brasil.\n\nTenham todos uma ótima semana!\n\n---\n\n⚠️ O repositório **Open Source** do TabNews ainda está em **Modo Privado**. Caso queira receber um convite para participar, [leia esta publicação](https://www.tabnews.com.br/filipedeschamps/quem-deseja-acesso-ao-repositorio-privado-do-tabnews).","status":"published","type":"content","source_url":null,"created_at":"2022-08-22T15:51:54.223Z","updated_at":"2022-08-22T15:51:54.223Z","published_at":"2022-08-22T15:51:54.248Z","deleted_at":null,"owner_username":"filipedeschamps","tabcoins":22,"tabcoins_credit":21,"tabcoins_debit":0,"children_deep_count":7}