Fri Jan 21 2022
...
FastComments Lança Renderização do Lado do Servidor
! Este Artigo Contém Jargão Técnico
O Que Há de Novo
Desde o lançamento no início de 2020, o FastComments tem usado exclusivamente JavaScript para renderizar o widget de comentários.
E se dissemos que você poderia ter quase toda a mesma funcionalidade essencial, mas sem usar JS?
A captura de tela acima é o widget de comentários do FastComments, sem JavaScript. Você pode visualizar esta página, sem JavaScript, aqui.
Como Usar
Se você estiver usando WordPress, a versão 3.10.1 do plugin FastComments adiciona automaticamente suporte para SSR como uma alternativa para os usuários que navegam com JS desativado.
Para implementações personalizadas, recupere a interface para um thread de comentários, simplesmente chame o /ssr/comments para essa página:
Onde $urlId é a url, ou id, da página. A documentação sobre isso está aqui.
Por exemplo, com PHP, podemos enviar um iframe para a página que renderiza o thread de comentários dentro:
Também poderíamos fazer uma chamada à API para obter o HTML para um thread de comentários, e renderizá-lo, ou armazená-lo.
A documentação completa está disponível nos Docs do SSR em docs.fastcomments.com.
SSO
Porque amamos siglas que soam empresariais, não se preocupe, o SSR suporta SSO. Um exemplo de Single-Sign-On com SSR está aqui.
Localização
O endpoint baseado em SSR localiza automaticamente a resposta com base nos cabeçalhos de idioma que o navegador envia. Ele também pode usar as mesmas substituições de localização que o widget baseado em JavaScript.
Por Que Isso Foi Construído
Uma das principais reclamações sobre serviços como o FastComments é que eles requerem JS. Nós já fazemos nosso widget de comentários o mais leve possível e garantimos que atendemos nossas SLAs de chamada de API de < 20ms, mas muitas comunidades menores não optarão por tal solução se isso significar adicionar JS ao seu site.
Isso também abre a oportunidade de usar mecanismos de renderização que não têm acesso ao JavaScript.
A Tecnologia
O FastComments usa seu próprio pequeno microframework para renderizar a interface. Este framework usa uma abordagem semelhante ao React, exceto que manipulações manuais do DOM fora da renderização inicial são permitidas.
A biblioteca central do widget de comentários tem um único ponto de entrada - ela leva um conjunto de estado e cria o HTML e CSS resultantes a serem renderizados. Chamamos isso no servidor também. Quando o usuário interage com a página, o estado é alterado e o HTML mais recente é recuperado. Isso foi criado como resultado de um hackathon que ocorreu como parte do ano novo.
Comentários Ao Vivo
Como a interface é renderizada pelo servidor, uma vez, os recursos de comentários ao vivo não estão disponíveis.
Além disso, o sino de notificações não está atualmente disponível. Estaremos abertos a adicionar esse recurso no futuro.
Desempenho
A interface renderizada pelo servidor usa as mesmas otimizações de armazenamento e o mecanismo de renderização que o widget baseado em JavaScript. Para threads de comentários pequenas, o desempenho é na verdade melhor, já que o usuário não precisa baixar um script que então busca os comentários e renderiza a interface.
Crawlers e SEO
O FastComments já funciona bem com crawlers da web; se SEO é uma preocupação, usar SSR não é obrigatório.
Aplicações Futuras
Planejamos lançar uma solução de Fórum no futuro. Tradicionalmente, fóruns são paginados e renderizados do lado do servidor. Soluções modernas de Fórum se afastam dessa norma ao usar rolagem infinita e renderização do lado do cliente. Não achamos que essa deva ser a única opção para usar uma solução de Fórum de terceiros.
Conclusão
Esperamos que você tenha achado este guia útil e fácil de ler. Sinta-se à vontade para comentar abaixo com qualquer pergunta.
Saudações!