¿Mejora el rendimiento si solo importo lo que necesito? Creo que depende de cierta configuración del paquete web, ¿es eso cierto? en caso afirmativo, ¿ create-react-app tiene esa configuración integrada de forma predeterminada? ¿Cómo pruebo cuánto rendimiento estoy ganando al hacer esto?
Por ejemplo en lugar de esto:
import React from "react"; import ReactDOM from "react-dom/client"; const root = ReactDOM.createRoot(document.getElementById("root") as HTMLElement); root.render( <React.Fragment> <h1>Hello</h1> </React.Fragment> );Puedo usar dependencias de esta manera:
import { Fragment } from "react"; import { createRoot } from "react-dom/client"; const root = createRoot(document.getElementById("root") as HTMLElement); root.render( <Fragment> <h1>Hello</h1> </Fragment> );No obtendrá ningún rendimiento con dichas importaciones.
Lo único que puede lograr al desestructurar las importaciones es reducir el tamaño del paquete (lea sobre sacudir árboles ).
Pero en caso de importación de react , me temo que no tendrá ningún efecto, puede verificar el tamaño del paquete construido con y sin desestructuración