Flutter/Dart/Firebase - Reduce unnecessary data loading - firebase

I tried searching my specific problem but I could not find any suitable solution.
I would like to thank everybody in advance for your help.
I am currently developing an iOS app.
The App represents a user profile which can be updated by the user.
Everything from the authentication, registration and the possibility to update your user data works fine with the help of Firebase. Now I would like to optimize some code.
So the application has 2 Screens, HomeScreen and EditScreen.
(Besides the Screens needed for registration and login).
To keep my question short:
How can I reduce the amount of data which is loaded from firebase?
Example:
1. User is on the HomeScreen, to build the view his image loads from Firebase Storage
2. He wants to edit his Image and therefore switches to the Editscreen, where his image will be loaded again
3. After changing his image, the new image will be uploaded to Firebase Storage and he can see his new image on the Editscreen
4. If he now switches back to the HomeScreen his new image will be loaded again from Firebase
Is there a good way to reduce the amount of loading?
Like caching the image between step 1 and 2?
As there is always a little delay in displaying his image.
Thanks!
Sadly I am not allowed to share any code.

You can check out the flutter_advanced_networkimage package. It will cache your photo upon load. For everything else, you should just move your profile object (or whatever it is that calls for the firebase user's information) above those routes and pass it down through your widget tree through arguments or state management.

Related

Flutter cache and retrieve images in same widget, is it possible?

Hei!
I have a quiz app that shows a list of active games. This list also shows the opponents profile image. The list is a stream from firestore.
Everytime the user changes to another screen and back to the gamelist the images are downloaded again..this uses alot of network traffic.
I cant put the images in cache when the app starts as i dont know what games the player have, and they are changing. Is there a way to get the image from url , put it in cache, and IF its in cache , use that image..in the same widget?
I believe cached_network_image package is what you need.

Firebase Storage Flutter Displaying images takes too long to load

I'm creating sort of a tutorial application and have to display images from firebase storage with a step-by-step tutorial. Currently I'm using the .getDownloadUrl function and am displaying the images using Cached Network Images(External library) with the URL. The images are replaced when the step is completed and it takes at least 2-3 seconds to load an image and can get quite irritating for a user. Also, to minimize latency I shifted the Cloud Storage location nearby to where a user would be, this improved the speed slightly. Is there a better way to display images, apart from storing the links on Cloud Firestore or saving all the URLs in one list at the start.
The most common approach is to compress/resize (or both) your images. By doing this you have a few options:
1. You can display the thumbnail by default and only load the full image (or load it in the background) when the user requests it (eg. they click on details about the tutorial)
2. Load a different version of the image depending on the screen size (you don't need to display an image meant for desktop on a mobile device)
3. Replace the old image with the compressed one. Depending on what the content is, you probably don't need images larger than 200kb, and that's being generous.
You could also consider storing your images using a next gen format, such as WebP as it is considered one of the most efficient image types. But, it's not yet supported on all devices, so you'd want to include a fallback type.
You said you're caching the images which is a good step to reduce load times. You also said you shifted the storage location to be closer to the users. You could also try to find a CDN that is even closer to your user's locations (probably diminishing returns).
You seem to be against storing the downloadUrls in your database. This would help as all you'd have to do is load the image, instead of ping the bucket for the url and then load it.
Another potential solution for your use case could be to download the images for this tutorial, as well as the next one so when the user clicks next the images are already downloaded.
Unfortunately there isn't a lot else you can do. There's a lot of data packed into an image and it takes some time to load and render it

LinkedIn Profile Image missing on Authentication from App

I use REST API to share articles/posts on LinkedIn Timeline and Company pages. To do so, I authorize my LI profile with the APP for accessing the profile info. As a result, could view the profile/image of a user in the APP. Everything worked fine until, for some time now, aren't able to view the user profile image from the APP. Now, it looks like:
Previous image URL starts with(accessible): https://media.licdn.com/mpr/mprx/0_
Current image URL starts with(could not access): https://media.licdn.com/dms/image/
On accessing the image in the browser,
Help me understand what has changed with LI. Thanks.
Are you injecting the URL in same way that's escaping it? The URL recently changed and has some characters that templating engines such as Handlebars will mistakenly escape.
If you inject the URL without escaping it, it should work just fine.
Check out this documentation. https://developer.linkedin.com/docs/ref/v2/media-migration,
The problem which I was facing was the image loaded sometimes, but after some days it would give above error.
The new id will be dynamic and can change from time to time. We recommend retrieving at least once every 60 days to update your media-typed URN.
In order to fix this, I save the image, the moment it is received on to personal storage(AWS S3).

Best way to present alternate view to user

In my Apple Watch app, I need to have a way to be able to notify the user that they must first set something from within the iPhone version of my app before they can use the Watch App. Obviously, I need to do to this through a few labels and images, however the layout of these is different to the layout of the main views in my app.
How can I present the user with a different view based on the status of the iPhone app, that they cannot see unless required? The way I would do something similar in a normal app would be to just push to a different view controller, but obviously this is not possible in a watch app.
Any ideas?
You could always present a modal interface controller. Alternatively, you could create a separate group in your root controller's view and show/hide that as necessary.
To check the status of the iPhone app, the easiest solution would likely be to use a shared NSUserDefaults suite between the iPhone app and the Watch app. Set a value to true/YES when your criteria has been met and check that value in the Watch app.

Web server instances?

Very newbie question, please forgive me:
I'm creating an asp.net website. I assume that when multiple people request the page each person gets a new instance of the site. However, if the site uses a .jpg image on the server and manipulates the image, does each person get an instance of the image also, or do they share the image somehow? I think I know, and that this is probably a dumb question, but I wanted to ask.
As an example: A user logs into the site, and adds times to a schedule. Depending on the schedule, a blue line is drawn on an image (grid.jpg), which depicts a daily timeline. The image is then saved as newgrid.jpg and displayed to the user. Is there a way for each user to get an instance of the image that only they can see?
A great way to generate dynamic images in ASP.NET is by using a Handler. The answer over here offers a good, simple example. In this scenario, the generated image never touches the local file system, it's just generated in memory, and returned to the client.
Well, usually the site is always the same for all users, but there are sessions created for each user with specific settings that you can set. So yes, all people will by default see the same changes (and the same content).

Resources