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

156
Views
Cómo funciona Virtual DOM en React o Vue

Soy un estudiante y estoy tratando de crear un DOM virtual propio para mi proyecto universitario (no tendrá ninguna función avanzada como accesorios o eventos, lo mantendré simple) en JavaScript como otros marcos famosos React, Vue y otros.

Solo quiero saber eso cuando tenemos varios archivos de código (división de código). Si realizo un cambio en cualquier elemento secundario profundo, entonces necesito comparar el DOM virtual completo (incluidos todos los elementos secundarios y principales) o solo necesito comparar solo esos elementos secundarios.

Si tengo que comparar el nuevo DOM virtual completo (incluidos todos los niños) con el DOM virtual anterior. Entonces, ¿por qué debería importarme volver a renderizar en React o Vue (porque cualquier cambio en el niño obligará al marco a comparar Virtual DOM completo)

about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

Para Vue, el funcionamiento del DOM virtual difiere en vue2 y vue3.

La forma en que vue3 lo hace es,

  1. Analizando la plantilla HTML o la función de representación de los archivos de componentes y convirtiéndola en una representación de nodo virtual.
  2. Mientras realiza el análisis, registra los nodos que dependen de los datos dinámicos.
  3. Algo como abajo
 dynamicData = { data1: [ effect1, effect2, ... ], data2: [ effect4, effect5, ... ], ... }
  1. Los efectos son funciones que definen los cálculos necesarios para resolver ciertos valores de datos.
  2. Los efectos también incluyen la función de renderizado para los nodos virtuales.
  3. Las funciones de representación convierten de forma inteligente los nodos virtuales en elementos DOM
  4. Ahora, cada vez que data1 cambia, Vue3 vuelve a ejecutar los efectos correspondientes y activa la actualización para los cambios de datos posteriores.

Referencias:

  1. Reactividad Vue3
  2. Transformación de Vnodo
about 4 years ago · Juan Pablo Isaza Report

0

La respuesta a su último punto, como deduzco de mi experiencia con React, es que comparar DOM virtuales en Javascript es lo que ayuda a reaccionar a saber qué cosas tiene que volver a renderizar en el DOM real, por lo que la "renderización" es la difícil. parte en la que el rendimiento de la aplicación se ve afectado. Con suerte, esto ayudaría.

about 4 years ago · Juan Pablo Isaza 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!