Subj : Another Frame.js question
To   : All
From : Kirkman
Date : Wed Jun 10 2015 03:59 pm

>When I .load() a new ANS or BIN file into a frame, does Frame.js just replace
>all data and redraw every character in the entire frame? Or does it check the
>new data against the old data to see if there are characters it can skip
>repainting?

Okay, after some testing, I am pretty sure that frame.load() will require every character in the frame to be redrawn.

I cooked up my own routine to work around this. I set up a frame that serves as a temporary holder. When I'm updating all the tile frames, I no longer .load() the data straight into each tile frame. Instead, I load the tile graphic into the holder frame. Then I iterate over the holder frame and compare each character with the corresponding character in the target tile frame. If they are different, then I .setData() on that character in the tile frame. Once all this is finished, .cycle() the entire screen.

I wrote some debug code to measure how long each screen redraw was taking. Before my optimizations, the average screen refresh was about 0.67 seconds. After the optimizations, they are down to 0.23 seconds. So it has made a pretty big difference.

Here's the code if anyone cares:

// Get the name of this tile type's BIN file
var tileFile = this._map[mY][mX].getFile();
// empty the tileHolder
this._tileHolder.invalidate();
// Load new tile graphic into tile holder
this._tileHolder.load(js.exec_dir   '/tiles/'   tileFile, this._mapTileW, this._mapTileH);
// Iterate over all characters in this frame
for (var a=0; a<this._mapTileW; a  ) {
	for (var b=0; b<this._mapTileH; b  ) {
		var newChar = this._tileHolder.getData(a,b);
		var oldChar = this._tiles[x][y].getData(a,b);
		if ( newChar.attr !== oldChar.attr || newChar.ch !== oldChar.ch) {
			this._tiles[x][y].clearData(a,b);
			this._tiles[x][y].setData(a,b,newChar.ch,newChar.attr);
		}
	}
}
// mark this tile for updating
this._tiles[x][y].cycle();

---
 þ Synchronet

.