EsotericSoftware / spine-runtimes

2D skeletal animation runtimes for Spine.
http://esotericsoftware.com/
Other
4.41k stars 2.91k forks source link

[ts] support running spine-ts in a webworker #1758

Closed MikalDev closed 4 years ago

MikalDev commented 4 years ago

Support spine-ts running in a webworker (Construct 3 renders to offline canvas in a web worker to reduce FPS jank from DOM.)

Some example changes needed:

MikalDev commented 4 years ago

For HTMLImage, can probably use ImageBitmap instead. So would fetch to blob and then create ImageBitmap to store in rawassets.

Probably change HTMLImage to imageBitmap also?

Example for fetch -> imageBitmap (ignore document, etc. this is from https://jsfiddle.net/greggman/kzqxs1wv/ )

const ctx = document.querySelector('canvas').getContext('2d');

const url = 'https://i.imgur.com/ZKMnXce.png';
const options = {mode: 'cors'};

fetch(url, options).then(function(response) {
  if (!response.ok) {
    throw response;
  }
  return response.blob();
}).then(function(blob) {
  return createImageBitmap(blob, {
    premultiplyAlpha: 'none',
    colorSpaceConversion: 'none',
  });
}).then(function(bitmap) {
  // can pass bitmap to texImage2D but just to be short
  // here's using it with canvas 2d
  ctx.drawImage(bitmap, 0, 0, 300, 150);
});
MikalDev commented 4 years ago

Found a nice additional chunk of work possibly required:

Change Texture.ts and GLTexture.ts to also support ImageBitMap, not only ImageElement.

badlogic commented 4 years ago

The corresponding PR has been merged. Cheers!