NickJames
-
Posts
3 -
Joined
-
Last visited
NickJames's Achievements
Newbie (1/14)
0
Reputation
-
Hi goldenratio, 1. Yes maybe... they do certainly seem laggy, some work better than others - it must be time I got a new laptop . The reason that I have been asking these questions is I'm looking into how possible it would be to do a graphical data display for a customer with something like PIXI JS. This has made me think some more about exactly how new does a laptop have to be for webgl ( specifically PIX JS ) to work well? So I did a quick survey around the office using a simple PIXJS demo I wrote which basically draws ~ 100k polygons and zooms in / out ( not suggesting this is a good design, but just wanted to try out a test to see what was possible) . The result was: laptops < 2 years old : 60 FPS laptops 2-3 years old : 30 FPS laptops > 3 years old ( mine!) : 4 FPS So basically my demo shows I can do what I need with PIXI JS, but potentially if the customers laptop is > 3 years old performance can really tail off. Its probably still possible on older machines, but there will be a big difference in exactly how much is possible. 2. I commented out the renderering part and I got 60 FPS. So yes, its the rendering that's taking the time. I appreciate the bigger the canvas the longer it takes to render, but it still seems slow for a blank screen. Thanks for the feedback.
-
Hi goldenratio, Thanks for your comments. Yes you are right... as you suggested I tried with a canvas renderer like so: var renderer = new PIXI.CanvasRenderer(viewWidth, viewHeight);And now I get 60 FPS with the render size at 1200 x 800 as well as 120 x 80. I am also using Firefox ( 27.0.1 ) on Ubuntu OS ( 13 ) on a 3 year old laptop. So it seems there is probably some WebGL issues due my setup... To check this another way, I've tried the same original WebGL renderer code on a new Mac book pro and both 120 x 80 and 1200 x 800 run at 60 FPS.... so the newer hardware has no issue at all. So this makes a lot more sense now, but I still have a couple more questions: - I've run lots of really impressive webGL demos on the same old laptop successfully, and with much more than 3 FPS. So I'm still not sure why I should see such low FPS when I just render a blank screen. It sounds like this just some buggy webGL for older platforms which just happens to affect the PIXI code more than the other demos? - I also see the same problem with the canvas renderer - when I increase the size of the renderer the FPS decrease. Eg. I tried 12000 x 8000 and got just 11 FPS. I'm not suggesting I ever want a renderer this large! But just curious to know why it gets slower when I'm not drawing anything?
-
Hi, I've noticed that when I increase the size of the PIXI renderer the frame rate decreases. To check this I removed everything else from my code, so all my code does is create a renderer and a stage and then render the stage in an animation loop. I've pasted the code below. With viewWidth and viewHeight set to ( 120 x 80 ) I get ~60 FPS. However, when I make this 10x larger, ie ( 1200 x 800 ), as in the example code below, then the FPS drops right down to 4 FPS. Seeing as I'm not actually doing anything like drawing different shapes I can't understand why the FPS should drop so dramatically ( or change at all). Can anyone explain why this is happening? Thanks, Nick <!DOCTYPE HTML><html><head> <title>pixi.js test</title> <style> body { margin: 0; padding: 0; background-color: #000000; }</style> <script src="pixi.js/bin/pixi.js"></script> <script src="fpsmeter.min.js"></script></head> <body> <script>var viewWidth = 1200;var viewHeight = 800;var meter = new FPSMeter();var renderer = PIXI.autoDetectRenderer(viewWidth, viewHeight);renderer.view.className = "rendererView";// add render view to DOM document.body.appendChild(renderer.view);// create an new instance of a pixi stage var stage = new PIXI.Stage(0xFFFFFF);requestAnimFrame(animate);function animate() { renderer.render(stage); meter.tick(); requestAnimFrame(animate);}</script> </body></html>