Лучший подход для автоматического сохранения на смену

Question

Я хочу удалить кнопку «Сохранить» и автоматически сохранить изменения в реальном времени.

Способ, которым я знаю, это может быть сделано с помощью функции OnChange.

С учетом того, что веб-приложение будет использоваться довольно многими людьми, количество запросов на сервер, скорее всего, достигнет подавляющего уровня за очень короткий промежуток времени.

Каков наилучший подход к автосохранению без подавления или отправки большого количества запросов на сервер?

Есть два типа редактируемых полей:

1- Простые поля, которые будут иметь небольшое количество букв/слов.

2- Текстовые области для большого количества копий.

Answer 1

Это некодовый ответ на ваш вопрос.

Нет никакого хорошего способа сделать это. Вы можете делать обновления на основе X количества слов, или вы можете сделать его каждый символ или даже каждую секунду. Проблема в том, что это тонны соединений.

Это ресурс и пропускная способность, требующие использования интернет-соединения каждый раз, когда вы хотите сохранить. Тогда у вас возникла проблема с тем, что вы хотите отправить в базу данных?

Как вы можете проверить, что у базы данных уже есть? Вы просто перепродаете все это?

Это все вопросы, на которые вы должны ответить. Но по существу это то же самое, что и сейчас ... кроме того, что у вас есть какой-то код (как я упоминал изменение персонажа, смена слова, изменение времени), а затем нажимает либо весь текст/поле. или просто то, что у него нет в базе данных.

Таким образом, нет хорошего способа сделать это. Если бы мне пришлось это сделать, я бы сохранил информацию локально. Затем давайте скажем один раз каждые 30 секунд, обновляем его и отправляем только измененные символы в базу данных.

Answer 2

Я бы предложил сделать автосохранение на событии onFocusout вместо onChange. Таким образом, он сократит запросы сервера, когда входы потеряют фокус. Добавьте класс в поля ввода, такие как class="autosave", а затем создайте прослушиватель фокуса.

$('.autosave').focusout(function(){ 
    autoSave(); 
}); 

Вот скрипка: https://jsfiddle.net/fcLuw5p9/

Answer 3

Лично я буду делать это на дребезге скажет полсекунды до секунды. Если пользователь перестает печатать в течение определенного периода времени, действие сохраняется. Это также довольно просто:

var debounce = null; 
$(document).ready(function() { 
    $('.field').keydown(function() { 
     clearTimeout(debounce); 
     debounce = setTimeout(function(){ 
      // SAVE 
     }, 500); 
    }); 
});