Html / Js实时更新页面

Question

I am programming the website for my church hockey league, and I am trying to make a page with live updates. I am currently trying a setInterval() to signal php to update the time.txt which the live page can draw the time from. So the update.html has the time on it, this page sends the time to a php doc with a get function which writes the time to time.txt, then live.html gets the time every 5 secs with a setInterval(). In that 5 secs live.html keeps its own time, but needs to check every 5 for pauses or time changes.

The problem is this: the server cant handle updating time.txt every 2.5 seconds so I need a simpler method that doesn't require me to update time.txt every 2.5, but live.html still can get the time, pauses, and time changes.

Any help please.

Here is update.html

$('#play').click(function(){
    if(pause == true){
        $('#play').attr('src',"mup/pause.jpg");
        $.get("mup/postt.php", {text: "11"});
        pause = false;
    } else {
        $('#play').attr('src',"mup/play.jpg");
        $.get("mup/postt.php", {text: "09"});
        pause = true;
    }
});
function updatet(){
    if(sec < 10){
        if(min < 10){
            var clientmsg = "0" + min + ":0" + sec;
        } else {
            var clientmsg = min + ":0" + sec;
        }
    } else {
        if(min < 10){
            var clientmsg = "0" + min + ":" + sec;
        } else {
            var clientmsg = min + ":" + sec;
        }
    } 
    $.get("mup/postt.php", {text: clientmsg});
}
setInterval (timer, 1000);
setInterval (updatet, 3000);

all the variables are defined at the beginning of the doc.

here is live.html

function timer() {
    if(stop == true){
        $("#time").html("<h5>Game Stopped</h5>"); 
    } else {
        sec = sec-1;
        if(sec <= -1){
            sec = 59;
            min = min-1;
            if(min <= -1){
                sec=0;
                min=0;
            }
        }
        $("#time").html("\<h2\>"+min+":"+sec+"\</h2\>");
    }
}
loadLog() {
    $.ajax({
        url: "mup/time.txt",
        cache: false,
        success: function(html){
            var min = html.charAt(0).concat(html.charAt(1));
            var sec = html.charAt(3).concat(html.charAt(4));
            var time = min + ":" + sec;
            if(time == timel){
                stop = true;
            } else {
                stop = false;
            }
            timel = time;
        },
    });
}
setInterval (loadLog, 5000);
setInterval (timer, 1000); 

and at the beginning of the doc all variable were defined with timel and time being different. Post.php just puts the sent stuff onto the doc, so time.txt would look like "06:08" or whatever.aa