Images take too long to load on the Lesson Page. This is because images load every time the user visits that page, instead of loading images once and saving a path to the locally saved image for future use. For more context, take a look at client/pages/LessonHome.
Some solutions
We can use Redux to save the URI path to image and refer to it when we need to display images on the Lesson Page and Edit Vocab Item Drawer.
When we need to load in images, we can load them in concurrently instead of one after another. Promise.all could be used for this.
Getting started
Think about which solution you want to implement.
Update the logic in client/pages/LessonHome to load images only when needed.
Extension of this issue
Once we figure out how to load images only when needed, we can apply this to the audio recordings. Take a look at getAudio() in client/components/LanguageHome. We should only get audio files from the API if they don't already exist on the client-side.
What is the problem?
Images take too long to load on the Lesson Page. This is because images load every time the user visits that page, instead of loading images once and saving a path to the locally saved image for future use. For more context, take a look at
client/pages/LessonHome.Some solutions
Getting started
client/pages/LessonHometo load images only when needed.Resources
Extension of this issue Once we figure out how to load images only when needed, we can apply this to the audio recordings. Take a look at
getAudio()inclient/components/LanguageHome. We should only get audio files from the API if they don't already exist on the client-side.