Notícias dos desenvolvedores: React 19 Beta e Redwood Tests React Server Components

React 19 beta lançado quinta-feira e inclui todos os recursos do React Server Components do canal canário.

Os novos recursos desta versão beta incluem:

• Ações. “No React 19, estamos adicionando suporte para o uso de funções assíncronas em transições para lidar automaticamente com estados pendentes, erros, formulários e atualizações otimistas”, afirmou a equipe em uma postagem no blog sobre o React 19 beta.
• Novo gancho: useActionState. Isso foi adicionado “para facilitar os casos comuns para ações”, escreveu a equipe.
• Reagir ações do DOM
  
  . As ações são integradas aos novos recursos

  do React 19 para react-dom.
• React DOM: Novo gancho: useFormStatus, que torna mais fácil escrever componentes de design que precisam de acesso a informações sobre o
  em que estão, sem detalhar as propriedades do componente.
• Novo gancho: useOptimistic. “Outro padrão de UI comum ao realizar uma mutação de dados é mostrar o estado final de forma otimista enquanto a solicitação assíncrona está em andamento”, escreveu a equipe. “No React 19, estamos adicionando um novo gancho chamado useOptimistic para tornar isso mais fácil.”
• Nova API: use. Há uma nova API para ler recursos em render: use. Isso pode ser usado para ler uma promessa, que o React suspenderá até que a promessa seja resolvida.

A equipe também explicou um pouco mais sobre os componentes do React Server. Eles são uma nova opção que “permite renderizar componentes antecipadamente, antes do agrupamento, em um ambiente separado do seu cliente ou servidor SSR”, escreveu a equipe. O ambiente separado é o “servidor” e os componentes do servidor podem ser executados uma vez no momento da construção em um servidor de CI ou podem ser executados para cada solicitação usando um servidor web, explicou a equipe.

“Isso significa que as bibliotecas fornecidas com componentes de servidor agora podem direcionar o React 19 como uma dependência de peer com uma condição de exportação do servidor react para uso em estruturas que suportam a arquitetura React Full-stack”, observou a equipe.

Embora os componentes do React Server sejam estáveis ​​​​e não se quebrem entre as visões principais, infelizmente a API subjacente usada para implementar o empacotador ou estrutura de componentes “não segue o servidor e pode quebrar entre as visões secundárias no React 19.x”, escreveu a equipe.

“Para oferecer suporte aos componentes do React Server como um empacotador ou estrutura, recomendamos fixar em uma versão específica do React ou usar a versão Canary”, afirmou a postagem do blog sobre o lançamento. “Continuaremos trabalhando com empacotadores e estruturas para estabilizar as APIs usadas para implementar os componentes do React Server no futuro.”

Redwood.js testa componentes do servidor React

Já que estamos no assunto, Redwood.js, uma estrutura JavaScript, está mexendo nos componentes do React Server criando documentação. Redwood.js adicionou suporte para os componentes no final de março.

A equipe queria ver como seria construir um site de documentação com React Server Component. O aplicativo de documento resultante é chamado Docwood. Eles definiram os seguintes requisitos para o projeto:

• O site de documentos deve ser um aplicativo React real em execução no navegador e não um site gerado estaticamente.
• Visualizar um documento significava invocar o fluxo RSC para fazer uma solicitação a um servidor, onde o Markdown seria cumprido e retornado imediatamente.
• Nenhum Markdown->HTML pré-convertido armazenado em qualquer lugar, nenhum conteúdo armazenado em um banco de dados, nenhum pré-processamento de arquivos de documentos no momento da construção. “No entanto, o serviço de cache da Redwood poderia ser usado, já que ainda estaríamos realizando uma solicitação RSC completa e convertendo Markdown em HTML em tempo real para preencher o cache”, acrescentaram.

A equipe explica como criar um novo aplicativo Redwood do zero e como lidar com roteamento e navegação. Eles descobriram que o aplicativo era relativamente rápido, considerando a quantidade de computação que estava acontecendo nos bastidores.

“O RSC ainda está sendo desenvolvido ativamente e novos recursos são adicionados todos os dias, então esperamos que a experiência melhore bastante até o lançamento real do RedwoodJS Bighorn”, escreveu a equipe.

TypeScript 5.5 Beta inclui uma longa lista de novos recursos

A versão beta do TypeScript 5.5 foi disponibilizada na quinta-feira.

O primeiro de uma longa lista de novos recursos são os predicados de tipo inferidos, implementados pelo desenvolvedor Dan Vanderkam, que explicou que o TypeScript agora pode inferir um predicado de tipo para a função de filtro. Ele escreve que o TypeScript inferirá que uma função retorna um predicado de tipo se:

1. A função não possui um tipo de retorno explícito ou uma anotação de predicado de tipo.
2. A função possui uma única instrução de retorno e nenhum retorno implícito.
3. A função não altera seu parâmetro.
4. A função retorna uma expressão booleana vinculada a um refinamento no parâmetro.

Vanderkam escreveu detalhadamente sobre sua experiência como voluntário no TypeScript, com uma explicação de como ele encontrou ideias sobre como contribuir.

Entre os novos recursos adicionados nesta versão beta:

• Controle o estreitamento do fluxo para acessos indexados constantes.
• Digite importações em JSDoc.
• Verificação de sintaxe de expressão regular.
• Declarações isoladas.
• Tipos explícitos.

Este beta também inclui uma série de melhorias de desempenho e tamanho, escreveu Daniel Rosenwasser, gerente sênior de programa do TypeScript.

“No TypeScript 5.0, garantimos que nossos objetos Node e Symbol tivessem um conjunto consistente de propriedades com uma ordem de inicialização consistente”, explicou Rosenwasser. “Isso ajuda a reduzir o polimorfismo em diferentes operações, o que permite que os tempos de execução busquem propriedades mais rapidamente.”

Isso levou a “ganhos impressionantes de velocidade no compilador”, acrescentou.

“No TypeScript 5.5, o mesmo trabalho de monomorfização foi feito para o serviço de linguagem e API pública”, continuou ele. “O que isso significa é que sua experiência de editor e qualquer ferramenta de construção que use a API TypeScript serão muito mais rápidas.”

Em benchmarks, isso levou a uma aceleração de 5 a 8% nos tempos de construção ao usar os alocadores públicos da API TypeScript, e as operações de serviço de linguagem tornaram-se 10 a 20% mais rápidas, escreveu ele.

“Embora isso implique um aumento na memória, acreditamos que a compensação vale a pena e esperamos encontrar maneiras de reduzir essa sobrecarga de memória”. Rosenwasser disse. “As coisas devem parecer muito mais rápidas agora.”

O tamanho da embalagem também foi reduzido significativamente, tornando tserver.js e typingsInstaller.js importar de uma biblioteca de API comum, em vez de cada um produzir um pacote independente. Isso fez com que o tamanho do disco diminuísse de 30,2 MB para 20,4 MB e reduzisse o tamanho do pacote de 5,5 MB para 3,7 MB, observou ele.

A equipe também publicou um cronograma de iteração com datas de lançamento previstas.

A postagem Dev News: React 19 Beta e Redwood Tests React Server Components apareceu pela primeira vez em The New Stack.