Real time server load

Question

Using the script below I am able to visualize the cpu load, but I’m having doubts in the part of updating the value in real time, I made a small gambiarra using html to refresh the page after 50 seconds, more is not a very cool practice.

<meta http-equiv="refresh" content="50" > 

PHP

<?php  
$min_warn_level = 3; 
// Set to min load average to send alert 
$email_recipient = "[email protected]"; 
 // Set to address of alert recipient
$current_reading = @exec('uptime');
preg_match("/averages?: ([0-9\.]+),[\s]+([0-9\.]+),[\s]+([0-9\.]+)/", $current_reading, $averages); 
$uptime = explode(' up ', $current_reading); 
$uptime = explode(',', $uptime[1]); $uptime = $uptime[0].', ' . $uptime[1];
$data = "Server Load Averages $averages[1], $averages[2], $averages[3]\n";
$data .= "Server Uptime $uptime"; if ($averages[3] > $min_warn_level ) {
$subject = "Alert: Load average is over $min_warn_level"; mail($email_recipient, $subject, $data); 
} 

 echo $data; ?>

Answer 1

You can use AJAX to make your requests to this PHP file, preventing the page from being reloaded every 50 seconds.

The advantage of using AJAX is that you reduce traffic between the client and the server and therefore reduce the processing load on the server.

Instead of reloading all the content, you will only receive the response of the request, which in your case will probably be an array with the CPU load data. With the request response, you will only have to update some elements of your HTML with the updated information.

Use together with the Long Polling technique, so you will only make a new request to the server if there are changes in the response to the request.

See this link: ajax analysis.
The question is about analyzing an AJAX code, can be used as an example, you will see some analyses, it is already out of context of your question, but is indirectly linked.


Example with pure Javascript:

On your refresh page every 50 seconds, enter the following code:

<script type="text/javascript">
   o = "";
   try{ o = new XMLHttpRequest() }
   catch(e){ o = new ActiveXObject("Microsoft.XMLHTTP"); }

   function getAjax(){
        //Troque "seu_ficheiro.php" pelo seu ficheiro PHP que verifica a carga do CPU
        //Nesse exemplo, o ficheiro PHP está no mesmo directório que o HTML onde foi inserido o Javascript, se estiver em directórios diferentes, é necessário inserir o caminho correcto.
        o.open("GET","seu_ficheiro.php",true);
        o.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        o.onreadystatechange = function(){
            if(o.readyState == 4){
                //Altera somente o HTML da div que vai receber a resposta da requisição
                //No exemplo utilizamos a div com o id "resultado"
                document.getElementById("resultado").innerHTML = o.responseText;
            }
        }
        o.send(null);
    }
    //A cada 10 segundos será feito uma nova requisição ao servidor
    setTimeout("getAjax()",10000);
</script>

In your PHP file, you have an "echo" of the variable "$data", in the div "result" the contents of the variable "$data".

This is a basic example of an AJAX request, should not be used on a large scale to avoid overloading the server.

Don’t forget to remove refresh every 50 seconds, it won’t be necessary anymore.