Video and image load time in flutter and supabase

[Gourishh]

Body

I am making a social media app using flutter and supabase. I am trying to replicate yt shorts/insta reels into my app but the difference is in the content type, I could be a video, image or audio. The main problem I am facing is the load time. It takes atleast 5-10 secs to load any content which is not good for UX experience. Can anybody guide me through the best method to implement this?

I tried compression but it didn't made a big difference. I have written basic code for video_player and image.network widget. My content is stored in supabase storage.

Guidelines

• I have read and understood this category's guidelines before making this post.

[ebndev]

Hi @Hadikamali, thanks for participating in GitHub Discussions!

Please note: we’ve clarified our stance on using generative AI tools like ChatGPT within our Community via this announcement. Please review the guidelines to ensure your post meets them as failure to adhere to those rules can result in action taken by our moderator team. 

You can read our updated Code of Conduct and the announcement for more details. Thank you for helping us maintain an authentic and beneficial space for everyone.

[ebndev]

Hey @Gourishh, thanks for being a part of the GitHub Community!

Check out this previous Discussion where an answer suggests storing the images in a public URL, instead of fetching the image each time.

If you are already doing this, you could also try caching the images but it would only improve reload time and not when the user first visits the page. 😕 That might help you dig into other possible solutions though! Here's the documentation on Supabase Storage CDN.

[Gourishh]

I have found solution through compression. It's not 100% what I wanted but it is very effective so I am marking this post as answer. I used package - video_compress for compressing videos. Still finding a good one for image.

[ebndev]

Nice!