Горячая перезагрузка

Когда вы работаете над сложным проектом, может быть раздражающим каждый раз выполнять полное обновление страницы после внесения изменений в сценарий. Особенно если вам требуется много времени, чтобы добраться до точки, где вы тестируете свой код. Вот тут и приходит на помощь горячая замена кода.

Как использовать горячую замену

Горячая замена включается для каждого сценария отдельно, и чтобы ее включить, все, что вам нужно сделать, это реализовать метод swap() в вашем сценарии.

MyScript.prototype.swap = function(old) {
   // восстановить состояние здесь
};

Когда скрипт с функцией swap изменяется в редакторе кода, все запущенные приложения перезагружают скрипт и добавляют его в реестр скриптов. Затем он создает совершенно новые экземпляры скрипта для замены старых, вызывая метод swap во время этого процесса для каждого экземпляра. Метод initialize скрипта снова не вызывается. Вместо этого старый экземпляр скрипта передается в метод swap, и на разработчике лежит ответственность за то, чтобы состояние старого скрипта было скопировано в новый. Объявленные атрибуты скрипта автоматически копируются в новый экземпляр скрипта. Также важно удалить все слушатели событий из старого экземпляра и повторно присоединить их к новому.

Например:

var Rotator = pc.createScript('rotator');

Rotator.attributes.add('xSpeed', { type: 'number', default: 10 });

Rotator.prototype.initialize = function () {
    // слушаем событие enable и вызываем метод
    this.on('enable', this._onEnable);

    this.ySpeed = 0;
};

Rotator.prototype.swap = function (old) {
    // xSpeed является атрибутом и автоматически копируется

    // копируем свойство ySpeed из старого экземпляра скрипта в новый
    this.ySpeed = old.ySpeed;

    // удаляем старый обработчик событий
    old.off('enable', old._onEnable);
    // добавляем новый обработчик событий
    this.on('enable', this._onEnable);
};

Rotator.prototype._onEnable = function () {
    // при включении случайным образом меняем скорость
    this.ySpeed = pc.math.random(0, 10);
}

Rotator.prototype.update = function (dt) {
    this.entity.rotate(this.xSpeed * dt, this.ySpeed * dt, 0);
};

Попробуйте изменить логику внутри метода update и сохраните код. Запущенное приложение автоматически заменит экземпляры скрипта rotator на новые, и ваше приложение будет продолжать работать с новой логикой.

Метод swap вызывается независимо от состояния выполнения экземпляра скрипта, поэтому, если он был отключен из-за ошибки, его можно снова включить в методе swap.