Caching images for faster loading

[Voltaire]

Hi, I have 2 pages like parent and child, the parent page contains a list with images, these images are being retrieved from a rest service, still when this page loads it loads all the images, when I click on on list item I move to the child page and there I have to show the same image but in its actual size, so the picture will load another time , knowing that it did load before in the parent page.
Is there any way to speed up the child page since the image or picture already loaded in the parent page ?
Thanks in advance

[Bruce Stuart]

Save the image on the parent page on click to a local or memory storage variable with global visibly ( probably preferred is the memory variable ) ... And use the memvar to display on the child page ...???

[Voltaire]

Thanks Bruce for your reply, still I did not figure out your point, please can you provide more detailed info or example please ..

[Serhii Kulibaba]

Hello,

Save image to local variable as base64 string:
http://stackoverflow.com/questions/93...

and show it where you need.

[Voltaire]

i will test it and get back to you, thanks a lot

[Voltaire]

How can I read the url of the image in the grid is it :
Apperyio('img1').asset() ?

[Voltaire]

I mean how can I retrieve the image content from an appery image element to export it to a base64 string local storage or variable ?

[Serhii Kulibaba]

Use
Apperyio("img1").attr("src")
to get related file's path.

Add full path before: window.location.href.

You should get Image path like:

http://appery.io/app/view/03052fdf-2c...

[Voltaire]

Thanks for your reply, I got it , still am wondering when images load in the list , when I click on the list item to move the child page how can I use the same image which it was already loaded in the list since I will be showing the same image but in full size, like browser caching or any other alternative ?!! why to load the same image twice once in the parent page ( the images in the list) and the other time when moving the child page. when I test the application in iphone it is caching the images in the list, when using the application in android it is loading the images in the list every time when launching the application how can tell the application to cache images in the application browser cache folder or ...
Hope I did clarify my point.

[Yurii Orishchuk]

Hello Voltaire,

Image should be cached in case If:
1 you use the same image url (you can check "src" attribute in image component via browser debugger).
2 there is enough system resources(free memory for the app).

So please:

1. make sure you use the same url for images.

2. specify how did you know about "same image loads every time you see it".

   Thanks.