Best approach to load component data for multiple db backed select components on the same page
Hi everyone, I'm currently developing a new frontend + admin panel for an existing recipe database and I'm scratching my head at how to best resolve my issue here.
So, the database is basically structured in a way where there's a data table for the information and a separate table for translations, speak e.g.
ingredients
and ingredient_translations
containing the ingredient id and a locale. For ingredients there are also preparations and units, everything with localisation. I've created my api with server routes which allows me to CRUD the data for each individual data type but now I'm starting to struggle with the following thing.
I've created multiple dynamic select components (using Nuxt UI's SelectMenu) for the various data types (ingredients, authors, segments, courses, customers, ingredient units, etc.) and want to implement the recipe edit page now. My problem is that I can't seem to find a good way to load the data for those select components since every select component, even of the same type, will fetch its own data. When awaiting the data in the component the application becomes slow, when I fetch the data on the client with $fetch it also slows down extremely.
I split up the recipe form into multiple pages since the form would be way too complex to implement it as one, the screenshot shows the recipe's general data page, the ingredients (Zutaten) page would then hold rows of the following field groups: ingredient (db backed), quantity, ingredient unit (db backed), ingredient preparation (db backed). Users can create as many rows as they like but this will instantiate those dynamic select components for each row and create a huge problem in a matter of minutes.
Did someone encounter a similar problem or has a way of caching the data, loading the data in a different point of time to resolve this?
This is kind of a long post and I apologize but I'm really at the end of my luck and could use some help if someone has some π
Thanks!0 Replies