Jan 15 2025

Auto saving for your App

If you users are typing a blog in your app. You don’t want to make an update request every time a new word popup in. That's simply overload your server. Instead you use creative way to do this. Wait for a few second when the user stop typing, then make update request.

This works great because probably when the user stop typing for 3 seconds either they thinking what to say next or they just finish their writing. That’s where you need to make the update request.

let timer;
const autoSave = (text) => {
  clearTimeout(timer);
  timer = setTimeout(() => {
    console.log('Saved:', text);
  }, 3000);
};

// On input change
document.getElementById('blogInput').addEventListener('input', (e) => {
  autoSave(e.target.value);
});

If you don't know what the code is doing, it's like setting a new timer whenever a new words comes in. So If I type A then B. It will set timer for 3 second for A, and before 3 second ends If I type another word (B) it will reset the time to wait another 3 second. This makes it easy to let the user finish writing. If anything didn't came for the next 3 seconds becuase the user is thinking what to say next or they finish their writing you will make an update request. This way you won't over loading your server for auto saving and provide a great user experince.