Upgrade to Pro — share decks privately, control downloads, hide ads and more …

React 2019: O que podemos esperar?

React 2019: O que podemos esperar?

Essa apresentação mostra as novidades aguardadas para este ano no React, além de demonstrar maneiras práticas de aplicá-las em código.

Hillary Sousa

June 10, 2019
Tweet

More Decks by Hillary Sousa

Other Decks in Technology

Transcript

  1. React 2019: O que esperar? | BIT Tech Week Certo,

    mas o que é React? • É a biblioteca mais popular da atualidade, com mais de 22 milhões de downloads no último mês no NPM. • Utilizado em diversos sites de alto tráfego, como The New York Times, Twitter, Netflix, MDN e, é claro, nas nossas marcas. React é uma biblioteca JavaScript para construção de interfaces de usuário.
  2. Antes, uma olhada em 2018 React 2019: O que esperar?

    | BIT Tech Week Code Splitting com React.Suspense e React.lazy() • Disponível a partir da versão 16.6 • Permite fazer uma espécie de lazy loading de componentes, reduzindo o tamanho do bundle e melhorando a performance. • Ainda não está disponível no React DOM Server.
  3. Antes, uma olhada em 2018 React 2019: O que esperar?

    | BIT Tech Week Concurrent mode • Disponível como instável a partir da versão 16.6 • Permite renderizar componentes sem bloquear a main thread. • Ainda não possui documentação.
  4. O que já rolou em 2019 React 2019: O que

    esperar? | BIT Tech Week React Hooks • Disponível a partir da versão 16.8 • Terá suporte a partir da versão 0.59 do React Native • Permite usar o estado (state) e outros recursos do React fora de classes (class). • São completamente retrocompatíveis • Site com mais receitas de Hooks: http://usehooks.com
  5. O que já rolou em 2019 React 2019: O que

    esperar? | BIT Tech Week useState() • Não mescla o estado antigo com o novo • Precisa somente do estado inicial • Pode ser chamado mais de uma vez no componente • o estado não precisa ser um objeto, mas se quiser pode Link de exemplo: https://codesandbox.io/s/usestateexemplo-u31hv
  6. O que já rolou em 2019 React 2019: O que

    esperar? | BIT Tech Week useEffect() • Serve ao mesmo propósito do componentDidMount(), componentDidUpdate() e componentWillUnmount() • Pode ser chamado mais de uma vez no mesmo componente • É executado após o render (incluindo o primeiro) • Também podem especificar como “limpar” as mudanças usando return Link de exemplo: https://codesandbox.io/s/useeffectexemplo-o721b
  7. React 2019: O que esperar? | BIT Tech Week Próximos

    updates de 2019 React.Suspense para fetch de dados • Está sendo chamado de React Cache pelo core team • Provavelmente será lançado no meio do ano • Bibliotecas como o Apollo e o Relay poderão ser integradas • Seu uso ainda não é recomendado, tendo em vista a falta de diversos recursos básicos de cache
  8. React 2019: O que esperar? | BIT Tech Week Próximos

    updates de 2019 React.Suspense para server-side rendering • É o foco do core team para 2019 • A proposta é incluir a espera por dados assíncronos no servidor, sem causar double rendering (ou o famoso pulinho) • Ainda não tem data prevista para lançamento
  9. tl;dr React 2019: O que esperar? | BIT Tech Week

    React.Suspense e React.lazy() Disponíveis a partir da versão 16.6 Permitem o code splitting Concurrent mode Disponível como instável a partir da versão 16.6 Não bloqueia a main thread ao renderizar componentes React.Hooks Disponível a partir da versão 16.8 Permite utlizar o state e outros recursos fora de classes React.Suspense para fetch de dados e server-side rendering Sem data de lançamento Permite carregar dados progressivamente e em partes
  10. O que já rolou em 2019 React 2019: O que

    esperar? | BIT Tech Week • Roadmap do React: https://reactjs.org/blog/2018/11/27/react-16-roadmap.html • Code splitting com React: https://reactjs.org/docs/code-splitting.html • Overview de Hooks: https://reactjs.org/docs/hooks-overview.html • Site com mais receitas de Hooks: http://usehooks.com • Comparação entre os maiores frameworks JavaScript: https://npmcharts.com/compare/react,vue,angular?minimal=true&interval=30
  11. React 2019: O que esperar? | BIT Tech Week Obrigada!

    Me encontre nas redes: github.com/hillarysousa linkedin.com/in/hillarysousa hillarysousa.com speakerdeck.com/hillarysousa