Redux Moderno con Redux Toolkit

Muy bien, gracias. Hola, soy Mark Erickson, y hoy estoy muy emocionado de hablarles sobre lo nuevo en Redux Toolkit 2.0. Un par de cosas rápidas sobre mí. Soy un ingeniero senior de front-end en Replay, donde estamos construyendo un depurador de viaje en el tiempo para JavaScript. Tenemos un stand en el salón de vendedores. Por favor, pasen. Creo que todavía nos quedan algunos gatos pato amarillos, y nos encantaría contarles cuánto más fácil hace Replay la depuración. Responderé preguntas en cualquier lugar donde haya un cuadro de texto en internet. Recojo todo tipo de enlaces útiles. Soy un escritor de publicaciones de blog extremadamente largas, y soy un mantenedor de Redux y creador de Redux Toolkit. Pero la mayoría de la gente me conoce como ese tipo con el avatar de los Simpsons.

Bueno, Redux Toolkit salió en octubre de 2019. El original Redux salió en 2015, por lo que RTK ha estado disponible la mitad del tiempo que Redux ha existido, y aún así, muchas personas aún no lo conocen. Así que enviamos la versión 1.9 hace un año, y a principios de este año, comenzamos a trabajar en RTK 2.0, y teníamos varios objetivos. Uno es corregir la compatibilidad de los módulos ES Common JS, sea lo que sea que eso signifique. Otro es modernizar la salida de compilación de JS. Podemos dejar de preocuparnos por IE 11. Teníamos algunas nuevas funciones que queríamos enviar, queríamos eliminar algunas API obsoletas, y queríamos enviar versiones actualizadas del núcleo de Redux y React Redux con mejores tipos de TypeScript y packaging.

Desafortunadamente, resulta que la compatibilidad de los módulos ES Common JS es realmente difícil. He pasado gran parte de mi año golpeando mi cabeza contra la pared tratando de hacer que esto funcione, creo que encontré algunas configuraciones que son correctas. Ha sido un verdadero dolor. Terminé escribiendo una publicación de blog muy larga sobre lo difícil que ha sido esto y muchos otros mantenedores de bibliotecas han acordado y dicho, sí, sí, estamos lidiando con lo mismo. Entonces, escribí una publicación de blog sobre esto. Está en mi sitio, blog.iswordsoftware.com. También, tuve un par de conversaciones y podcasts sobre cómo lidiar con esto también.

Entonces, el plan original era simplemente enviar Redux Toolkit 2.0. Además, para el caso, habíamos convertido el núcleo de Redux a TypeScript en 2019 y nunca lo enviamos porque los tipos de la versión 4 todavía eran lo suficientemente buenos, y estábamos preocupados por los cambios disruptivos. Entonces, íbamos a enviar ambos juntos, y luego me di cuenta de que nuestros otros paquetes necesitaban estos mismos cambios. Redux Thunk, Reselect, React Redux. Todos necesitaban las mismas actualizaciones de packaging, también, y eso realmente significa versiones mayores para todo. Entonces, ¿qué está cambiando realmente? Tenemos algunos cambios disruptivos en RTK 2.0. Esperemos que sean relativamente menores. Hemos eliminado una sintaxis de objeto que se usaba en Create Slice y Create Reducer. Hay una sintaxis de devolución de llamada del constructor que proporciona una mejor type safety, y realmente es la misma cantidad de líneas de código. Incluso tenemos un mod de código para convertir eso por ti. Hemos mejorado algunas de las opciones para ConfigureStore, nuevamente, para una mejor type safety. Hay algunos campos obsoletos que finalmente eliminamos. Los tipos de Redux tenían un tipo AnyAction que era muy laxo, y lo hemos reemplazado con un tipo UnknownAction. En términos del proceso de compilación, hemos dejado de enviar artefactos de compilación UMD. No puedo encontrar ninguna razón para mantenerlos. Si crees que todavía los necesitamos, y tienes un caso de uso para ello, por favor házmelo saber.

Hemos modernizado la salida de compilación para apuntar a los navegadores modernos. Así que, ya sabes, la última y mejor sintaxis de JavaScript significa tamaños de paquete más pequeños. Si necesitas un transpilador para, ya sabes, la compatibilidad hacia atrás, por favor, apunta a eso tú mismo. E incluso hemos extraído los códigos de error para reducir el tamaño del paquete también. Parece que hemos perdido la pantalla de nuevo. ¡Divertido!

Vale. Tenemos algunas características nuevas. Hay una API de Slices combinadas que se utiliza para inyectar dinámicamente los reductores. Redux nunca tuvo nada incorporado para eso antes, así que esperamos que esto ayude. Hemos añadido la capacidad de definir selectores dentro de create slice. Configure store hace algunas agrupaciones de actualizaciones de Redux por defecto. Tenemos algunas comprobaciones en modo de desarrollo en Reselect, algo similar conceptualmente a, ya sabes, modo estricto, ejecutando tus efectos dos veces en React que te avisará si tus selectores no están bien memorizados. Redux toolkit incluye la última versión de emmer, que tiene un tamaño de paquete más pequeño y una actualización inmutable performance mucho más rápida.

Entonces, ¿dónde estamos ahora? Tenemos Redux toolkit 2.0 beta4 es la versión de prueba actual y espero que esta vez haya acertado con el packaging, creo. Nadie se ha quejado de ello todavía, pero tampoco sé cuántas personas han probado realmente la beta, así que veremos. Creemos que básicamente está completa en cuanto a características. Todavía estamos debatiendo un par de últimas opciones y cuál debería ser la sintaxis y el comportamiento exactos. Tenemos la versión 5 del núcleo de Redux en la versión 9 de React Redux también en beta.

Entonces, ¿cuándo va a salir esto? Pronto. He estado lidiando con esto todo el año. Creo que básicamente está listo. Honestamente, me encantaría lanzar esto en la primera semana de diciembre, sólo para poder disfrutar de mis vacaciones sin preocuparme de esto en absoluto. Ha estado ocupando un espacio en mi cabeza todo el año. Así que por favor, prueben RTK 2.0 beta y React Redux versión 9 beta. Por favor, denos su opinión sobre cómo va el proceso de actualización. Avísenos si algo se rompe que no se suponía que se rompiera. Y por favor, háganos saber si algunas de las nuevas características realmente le ayudan en sus aplicaciones. Hemos tenido muchas solicitudes sobre la adición de más características a la biblioteca de obtención de data de consulta RTK. En interés del tiempo, hemos decidido aplazar todas esas características pasadas RTK 2.0 para que podamos sacar las actualizaciones y la gente pueda usarlas. Y luego podemos tomarnos nuestro tiempo para asegurarnos de que cualquier actualización de la consulta RTK esté bien pensada y bien diseñada y no nos apresuremos a terminarlas. Así que es muy probable que terminemos lanzando RTK 3.0 en algún momento del próximo año que se centra sólo en las actualizaciones de consulta RTK. Así que por favor, prueben las betas y denos su opinión. Tendré estas diapositivas en mi blog en blog.isquaredsoftware.com más tarde hoy. Muchas gracias, y espero que Redux toolkit sea útil para usted.