Reação 17: Nada de novo?

Disclamer

Esta é uma tradução gratuita do artigo original do blog oficial. Por que grátis? Em vez disso, porque o original contém muita água e referências aos motivos de certas decisões tomadas no passado.

Nada de novo?

A décima sétima versão do React é incomum pela falta de novos recursos e / ou funcionalidades. Este lançamento é focado em adicionar a capacidade de atualizar gradualmente projetos para as próximas versões principais da biblioteca no futuro , o que é relevante para projetos com uma grande base de código.

Concurrent Mode 17 , , . () .

7 React " ". , . , - , , Context API, .

React 17 . React 17. .

: . . , (React 18, React 19), - lazy- React 17.

, (lazy-load) React. React 17.0.0-rc.0, , , React 16.8

React 17

, onClick, DOM-. document. , .

, , React , jQuery, . event.stopPropagation(): (propagation) , . React. Atom .

, document:

const rootNode = document.getElementById('root'); // <--  
ReactDOM.render(<App />, rootNode);

(SyntheticEvent Even Pooling)

17- , .

function handleChange(event) {
  //    16 React    event.persist()
  setData(data => ({
    ...data,
    // This crashes in React 16 and earlier:
    text: event.target.value
  }));
}

, event.persist()

. Facebook . , - !

. React .

  • onScroll , ;

  • onFocus onBlur " " focusin focusout;

  • onClickCapture Capture- .

useEffect()

useEffect(() => {
  // This is the effect itself.
  return () => {
    // This is its cleanup.
  };
});

, , componentWillUnmount(), , , , , .

, - useLayoutEffect(), .

undefined

, .

undefined , React.forwardRef React.memo.

let Button = forwardRef(() => {
  // We forgot to write return, so this component returns undefined.
  // React 17 surfaces this as an error instead of ignoring it.
  <button />;
});

let Button = memo(() => {
  // We forgot to write return, so this component returns undefined.
  // React 17 surfaces this as an error instead of ignoring it.
  <button />;
});

, stack trace . , , .

, Button , React- .

17- React , React-, , production-.

— , . , React Native for Web , .

17- React . - , , .

ReactTestUtils.SimulateNative . , .

Changelog

, , .

A nova versão do React também inclui 5 mudanças no React, 37 mudanças no React Dom, algumas mudanças no React DOM Server, uma mudança no React Test Rerender.

E quanto ao modo simultâneo?

Este modo ainda é experimental. Na 17 ª Reagir foram corrigidos muitos bugs, removido alguns unstable_métodos, e acrescentou novos. É muito cedo para usá-lo para produção, mas é definitivamente possível e necessário cutucá-lo. Por exemplo, existe uma biblioteca para trabalhar com Firebase, reactfire , cujos desenvolvedores tornaram a versão principal dependente do modo simultâneo. Infelizmente, o repositório parece ter sido abandonado nos últimos meses. Espero que isso seja corrigido.




All Articles