Re: Canvas performance

Not a GWT-specific question, but you are using canvas through GWT, so...

You're doing well by using pre-rendered images and drawing them to
your main screen. In some of my initial experiments using canvas, I
was using the canvas drawing functions (lines, arcs, etc.). I got a
large speed boost by pre-rendering the shapes into an off-screen
canvas and then copying the rendered result to the on-screen canvas
when needed. This worked for me because my shapes did not change
between frames.

I think the next thing for you to think about would be whether or not
you actually need to redraw the entire screen for every frame. If only
30%* or so of the screen is actually changing each frame, you'll see
huge framerate gains by only drawing what's changed.

* 30% is a completely arbitrary number that I thought would be safe.
There will be some threshold where it will be quicker to draw the
entire screen than to calculate which areas to redraw. You'll have to
experiment to find what works best for your case.

-Brian

On Mon, Mar 28, 2011 at 6:28 PM, Markus <admin@thandaro.com> wrote:
> Hey,
>
> I tried some tests with the canvas objekt. I create a canvas an redraw
> the canvas every ms, so I get the FPS for the drawing....
>
> If i use the drawImage method of the Context2d the performance is very
> bad. I draw currently about 160 images on a canvas 1920x1200....
> But I only get 50-60 FPS...
>
> So is the performance really so bad or do I a failure?
>
> Regards,
>
> Markus
>
> Here the code:
>
> protected final Timer mUpdater = new Timer() {
>                @Override
>                public void run() {
>
>                        double start = Duration.currentTimeMillis();
>
>                        /*
>                         * Zeichen start...
>                         */
>
>                        mContext.clearRect(0, 0, mInnerWidth, mInnerHeight);
>                        mContext.setFillStyle(mDefaultTextColor);
>
>                        int startW = 0;
>                        int startH = 0;
>
>                        while(startH < mInnerHeight) {
>
>                                startW = 0;
>
>                                while(startW < mInnerWidth) {
>                                        mContext.drawImage(ResourceHandler.BUILD_SAEGE_01, startW,
> startH);
>                                        startW+=ResourceHandler.BUILD_SAEGE_01.getWidth();
>                                }
>
>                                startH+=ResourceHandler.BUILD_SAEGE_01.getHeight();
>                        }
>
>                        /*
>                         * Zeichnen ende...
>                         */
>
>                        double t = Duration.currentTimeMillis() - start;
>                        double fps = 1000 / (t == 0 ? 1 : t);
>                        mContext.fillText("FPS: " + fps, mWidth - (mWidth * 0.2), 10);
>
>                }
>        };
>
>
> Example URL: http://thandarocom.appspot.com/game.html
>
> --
> You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
> To post to this group, send email to google-web-toolkit@googlegroups.com.
> To unsubscribe from this group, send email to google-web-toolkit+unsubscribe@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
>
>

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to google-web-toolkit+unsubscribe@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.