Autosave triggering in a text editor application

Question

I need to implement an auto-save function in a text editor web-application to manage automatic save when the user is typing. I don't have specific knowledge about this kind of technology so I wonder how it is handled in a modern web-based text editor, and specially, when the save function is triggered:

• Is it triggered by the keyboard event itself or by a periodic scan (every 5 seconds for instance) that checks for previous keyboard events?
• Does it have to be triggered when the user is not typing (after 3 seconds of inactivity for instance) to reduce network traffic?

Any suggestions?

Thanks

Answer 1

For instance, here is described autosave in Wordpress. My opinion is that depends on type of application. The best way to find the best solution is, I guess, that way that you would like to see if you visit some site.

So, if you put somewhere "Save" button, then I think that you really don't need to trigger it every few seconds, but every few minutes (like Wordpress do).

Since you will listen to events by client-side language (JavaScript probably), you don't need to worry much about performance - just listen every 10 seconds if you want and check if requirements are met for autosaving. If they are, you save it in some database with some AJAX magic.

If I were you (or, if I am The User of your site), I would like to start listening to events on first keyUp. When I entered first letter, then, JS would store in DB via AJAX every 1 min OR every 500-1000 characters entered, whatever is first met. I guess it would be great to take in account that someone types faster, someone slower. That's why I would check both number of chars entered as well as time.

That's my opinion. ( eventually sorry for grammar, free for editing :D )

EDIT: Also, if site is yours and you expect some big traffic and a lot of users, you can dynamically see how system works and accordingly set your variables (longer/shorter time/chars)

Answer 2

I think there is no "correct answer". it depends on how you expect your application works.

If you want to keep the data on server always correspond to the text on the front end, you should bind your saving function to keyboard event. However, it's obviously inefficient, bandwidth consuming, and unnecessary in normal situation.

If data consistency is not so important for you, checking text and saving it (if text is updated) after a fixed period is a proper way.

Answer 3

I was working on a similar tool for a blogging website. It turned out that it required more calculated saving points, rather than just:

• every x seconds
• after x seconds of inactivity

In addition to the above I also added:

• when clicked out of the text box
• before closing the page
• keeping track of the save operations and make sure they don't conflict or save too many times
• deactivating the autosave when no typing in the text box

In our case it was a web application and I used javascript and it was crucial to make sure it was fast and reliable.

You can find my solution at http://www.omidmufeed.com/autosaving-text-editor-with-javascript/

I hope this helps someone.