The way many sprites are rendered in Athena Crisis will render most of the image, and then cut off everything around it using CSS. This is naive, but works great for most use cases with small images that change often. However, character portraits are about 320 kb in size, and there are 11 variants of them. Rendering many characters on memory-limited devices is not good. This issue is about exploring alternative ways to render character portraits, possibly by slicing them up and rendering them with canvas and drawImage. There are some examples in the Athena Crisis codebase as well, see renderTile.
Implement a new rendering strategy that avoids rendering the same large image each time a portrait is used.
Ensure that you retain all functionality such as animating the portraits. Note that not all portraits are animated at this time, so depending on which one you are trying, it may "animate" but just swap to the same image. Try it with the Pioneer, Infantry or Sniper units.
Check out the UI Components section for examples of portrait rendering.
The way many sprites are rendered in Athena Crisis will render most of the image, and then cut off everything around it using CSS. This is naive, but works great for most use cases with small images that change often. However, character portraits are about 320 kb in size, and there are 11 variants of them. Rendering many characters on memory-limited devices is not good. This issue is about exploring alternative ways to render character portraits, possibly by slicing them up and rendering them with canvas and
drawImage. There are some examples in the Athena Crisis codebase as well, seerenderTile.Steps
Portraitcomponent.Check out the UI Components section for examples of portrait rendering.
Funding