foreach shows 1 wait file then clears and shows another php

Question

I have a foreach in PHP and it shows various data of a XML, but in this XML has 5 photos and I would like the loop to show the first photo, wait about 10 seconds and then show the second photo so successively. Follow the code I have:

<?php 
$link = "rss.xml"; 
$xml = simplexml_load_file($link) -> channel; 
foreach($xml -> item as $item){
echo "<div id='foto'>";
echo "<img id=\"foto\" src=".utf8_decode($item -> linkfoto)."><br /></div>";
break;
}

Thus with the break; it shows only the first photo, wish it had a timer or something like that so that the other photos appear after 5 seconds, erasing the first photo.

Answer 1

The break; as mentioned it prevents the continuation of foreach().

An alternative is to use the sleep(), see manual. That way would be:

//...
foreach($xml -> item as $item){
echo "<div id='foto'>";
echo "<img id=\"foto\" src=".utf8_decode($item -> linkfoto)."><br /></div>";
sleep(10);
}

The value entered "inside" of the function is the time in seconds you want it to wait, but this will not erase the previous!

In that case it would run, wait 10 seconds, run again, wait 10 seconds (...) until the end of the loop.

However, PHP is processed on the server side and for this reason the client does not answer until the content is fully processed, ie there would be the interval of 10 seconds but all images would be displayed.

In order for the customer to receive an image every 10 seconds you have some changes, the "advantages" and "disadvantages" are relative and I just listed what I remember at this point:

• Use the sleep with flush() and ob_flush() before him.

  Upside: No other changes required, just add flush(); ob_flush(); before the sleep(); and it’s safer, guaranteed to always be every 10 seconds.
  
  Downside: High page load time, for SEO is bad, besides the timeout (maybe) need to be changed, which is not good, if it has processes limit in simultaneous progress this solution is the worst. In addition, this may compromise the loading of other content on the page. This also does not have the ability to delete the old image, and it is anyway necessary a Javascript to delete the previous image every 10 seconds.

• Use "AJAX" to request a new image every 10 seconds.

  Upside: Reduces load time considerably, only having to create a specific page to distribute the contents of the loop, one by one.
  
  Downside: You need to create another 'page' to provide the data and changes on the page you receive. It is less secure if there is no monitoring or time check. In this case the user can see the content before 10 seconds. In addition other services, external to yours, may use such a connection to collect data, if there is no limitation, in an easier and faster way.

• Use Javascript to display/display content every 10 seconds using CSS in display: none;.

  Upside: Requires minor changes to your code, reduces loading time considerably.
  
  Downside: Very, very, very insecure! Anyone exploring the page’s HTML (F12) can download and view the hidden content, obviously without waiting for 10 seconds.

There are other solutions, it will depend on the application of this.