19.0.0 (5 de diciembre de 2024)
Nuevas funciones
React
- Actions:
startTransition ahora puede aceptar funciones asíncronas. Estas funciones se llaman "Actions" y actualizan el estado en segundo plano y hacen commit de la UI de una sola vez. Las Actions pueden realizar efectos secundarios como solicitudes asíncronas y esperan a que el trabajo termine antes de que la Transition se complete.
useActionState: nuevo hook que permite ordenar Actions dentro de una Transition y acceder al estado. Acepta un estado inicial y un reducer.useOptimistic: nuevo hook para actualizar el estado mientras una Transition está en curso. Cuando la Transition termina, el estado se actualiza con el nuevo valor.use: nueva API para leer recursos durante el renderizado. Acepta una Promise o Context; si se proporciona una Promise, se suspende hasta que el valor se resuelva.- Usar
ref como prop: ahora se puede usar ref como prop sin necesidad de forwardRef.
- Precalentamiento de hermanos de Suspense: cuando un componente se suspende, React hace commit inmediatamente del fallback del límite de Suspense más cercano.
Cliente de React DOM
- Prop
action de <form>: las Form Actions administran automáticamente el formulario y se integran con useFormStatus. Restablecen automáticamente el formulario al tener éxito.
- Soporte para metadatos del documento: ahora se pueden renderizar de forma nativa etiquetas de metadatos del documento desde componentes.
- Soporte para hojas de estilo: inserta hojas de estilo en el
<head> del cliente antes de revelar el contenido de un límite de Suspense.
- Soporte para scripts asíncronos: se pueden renderizar scripts asíncronos desde cualquier parte del árbol de componentes.
Servidor de React DOM
- Se agregan las API
prerender y prerenderToNodeStream: API para generación de sitios estáticos, diseñadas para funcionar en entornos de streaming como streams de Node.js y Web Streams.
Componentes de servidor de React
- Funcionalidades de RSC: se estabilizan las directivas, los componentes de servidor y las funciones de servidor. Las librerías que incluyen componentes de servidor ahora pueden apuntar a React 19 como dependencia peer.
En desuso
- Acceso a
element.ref: se deja en desuso el acceso a element.ref en favor de element.props.ref.
react-test-renderer: en React 19, react-test-renderer registra una advertencia de deprecación y cambia a renderizado concurrente para uso web.
Cambios principales
React
- Nueva transformación de JSX obligatoria: se requiere la nueva transformación de JSX para mejorar el tamaño del bundle y permitir usar JSX sin importar React.
- Los errores de renderizado ya no se relanzan: si un Error Boundary no captura el error, se reporta a
window.reportError.
- Eliminación de
propTypes: el uso de propTypes se ignora silenciosamente. Se recomienda migrar a TypeScript.
- Eliminación de
defaultProps en funciones: se pueden usar parámetros predeterminados de ES6 en su lugar.
- Eliminación de string refs: el uso de string refs debe migrarse a callbacks de ref.
React DOM
- Eliminación de
react-dom/test-utils: act se mueve de react-dom/test-utils a react. Las demás utilidades se eliminan.
- Eliminación de
ReactDOM.render y ReactDOM.hydrate: se reemplazan por ReactDOM.createRoot y ReactDOM.hydrateRoot para renderizado concurrente.
Cambios destacados
React
- Usar
<Context> como proveedor: ahora se puede renderizar <Context> como proveedor en lugar de <Context.Provider>.
- Soporte para custom elements: React 19 pasa todas las pruebas de custom elements.
- Cambios en StrictMode:
useMemo y useCallback reutilizan el resultado memorizado del primer renderizado.
React DOM
- Diferencias en errores de hydration: cuando ocurre una discrepancia, React 19 registra un único error que incluye las diferencias del contenido no coincidente.
Cambios en TypeScript
- Se prohíbe el retorno implícito: los refs ahora solo aceptan funciones de limpieza. El retorno implícito genera un error.
- Se requiere el argumento inicial de
useRef: el argumento inicial ahora es obligatorio.
- Tipado más estricto de
ReactElement: las props de los elementos de React ahora usan unknown por defecto en lugar de any.
1 comentarios
Opiniones en Hacker News
Hay quien siente que es posible y divertido crear apps escalables usando React
Hay una opinión positiva sobre la nueva versión de React, aunque existe la preocupación de que a los principiantes les cueste empezar
Hay quien opina que la complejidad de los frameworks del lado del cliente está aumentando
Se valora positivamente que en la nueva versión se haya agregado la función
ref as a prop, lo que elimina la necesidad deforwardRefSe menciona Jotai, un clon de Recoil, en lugar de Redux, y se comenta que es compatible con React 19
Hay quien espera que se cambie el nombre de la API
useSe valora positivamente que hayan retrasado la versión para resolver el problema de suspense en paralelo
Hay dudas sobre si el hook
useActionStatepuede construirse a partir de los hooks integrados existentesSe valora positivamente que se hayan agregado funciones que fomentan el uso de tecnologías web estándar y otras que mejoran la calidad de vida