Solution 1 :

Here you can get nearest 10th min

let getRoundedDate = (minutes, d=new Date()) => {

  let ms = 1000 * 60 * minutes; // convert minutes to ms
  let roundedDate = new Date(Math.round(d.getTime() / ms) * ms);

  return roundedDate
}

console.log(getRoundedDate(10))

Now you can use setInterval or in recursive setTimeout

Solution 2 :

You can get the minutes of the current hour and check how many minutes there are until the next 10-minute mark and use setTimeout. Your updatePage method should also continue to use call itself with setTimeout, if you are using AJAX to refresh the page (which makes more sense than reloading).

function updatePage(){
    //update page
    setTimeout(updatePage, 10 * 60 * 1000);
}
const now = new Date;
const nextDate = new Date;
nextDate.setFullYear(now.getFullYear());
nextDate.setDate(now.getDate());
nextDate.setMonth(now.getMonth());
nextDate.setHours(now.getHours());
nextDate.setMinutes(Math.ceil(now.getMinutes()/10)*10);
setTimeout(updatePage, nextDate - now);

Solution 3 :

You were very close with the solution in your question.

A couple of things to note:

  • You don’t need setInterval(), but can use setTimeout() instead. After the page is reloaded, you will get a new timeout.
  • The callback you pass to setInterval() or setTimeout() needs to be a function and not a function call. If you include a function call, it will be executed immediately and not wait for the timeout or interval.
  • There is no need to create additional intervals to be able to correctly determine the 10 minute mark, as proposed in other answers to this question. You can correctly determine the correct time to call the reload action by doing the calculation you had in your question.
  • I’m aware that there are situations where you have too little control over the server code to be able to convert to AJAX, but if possible AJAX or websocket solutions should be preferred over reloading the page.
function reloadAfter(minutes) {
  const millisToWait = minutes * 60 * 1000;
  const millisLeft = millisToWait - (Date.now() % millisToWait);
   
  setTimeout(() => location.reload(), millisLeft);
}

addEventListener('load', () => reloadAfter(10));

Solution 4 :

Why reload the page at all? Just use AJAX to query what you need. Here’s code you could use to do your AJAX query, or reload the page… the later being a bad practice:

function onTenMin(func){
  const m = 600000;
  let i = setTimeout(()=>{
    func(i); i = setInterval(()=>{
      func(i);
    }, m);
  }, m-Date.now()%m);
}
addEventListener('load', ()=>{
  onTenMin(interval=>{ // if you want you can pass the interval here
    const dt = new Date; 
    console.log(dt.toString());
  });
}); // end load

Just pass the function you want to onTenMin.

What’s happening here?

Date.now() gives you milliseconds since January 1, 1970, 00:00:00 UTC. 600000 milliseconds is 10 minutes. % is the remainder operator, so it gives you the milliseconds remaining after division of the 600000. 600000 minus that remainder gives you how many more milliseconds until the next ten minute time. When that timeout happens it executes the function you pass to func then sets an interval which executes every 600000 milliseconds, passing the interval to func.

Solution 5 :

You can use a meta refresh instead don’t burden the engine with timers

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

10 minutes = 600 seconds, so… This would automatically refresh your page every 10 minutes exactly.


Update

Every Exact 10th Minute Of An Hour

var tick = 10*60*1000,
    tock = tick - Date.now() % tick; 
setTimeout( "location.reload()", tock );
var tick = 10 * 60 * 1000,
  tock = tick - Date.now() % tick;
setTimeout("location.reload()", tock);

//-----show something on the page----

with(new Date(tock))
document.write("Reloading in: " +
  getMinutes() + " min, " +
  getSeconds() + " sec, " +
  getMilliseconds() + " mil."
);

Problem :

I am trying to update a web-page at every tenth minute 7:40…7:50, etc. How do I do this?
Here is my code:

    <body onload="checkTime()">
    function checkTime(){
        var unixTime = Date.now() / 1000;
        var partTenMinuteTime = unixTime%600;
        var time = unixTime - partTenMinuteTime + 600;
        var difference = (time-unixTime)*10000;
        console.log(difference);
        setInterval(location.reload(),15000)
    }

This is all I have, everything else I have tried does not work. I am using location.reload();
My problem is where this function gets called and how to implement it.

Comments

Comment posted by Robby Cornelissen

On page load, get current time, calculate millis to next 10 minute interval,

Comment posted by Menai Ala Eddine – Aladdin

use

Comment posted by Menai Ala Eddine – Aladdin

@RobbyCornelissen, but

Comment posted by Robby Cornelissen

You only need one time. You’re reloading the page anyway.

Comment posted by Kyle S

@Robby I updated my code but the page just constantly keeps reloading. I tried setTimeout() and setInterval() with the same result. the 15 seconds or any number makes no difference.

Comment posted by Robby Cornelissen

Speaking about bad practices: you’ll be continuously executing the callback in your interval as fast as the JavaScript event loop can process it. And you’re not clearing the interval created in

Comment posted by Robby Cornelissen

The interval created in

Comment posted by Robby Cornelissen

You’re right about the intervals not stacking. But you still have a zero milli interval tying up the event loop for up to 10 minutes.

Comment posted by StackSlave

Still, I see your point @RobbyCornelissen. Posting to reflect, soon!

Comment posted by Robby Cornelissen

Yeah, that’s about the best you can do if you need to do this type of execution while staying on the same page. I removed my downvote.

Comment posted by Kyle S

Thanks but I am trying to update at the tenth minute not every ten minutes.

By

Leave a Reply

Your email address will not be published. Required fields are marked *