The Karma Project: Code Less, Teach More

August 4, 2009

Karma Graphics Engine

Filed under: News — subzero @ 2:17 pm

Hi there

During last days I have been working on the Karma plugin (jquery.karma.js).

There’re a lot of questions of how to develop it, let’s start:

About the Canvas and layer support
There’re two options:

  1. Multiple canvases
  2. Each canvas as a single layer, each layer containing one single object (image, shape,…)

    • Pros:
    • Less cpu consumption than option 2.

    • Cons:
    • More memory consumption than option 2. Bemasc has noticed us about this: full-screen Browse resolution = 1200 x 900px. Canvas is 32 bits RGBA (4bytes). Then 1200 x 900 x 4 = 4.11 Mb per full-screen canvas. So imagine what is going to happen with 10 circles = 10 layers = 10 canvas.
      Also Bemasc has suggested to use scaling to reduce the size of the canvases.

  3. One single canvas
  4. All the objects will be rendered here, thus it’s necessary to have a “Objects tree” and render all the tree from time to time. This is the approach that uses Ilmari Heikkinen with Cake-js.

    • Pros:
    • Less memory consumption than option 1.

    • Cons:
    • More cpu consumption than option 1. Since it’s necessary to render all the tree.

To benchmark:
what is rendered faster on the XO: a full-screen size canvas or a medium-screen (full-screen/2) size canvas with x2 scaling?

Although the answer, I think the best option is number 2, since regardless of the size of the canvas it’ll come a moment when Karma will be devouring the XO (or any machine) memory :(

About the Karma Objects
I’m talking about how to deal with Objects, we need to store what we draw, so we can use them on the future. Here’s a UML design about the actual Karma Objects, I have to say it’s alpha version and there are some JS features that I haven’t been able to put on the UML.

Karma_Graphics_Core

any suggestions?

Blog at WordPress.com.