Update part6d.md (ES)

Author: vlondonoma

src/content/6/es/part6d.md

@@ -270,7 +270,7 @@ El código actual de la aplicación está en [GitHub](https://github.com/fullsta
 
 ### Optimizando el rendimiento
 
-La aplicación funciona bien y el código es relativamente simple. La facilidad de realizar cambios en la lista de notas es particularmente sorprendente. Por ejemplo, cuando cambiamos la importancia de una nota, invalidar la consulta <i>notes</i> es suficiente para que los datos de la aplicación se actualicen:
+La aplicación funciona bien y el código es relativamente simple. La facilidad de realizar cambios en la lista de notas es particularmente sorprendente. Cuando cambiamos la importancia de una nota, invalidar la consulta <i>notes</i> es suficiente para que los datos de la aplicación se actualicen:
 
 ```js
   const updateNoteMutation = useMutation(updateNote, {
@@ -317,7 +317,7 @@ Si observamos de cerca la pestaña de red del navegador, nos damos cuenta de que
 
 ![](../../images/6/62new.png)
 
-¿Que es lo que está pasando? Al leer la [documentación](https://react-query-v3.tanstack.com/reference/useQuery), nos damos cuenta de que la funcionalidad predeterminada de las consultas de React Query es que las consultas (cuyo estado es <i>stale</i>) se actualizan cuando <i>window focus</i>, es decir, el elemento activo de la interfaz de usuario de la aplicación, cambia. Si queremos, podemos desactivar la funcionalidad creando una consulta de la siguiente manera:
+¿Que es lo que está pasando? Al leer la [documentación](https://react-query-v3.tanstack.com/reference/useQuery), nos damos cuenta de que la funcionalidad predeterminada de las consultas de React Query es que las consultas (cuyo estado es <i>stale</i>) se actualizan con el evento <i>window focus</i>, es decir, cuando cambia el elemento activo de la interfaz de usuario de la aplicación. Si queremos, podemos desactivar la funcionalidad creando una consulta de la siguiente manera:
 
 ```js
 const App = () => {
@@ -330,11 +330,11 @@ const App = () => {
 }
 ```
 
-Si colocas una instrucción <i>console.log</i> en el código, puede ver desde la consola del navegador cuántas veces React Query hace que la aplicación se vuelva a renderizar. La regla general es que el renderizado ocurre al menos cada vez que es necesario, es decir, cuando cambia el estado de la consulta. Puede leer más al respecto, por ejemplo, [aquí](https://tkdodo.eu/blog/react-query-render-optimizations).
+Si colocas una instrucción <i>console.log</i> en el código, puede ver desde la consola del navegador cuántas veces React Query hace que la aplicación se vuelva a renderizar. La regla general es que el renderizado ocurre al menos cada vez que es necesario, es decir, cuando cambia el estado de la consulta. Puede leer más al respecto [aquí](https://tkdodo.eu/blog/react-query-render-optimizations).
 
 El código de la aplicación está en [GitHub](https://github.com/fullstack-hy2020/query-notes/tree/part6-3) en la rama <i>part6-3</i>.
 
-React Query es una biblioteca versátil que, basada en lo que ya hemos visto, simplifica la aplicación. ¿Hace React Query soluciones de gestión de estado más complejas como Redux innecesarias? No. React Query puede reemplazar parcialmente el estado de la aplicación en algunos casos, pero como lo indica la [documentación](https://react-query-v3.tanstack.com/guides/does-this-replace-client-state)
+React Query es una biblioteca versátil que, basada en lo que ya hemos visto, simplifica la aplicación. ¿Hace React Query soluciones de gestión de estado más complejas como Redux innecesarias? No. React Query puede reemplazar parcialmente el estado de la aplicación en algunos casos, pero como lo indica la [documentación:](https://react-query-v3.tanstack.com/guides/does-this-replace-client-state)
 
 - React Query es una <i>librería de estado del servidor</i>, responsable de la gestión de operaciones asíncronas entre el servidor y el cliente
 - Redux, etc. son <i>librerías de estado del cliente</i> que se pueden usar para almacenar datos asíncronos, aunque de manera menos eficiente cuando se comparan con una herramienta como React Query
@@ -359,9 +359,9 @@ La aplicación debe funcionar de tal manera que si hay problemas para comunicars
 
 ![](../../images/6/65new.png)
 
-Puedes encontrar [aquí](https://react-query-v3.tanstack.com/guides/queries) información sobre cómo detectar posibles errores.
+Puede encontra [aquí](https://react-query-v3.tanstack.com/guides/queries) información sobre cómo detectar posibles errores.
 
-Puedes simular un problema con el servidor, por ejemplo, apagando el servidor JSON. Tenga en cuenta que en una situación problemática, la consulta primero está en el estado <i>isLoading</i> durante un tiempo, porque si una solicitud falla, React Query intenta la solicitud varias veces antes de que indique que la solicitud no es exitosa. Opcionalmente, puede especificar que no se realizan reintentos:
+Puede simular un problema con el servidor apagando el servidor JSON. Tenga en cuenta que en una situación problemática, la consulta primero está en el estado <i>isLoading</i> durante un tiempo, porque si una solicitud falla, React Query intenta la solicitud varias veces antes de que indique que la solicitud no es exitosa. Opcionalmente, puede especificar que no se realizan reintentos:
 
 ```js
 const result = useQuery(
@@ -372,7 +372,7 @@ const result = useQuery(
 )
 ```
 
-o que la solicitud se vuelva a intentar, por ejemplo, solo una vez más:
+o que la solicitud se vuelva a intentar solo una vez más:
 
 ```js
 const result = useQuery(
@@ -389,8 +389,7 @@ Implemente la adición de nuevas anécdotas al servidor usando React Query. La a
 
 #### Ejercicio 6.22
 
-Implement voting for anecdotes using again the React Query. The application should automatically render the increased number of votes for the voted anecdote
-Implemente votar las anécdotas usando nuevamente React Query. La aplicación debe renderizar automáticamente el número aumentado de votos para la anécdota votada.
+Implemente la votación de anécdotas usando nuevamente React Query. La aplicación debe renderizar automáticamente el número aumentado de votos para la anécdota votada.
 
 </div>
 
@@ -404,7 +403,7 @@ Veamos una aplicación simple de contador. La aplicación muestra el valor del c
 
 ![](../../images/6/63new.png)
 
-Ahora implementaremos la gestión del estado del contador usando un mecanismo de gestión de estado similar a Redux proporcionado por el gancho de React [useReducer](https://beta.reactjs.org/reference/react/useReducer). El código se ve así:
+Ahora implementaremos la gestión del estado del contador usando un mecanismo de gestión de estado similar a Redux proporcionado por el hook de React [useReducer](https://beta.reactjs.org/reference/react/useReducer). El código se ve así:
 
 ```js
 import { useReducer } from 'react'
@@ -440,7 +439,7 @@ const App = () => {
 export default App
 ```
 
-El hook [useReducer](https://beta.reactjs.org/reference/react/useReducer) proporciona un mecanismo para crear un estado para una aplicación. El parámetro para crear un estado es la función del reducer que maneja los cambios de estado, y el valor inicial del estado:
+El hook [useReducer](https://beta.reactjs.org/reference/react/useReducer) proporciona un mecanismo para crear un estado en la aplicación. El parámetro es la función del reducer que maneja los cambios de estado y el valor inicial del estado:
 
 ```js
 const [counter, counterDispatch] = useReducer(counterReducer, 0)
@@ -527,7 +526,7 @@ const App = () => {
 }
 ```
 
-La solución funciona, pero no es óptima. Si la estructura de los componentes se complica, por ejemplo, el despachador debe transmitirse usando props a través de muchos componentes para llegar a los componentes que lo necesitan, aunque los componentes intermedios en el árbol de componentes no necesiten el despachador. Este fenómeno se llama <i>prop drilling</i>.
+La solución funciona, pero no es óptima. Si la estructura de los componentes se complica el despachador debe transmitirse usando props a través de muchos componentes para llegar a los componentes que lo necesitan, aunque los componentes intermedios en el árbol de componentes no necesiten el despachador. Este fenómeno se llama <i>prop drilling</i>.
 
 La [API de contexto](https://beta.reactjs.org/learn/passing-data-deeply-with-context) integrada en React proporciona una solución para nosotros. El contexto de React es un tipo de estado global de la aplicación, al que se puede dar acceso directo a cualquier componente de la aplicación.
 
@@ -668,7 +667,7 @@ const App = () => {
 export default App
 ```
 
-The context is still used in the same way, e.g. the component <i>Button</i> is defined as follows:
+El contexto es usado de la misma forma en el componente <i>Button</i>, como se ve a continuación:
 
 ```js
 import { useContext } from 'react'
@@ -714,7 +713,9 @@ export const useCounterDispatch = () => {
 // ...
 ```
 
-Con la ayuda de estas funciones auxiliares, es posible que los componentes que usan el contexto obtengan la parte del contexto que necesitan. El componente <i>Display</i> cambia de la siguiente manera:
+Con la ayuda de estas funciones auxiliares, es posible que los componentes que usan el contexto obtengan la parte del contexto que necesitan. 
+
+El componente <i>Display</i> cambia de la siguiente manera:
 
 ```js
 import { useCounterValue } from '../CounterContext' // highlight-line
@@ -763,9 +764,7 @@ Como detalle técnico, debe tenerse en cuenta que las funciones auxiliares <i>us
 
 La aplicación tiene un componente <i>Notification</i> para mostrar notificaciones al usuario.
 
-Implement the application's notification state management using the useReducer hook and context. The notification should tell the user when a new anecdote is created or an anecdote is voted on:
-
-Implemente la gestión de estado de notificación de la aplicación utilizando el hook useReducer y el contexto. La notificación debe informar al usuario cuando se crea una nueva anécdota o se vota por una anécdota:
+Implemente la gestión de estado de notificación de la aplicación utilizando el hook useReducer y el contexto. La notificación debe informar al usuario cuando se crea una nueva anécdota o se vota por ella:
 
 ![](../../images/6/66new.png)
 
@@ -798,13 +797,11 @@ Para una aplicación simple, <i>useState</i> es sin duda un buen punto de partid
 
 La solución de gestión de estado más completa y robusta es Redux, que es una forma de implementar la llamada [Flux](https://facebook.github.io/flux/) arquitectura. Redux es ligeramente más antiguo que las soluciones presentadas en esta sección. La rigidez de Redux ha sido la motivación para muchas nuevas soluciones de gestión de estado, como el <i>useReducer</i> de React. Algunas de las críticas a la rigidez de Redux ya se han vuelto obsoletas gracias al [Redux Toolkit](https://redux-toolkit.js.org/).
 
-Over the years, there have also been other state management libraries developed that are similar to Redux, such as the newer entrant [Recoil](https://recoiljs.org/) and the slightly older [MobX](https://mobx.js.org/). However, according to [Npm trends](https://npmtrends.com/mobx-vs-recoil-vs-redux), Redux still clearly dominates, and in fact seems to be increasing its lead:
-
 A lo largo de los años, también se han desarrollado otras librería de gestión de estado que son similares a Redux, como el recién llegado [Recoil](https://recoiljs.org/) y el ligeramente más antiguo [MobX](https://mobx.js.org/). Sin embargo, según [Tendencias de Npm](https://npmtrends.com/mobx-vs-recoil-vs-redux), Redux todavía domina claramente, y de hecho parece estar aumentando su ventaja:
 
 ![](../../images/6/64new.png)
 
-También, Redux no tiene que usarse en su totalidad en una aplicación. Puede tener sentido, por ejemplo, gestionar el estado del formulario fuera de Redux, especialmente en situaciones en las que el estado de un formulario no afecta al resto de la aplicación. También es perfectamente posible usar Redux y React Query juntos en la misma aplicación.
+También, Redux no tiene que usarse en su totalidad en una aplicación. Puede tener sentido gestionar el estado del formulario fuera de Redux, especialmente en situaciones en las que el estado de un formulario no afecta al resto de la aplicación. También es perfectamente posible usar Redux y React Query juntos en la misma aplicación.
 
 La pregunta de qué solución de gestión de estado se debe usar no es para nada sencilla. No es posible dar una sola respuesta correcta. También es probable que la solución de gestión de estado seleccionada pueda resultar ser subóptima a medida que la aplicación crece hasta tal punto que la solución tenga que cambiar incluso si la aplicación ya se ha puesto en uso en producción.