Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

255
Views
¿Cómo renderizar los componentes de React solo una vez al inicio?

He estado leyendo documentos sobre el rendimiento, pero no puedo encontrar la respuesta a mi pregunta...

Tengo un montón de botones en mi aplicación que se procesarán en función de algunas propiedades pero no del estado, los componentes principales nunca cambiarán sus propiedades. Luego tengo este controlador de eventos onKeyDown que escuchará algunas claves y actualizará otro componente.

Mi problema es que al presionar las teclas y actualizar este componente, todos los demás botones también se mostrarán (observados a través de las herramientas de desarrollo de React para Chrome). No he implementado shouldComponentUpdate(nextProps, nextState) en mis botones, pero ¿no debería React tener este comportamiento de forma predeterminada? Quiero decir, compare this.props con nextProps y si son exactamente iguales, no llame a render() ?

¿Se supone que debo hacer esto yo mismo para cada componente que solo debería renderizarse una vez al iniciar la aplicación?

EDITAR:PureComponent parece resolver el problema... Pero en lugar de crear una nueva pregunta, actualizo esta con una pregunta relacionada:

¿Por qué la documentación no recomendaría tener todos los componentes basados en PureComponent de forma predeterminada? ¿Cuáles son los argumentos en contra de usar PureComponent por defecto en lugar del típico Component ?

over 4 years ago · Santiago Trujillo
2 answers
Answer question

0

Los componentes puros deberían resolver su problema porque implementan una comparación superficial y de estado de forma predeterminada.

Enlace a los documentos.

Si la función render() de su componente React genera el mismo resultado con los mismos accesorios y estado, puede usar React.PureComponent para mejorar el rendimiento en algunos casos.

over 4 years ago · Santiago Trujillo Report

0

Una forma de asegurarse de que un componente React se represente solo una vez es hacer que shouldComponentUpdate devuelva false :

 class MyComponent extends React.Component { shouldComponentUpdate = () => false render() { return <div>{ this.props.children }</div>; } }

En el ejemplo anterior, incluso si this.props.children cambia, el componente no se volverá a representar. Se renderizará solo una vez, cuando esté montado.

over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!