I'm new to frontend development and have a question about populating state when using Data Transfer Objects (DTOs). Is it better to fetch parts of the state dynamically as users navigate through the application, or should I make a single call to load everything upfront when they first visit the site? Additionally, if DTOs only include the necessary data, why not send the entire object or a DTO that resembles the object structure? This way, the state remains consistent with the database, which serves as the true source of truth, and I wouldn't have to make extra API calls for any missing details later on. Thanks for any advice!
3 Answers
Not a dumb question at all! Generally, you want to fetch data based on what your UI needs at the moment. It’s more efficient to load only what’s necessary rather than everything upfront. DTOs are designed to reflect what the UI requires, not just to mirror the database format.
It's usually best to fetch the data required for the current page when the user is on it. If they switch to a different page, then you can make another API call for that new data.
You nailed it with the point about DTOs. Instead of thinking of them as a lighter version of the database, consider them as tools that define what your screen needs. Once you shift that mindset, everything about managing state becomes clearer!
True, but the approach may vary based on the type of site you’re creating. Some setups might require loading more data initially.