Estoy creando un proyecto en el que necesito renderizar casi 2100+ opciones de selección. Pero cada vez que renderizo con la opción de selección de arranque predeterminada, renderizo demasiado lento. Es por eso que uso react-select & react-window . Sigo muchas formas de resolverlo pero no puedo.

¿Cómo puedo resolverlo?

dependencias

• reaccionar-seleccionar
• ventana de reacción
• reaccionar-bootstrap

Información

• useSelector 2100+ la tienda redux .
• Dondequiera que busco resolver este problema, encontré este ejemplo en todas partes. Aquí usan bucle para renderizar 2500 o más. Pero mis datos provienen de la tienda redux .
• Mis datos se ven como

 data = [{"title": "A", "key": "a", "code": "512"}, {"title": "B", "key": "b", "code": "513"} ..... ]

• Necesito crear una select option con title .
• Estoy usando un componente funcional para usar useSelector , por eso no puedo obtener datos fuera del componente.
• No puedo crear una zona de pruebas de código porque allí faltarán los datos.
• He seguido muchas formas de resolver esto, pero no puedo. Aquí estoy proporcionando la situación actual de mi código.

Código

 import React from 'react' import { useSelector } from 'react-redux' import Select, { createFilter } from 'react-select'; import { FixedSizeList as List } from 'react-window' const Board = () => { const icons = useSelector(state => state.icons.iconsData) return ( <> <div className="container py-5"> <div className="d-flex flex-row"> <div> <p>Select Option</p> <Select options={icons}/> </div> </div> </div> </> ) } export default Board