My SSE script check every second if there is new data and if so push it to my frontend.

In the code i have pasted here i have simplified the idea. On my localhost it will count to 10 in 10 seconds, then stop the php script and the javascript will connect again and start the process over. <- This is what i want to happen.

On live it will do nothing for 10 second until the script die();. Then it will show the count from 1 - 10 all at once. Then reconnect and start over.

Hosting company say it should be fine with SSE and I have also tried different kind of headers, but it makes no differens.

How to fix it or at least know the course of this?

Javascript:

var chat_sse = new EventSource("chat_sse.php", {withCredentials: true});

chat_sse.addEventListener('sse', sse_chat_toaster);
function sse_chat_toaster(event) {
   var data = event.data;
   var myDiv = document.createElement("div");
   myDiv.id = 'div_id';            
   myDiv.innerHTML = data;
   document.body.appendChild(myDiv);
};

PHP script:

<?php   
   header('Content-Type: text/event-stream');
   header('Cache-Control: no-cache');

   // header('Cache-Control: no-store, no-cache, must-revalidate');
   // header('Cache-Control: post-check=0, pre-check=0', FALSE);
   // header('Pragma: no-cache');

   // header('Accept-Encoding: gzip, deflate');
   // header('Content-Encoding: gzip');

   function chat_changes($number) {
      echo "event: sse\n";
      echo "id: chat_toaster" . PHP_EOL;
      echo "data: $number\n";
      echo PHP_EOL;   
   }

   $startedAt = time();
   $sleep = 1; // Run the loop interval in seconds
   $reset = 10; // How long before closing the connection

   $number = 1;
   
   do {
      if ((time() - $startedAt) > $reset) { die(); }

      //Check database for changes and run function
      chat_changes($number);
      $number++; //for test purpose
   
      ob_flush();
      flush();

      sleep($sleep);

   } while(true);
?>