Первый вызов drawImage для нового canvas выполняется медленно в IE9 - PullRequest
Новая
       15

Первый вызов drawImage для нового canvas выполняется медленно в IE9

1 голос
/ 16 ноября 2011

Я обнаружил странное поведение в моей функции drawBuffer, которое не могу объяснить или исправить, поэтому давайте посмотрим, может ли кто-нибудь мне помочь.

В основном эта функция рисует буферный холст из изображения, содержащего несколько изображений. В большинстве браузеров это работает как шарм и создает + заполняет холст буфера менее чем за миллисекунду. Но с IE9 я обнаружил, что в первый раз, когда я рисую в буферный холст, это занимает около 10 миллисекунд. И с этим, это действительно замедляет мое приложение, так как оно должно работать со скоростью 30 кадров в секунду.

Я доказал, что только первая ничья занимает эти огромные 10 миллисекунд. Если вы выполните мой код, вы заметите, что у меня сразу второй вызов drawImage после первого, и этот второй вызов drawImage проходит через 0 миллисекунд. 

UiElement.prototype.drawBuffer = function () {

if(!this.bufferCanvas || !this.bufferContext) {
    this.bufferCanvas = document.createElement('canvas');
    this.bufferCanvas.width = this.sprite.getWidth();
    this.bufferCanvas.height = this.sprite.getHeight();
    this.bufferContext = this.bufferCanvas.getContext('2d');
} else {
    this.bufferContext.clearRect(0, 0, this.bufferCanvas.width, this.bufferCanvas.height);
}

var image = this.sprite.getImage();
var startx = this.sprite.getStartX(this.spriteFrame);
var starty = this.sprite.getStartY(this.spriteFrame);

var width = this.sprite.getWidth();
var height = this.sprite.getHeight();

this.bufferContext.clearRect(0, 0, this.bufferCanvas.width, this.bufferCanvas.height);
this.bufferContext.drawImage(
            image,
            startx,
            starty,
            width,
            height,
            0,
            0,
            width,
            height
        );

// 2nd draw is here only for debug purposes 

this.bufferContext.drawImage(
            image,
            startx,
            starty,
            width,
            height,
            0,
            0,
            width,
            height
        );}

Итак, подведем итог: Создать холст - 0мс

1-е изображение - 10 мс (WTH?)

2nd drawImage - 0ms

Есть ли какой-нибудь способ стимулировать холст g-spot, чтобы она позволила мне быстрее нарисовать этот кулак?

1 Ответ

0 голосов
/ 04 февраля 2012

Я также столкнулся с той же проблемой.

Кажется, что IE нужно перезагрузить изображения, если они используются недостаточно часто ... Я собираюсь оставить изображения прикрепленнымиДОМ и посмотри, поможет ли это.

...