Search the Community

Showing results for tags 'optimization'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Found 29 results

  1. Hi, I do have a mesh with a huge amount of vertices (Meshlab say 1800000 vertices, after unifying duplicates still 304000 vertices). Its stored in an STL File. I import it as a mesh as shown in the example below It's doing well on a PC with FPS of almost 60fps. But using mobile devices I end up with 10-20 FPS. So, I am looking for an optimization solution. I read all the HowTo on your Web page. Since its only one model - instancing or cloning does not help. I thought about using LOD or Auto LOD. But trying that the framerate totally drops. See here (lines 43-45) From Unity I know that they split or slice models with lots of vertices in slices of max 16k vertices. Is there a way in BabylonJS to split huge meshes into slices of sub-meshes to improve FPS performance? Another idea is to keep the amount of vertices/triangles for the main areas of the model and decrease it for others. Do you support such a feature? What would you suggest to improve the performance while keeping the information? I know its a trade-off. Thx for your hints. See you
  2. Releasing a Phaser game

    Hey guys, I'm about to release a game made with Phaser 2.8.2 targeting Desktop browsers. I was wondering if there's anything I need to do to make sure the code runs as optimized/smooth as it can on players browser? In native world, I would simply create a "release" type build with compiler optimizations enabled. Is there such a thing? Thanks.
  3. I'm looking for ways to optimize a scene I created in the Playground. This scene is based on previous work from another thread, I just added some objects and logic to mimic a small game. It uses native CannonJS for the PFS-camera and movement of the monster models. I used the code and model from the instances demo. From line 16, you can turn on and off physics for the monsters, skeletal animations, the skybox, trees, shadows, procedural textures(grass), and whether or not the monsters should lookAt and follow the player. As well as specify the amount of trees + the range and amount of monsters. I'm only hitting around ~30 FPS with this example. Is a scene such as this too heavy for WebGL and browsers? The trees are instances, so unless I clone and merge them, I don't see what could be changed there. Maybe a smaller, compressed texture. The monster models all have skeletons and animations, so no instances or merging can be used here. Disabling physics seems to give some FPS boost, so maybe using a worker would do some good in this example. I'll give this a try, and see what effect it has on overall performance. Here's a minimized version, with most things stripped, and 50 monsters without animations.
  4. I'm getting ready for the js13k competition by refining and expanding my TypeScript Game Framework MINI.ts with the goal to let me make 2D games as fast as possible. My current plans are to work on Clean up Canvas Renderer Implement 2D WebGL renderer Implement Steering Behavior Refine basic physics Implement QuadTrees and Chunking Implement Terrain generation Implement some standard UI elements Improve the build process and get the TS code to generate JSDocs so that I can use Google's Closure compiler to get a smaller file size I'm looking for other ideas of features I might need later on or that make help speed up developer later on.
  5. Phaser optimization

    Hello, How to optimize this? 96 draws, 707 calls. 40 cards and they are drawn separately. all textures are in one atlas, all cards are on the same parent. The card object is a sprite in which the sprite in which 2 sprites for shirt and card face and 4 textures for this. Card class code on the gist: Thanks!
  6. Hi All, Likely a simple question, but can someone explain what the Mesh Selection is telling me in the Stats tab of the inspector?
  7. Hello, when I make 3D models I usually make a texture atlas to reduce number of DrawCalls. Is that the case for PIXI? Do we need to make an atlas for PIXI or maybe PIXI renderer handles multiple graphics efficiently? If not is there a good tutorial out there?
  8. I need to load a large scene, the model comes from UAV scanning generated, I hope to be able to smooth loading on most devices, including mobile phones. In my solution, I need to release objects outside the view (objects and materials are released), but I found that the BJS's own Frustum Clipping did not release the object outside the view, but I will use LOD, I will load multiple precision models, if not released, LOD will be meaningless, how can I do, I need to rewrite BJS code? I tried to use incremental load, it did not release the memory of the object, but I found in Debug Layer when moving the viewport the total vertices in the change, I do not know what reason? But the total meshes not change;
  9. Hello everybody, I'm doing a little game plateform for fun and for the ground management and for more speed, I wondered if was worth better not use (for optimization) : - Tilemap : But I feel that after a certain number of box it starts to slow down... (and i can use player.body.blocked.down to know il player is landing) OR - Objects that define the ground and far fewer (but i loose player.body.blocked.down to know il player is landing) And that's make -> And all mixed -> I manage this with tiled like that -> What is the best practice to design ground and manage ground collision to keep a max of fps ? thank for help and this great forum Here the
  10. Hey guys! I'm pretty new to this forum and to PIXI.js so please excuse me if I'm posting in the wrong place. I am creating a game similar to guitar hero, but for piano (basically a synthesia clone). Here is a link to my JSFiddle I have the basics setup how I want, but I am running into some performance issues. I need the game to run at a solid framerate with up to ~10,000 notes in a level (not all being displayed at the same time of course). Currently, the note graphics are created and added to the stage within a group and animated downward. When they are added, their visible property is set to false and is only set to true when the are within the view. Here is my animation loop: function animate() { gameTime = / 1000 - startTime; // CULLING loop // loop to go through all notes and see if they should currently be visible for (i = 0; i < numNotes; i++) { // if the note should be visible, make it visible if (gameTime + offset > notes[i].startTime && gameTime < notes[i].stopTime + offset) { if (notes[i].graphic.visible == false) { notes[i].graphic.visible = true; } } // if the note should not be visible, set visible to false else if (notes[i].graphic.visible == true) { notes[i].graphic.visible = false; } } // set y pos based on gameTime group.y = (ySlope * -1 * gameTime); // or set it manually // group.y += 8; renderer.render(stage); requestAnimationFrame(animate); } The frame rate is currently not where I want it to be, so I am hoping that someone can show me where I can make some optimizations. Feel free to play around with the JSFiddle. Thanks, Micah
  11. Hey everyone, I'm trying to create a warehouse viewer app. I need to display A LOT OF meshes (I'm using only deformed cubes). I tried the optimization processes I saw in the tutorials, but I'm probably missing something, because my scene is slow (5 fps).. I'm currently using instances, I saw it was normally the best idea in my case (all the mesh will stay in their position, no move, no transform, no material change). Is it the right choice ? I tried with cloned objects too but the result was worse in my case (or I was doing something wrong?).. NOTE : I'm using "scene.pick()" which is using apparently a lot of CPU (or GPU), because in the app I will use the mouse lock API (and use the screen's center as the cursor). Here is the playground : I also have a bug on the floor, the shadow-like things, I don't know what it is, if someone has an idea.. Thank you guys
  12. Hi guys, i want to add a quality control to my project so a user can change the quality of the scene to reduce lag / improve performance on low-end machines, I stumpled over the "Auto-LOD" but it doesn't quite do the trick, indices only reduced slightly & no change to vertices. Take a simple sphere made with 20 segments/subdivs, var sphere = BABYLON.Mesh.CreateSphere("sphere", 20, 2, scene); This sphere contains 5808 indices & 1035 vertices, But if i create the sphere with 10 segments instead, var sphere = BABYLON.Mesh.CreateSphere("sphere", 10, 2, scene); This sphere only contains 1728 indices & 325 vertices. Is there any way available to reduce the actual "quality" of a mesh (live) without using the LOD or Auto-LOD systems? (i need to use it on custom 3d models aswell). For the sphere as an example. I want to go from 20 -> 10 segments if quality is reduced by 50%, is this possible to do "on-the-go" or would it be better to force a reload and then load the meshes/models with the requested quality? Any ideas/input would be greately appreciated Cheers
  13. I finished something!?

    So I finally finished something, but it's still very slow especially on mobile. I'm hoping some of you help can point out why. Game is here: Code is here, all one file, with different states:
  14. Hello dear Forum, i have a Question regarding dynamic Asset Loading in Babylon.js. I was not able to find Information about this topic in the Documentation or the Forum (don´t slay me if I missed something ). So basically what I want to be able to achieve is: 1. User clicks a HTML-Button (for Example "Load Model") // Button should be outside of the Canvas if possible 2. Button calls Function with modelName as Parameter 3. Function checks if Model with modelName exists in some Kind of Library 4. If so, the Model gets Downloaded 5. Model gets rendered So, as far as i was able to find out, it is totally possible to pass Information from a HTML-Element to the Babylon Engine. But is it possible to download something at runtime (CORS is considered) that has never before been used inside the Project. The reason for this is that I want the Game to handle almost the whole "What shall i display?, Where shall i display it?, Which Components does the Object have" - Functionality dynamically without defining too much of it inside the Project. I hope I was able to give you an insight into what I want to achieve. Regards, Markus
  15. Hey Folks, I've started using the excellent Rotates Isometric plugin but quickly ran into an issue when trying to create a bigger world. The default examples (like this one) run great with a small grid but when I try to go above 50x50, framerate starts to drop off FAST. Since I want to create a good-sized scrolling world, I was wondering if there is any good solution to this? Here's the options I see: * Batch the ground tiles into one big image. BUT this still limits how many detail or dynamic sprites (trees, rocks, NPCs, etc.) I can have on top, and I can't batch those since it would mess up the sorting * Create only enough sprites to fill the screen and implement some sort of scrolling (i.e. as player moves right tiles on the left that go off-screen get moved onto right and changed to the new image that should be there) As far as I can tell tell, solution 2) is the better method, but it would still be limited to static sprites. Plus, the implementation would be a pain (unless there is a ready-made scrolling/pooling implementation somewhere?) Thanks for any feedback and thoughts!
  16. Hi folks! New to the forum, but looking forward to share and consume knowledge and info with you all! I have a question that has bothered me since I started writing shader based gl code, how to optimize the rendering pipeline in the best way. I've read a ton of GL books and gone through countless tutorials on the subject, but each one just touch on the basics on how to get things working. Not on how to actually set up a optimized and clean rendering pipeline for a working graphics engine. The parts that stand out in my case is how to handle textures and shader programs in a good way, and what standard I should go after when it comes to handling of these precious resources. The basic question is, how many times in a single render cycle should I be allowed to change 1: Shader program, 2: Texture. To take a real life example on a game that I'm working on at the moment, I first do my general rendering that uses 2 textures, one for sprites and one for font sprite, the textures I use is quite big, 2048^2 as I'm working on a HD version of a game. Here I'm pondering on perhaps using a 4096^2 texture as well, looks like most devices can handle these sizes, and I can cram in pretty much all the gfx assets I need onto one of those babies. But is it good practice? Do I win anything when it comes to rendering speeds, and is the win big enough to handle large complex sprite maps like that? Or can I have 50-100 different texture images that I can pick from during a single cycle? The second parameter is the Shader program, same goes here really, I have a shader for general sprite handling, and a shader for the font renderer, but I also have a special shader for post fx that I use for a FBO that will be the final scene in the pipeline. I think there will be more programs involved here, and I might need to switch between them during a rendering cycle. Is it to much to switch shader programs 10-20 times in a single cycle, or is it within acceptable limits? The engine setup that I have today works quite well and I can't really find any problems with rendering speeds, but I want to push this a bit, I'm working on a particle engine that I want to use, and that will bring an additional shader into the equation, and probably additional sprite maps that needs loading. What I really want to know is if there's some kind of standard to comply with, would be great to have some frames to work within when it comes to the rendering pipeline. Looking forward to hear your input on these questions!
  17. Hi everyone ! Remember "Macromedia Flash" ? It is a dead technology that used to allow total freedom at the expense of HUGE computation. It has been abandoned... As much as I loved the possibilities at the time, fact is, running a somewhat simple game within your browser would require all the power and memory your computer could give, no matter how powerful, and in my humble opinion, I'm happy it has been discontinued, I HATED the way my -powerful then- MacbookPro would start to spin its fans at full speed, full noise, full heat. Now I'm a beginner in trying to master BABYLON.JS, and in my first experiments, I notice the fans of my brand new super-spec MacbookPro behave sorta the same way, soon after loading my scene, the fans start to turn fast and loud, Babylon.js pushes the computer to high temperature. And I don't want my beloved Babylon.js framework to end up like Flash !!! lol Checking demos on the official babylon.js site, I notice some of them render well without making the fans turn on (ex : but others demand too much (ex : ###So, trying to make it short, what is the good way to go in order to keep the CPU usage low ? (like in the Sponza demo)### -Textures: -What is the recommended size ? -How much CPU does it take to use bump, specular, etc... on top of the Diffuse one ? -Lights: -Is there dynamic lighting on an optimized scene ? Of which kind ? how many ? How to bake static lighting ? -Programming: -Is there a way to writing javascript code that would be better than another ? -example: Is calling "scene.getMeshByName("")" more demanding than just "mesh" ? -how does the "scene.registerBeforeRender()"should be handled ? -example: Is it a problem if calling "for (var i=0;i<scene.meshes.length;i++)" or "for (i=0;i<scene.textures.length;i++)" multiple times rather than just one time ? -Is there a way to handle/optimize memory ? Well this is just a few questions this topic can bring up ... I hope people participate with questions and answers, we can decipher the magic behind perfect programming together !
  18. Hi, Is there a limitation on the pixel size that you can use for the sprites? I'm asking this because, I've created an isometric map that loads 2 different sprite atlas depending on if you are on a desktop or mobile device. The mobile sprites have a size of 256*256px and the desktop ones have a size of 512*512px. My problem is that the desktop version has a low frame rate (1-5 fps) while on the mobile version it has a solid frame rate (60fps). If I change the game logic to use the mobile map on desktop the frame rate goes to 60fps. That's why I need to know if there is a limitation with the sprites size. Any help would be appreciated
  19. I have to recreate a Box2D game I made in Flash in HTML5. Unless I can figure out a way to pull the Box2D info from the Flash game (I did not hand code the objects, I used Box2d Flash Alchemy Port + World Construction Kit), I was planning to use R.U.B.E. to recreate the world and use Phaser with the Box2D plug-in to load it in like so. I've built 2 games using Phaser without using the built in physics systems and they work fine on my iPad, but I'm concerned about mobile performance using Box2D and want to set my client's expectations appropriately. So on to my questions... Why does the Bridge demo run so much more slowly than the Conveyor Belt demo? Just wondering if there is something I should avoid. Why does this run so much better on my iPad than the Phaser demos? I'm guessing it's because it's a simplistic library, but just wanted to point it out as an example of a Box2D demo that runs smoothly on my iPad. None of the public Phaser Box2D examples have a background image. Would adding a background image and images to all of the objects further effect performance? Is there a performance hit in using the Box2D plug-in vs. using Box2D externally like this Phaser game? Would it be insane to try to build a Phaser Box2D game at 1024x768 or larger? I'm guessing that the larger the canvas size the worse the performance. Please correct me if I'm wrong. The bottom line is, I really want use Phaser with the Box2D plug-in, but I want to make sure that it's the right tool for the job. I realize that mobile performance will never match that of a desktop, but I want the game to at least be playable.
  20. Hey guys! I have had poor performance on older devices and cant reach beyond 30fps. I added Phaser-debug to my project to get some insight on where I need to start optimizing, but Im not sure I understand the numbers. Except for these numbers, everything was zero. preUpdate4ms - stage postUpdate1ms - stage5ms - plugins render4ms - renderer Even though thses numbers only add up to 14ms, the total displayed is 30-40ms of calculations. (I have no idea where the rest are displayed. Oh well. Except for the debug plugin, Im not using any plugins. What does stage mean? Where should I look to cut the display time based on these numbers?
  21. I am making a spaceship game, to be more optimized I want to avoid calculing collisions when are far away from the player. I tried doing: 1) enemy.body.enable = false;2) Also this doesn't work. Because I never set it to true:[0].sensor = false;3) Kill and revive them: it's not the best solution, because I want them to change positions. Nothing seems to work. What can I do? This is a part of my code for collisions in p2: this.body.setCollisionGroup(enemyCollisionGroup);this.body.collides([bulletCollisionGroup, playerCollisionGroup, enemyCollisionGroup, asteroidCollisionGroup], null );this.body.onBeginContact.add( this.startConstantDamage, this );this.body.onEndContact.add( this.endConstantDamage, this );Thanks
  22. The instructions here may not be specific to HTML5, but I think it explains well how game performance can be optimized on Android. A good read
  23. Hi everyone. Quick question. In HTML5 game dev, what would you say the best approach to game audio is right now? SoundJS? Audio Sprites? Something else? Sincerely, Carlos
  24. Hi everyone. I have a few questions that I would like some assistance with. As I'm getting into HTML5 game development as a technical designer/artist...I know that with an online game (especially html5), having your game assets require too many server calls is undesirable. What is a comfortable/safe number of server calls? When your dealing with multiple sprite sheets, is there a way to wrap multiple sprite sheets into one file? Not one big sprite sheet. What would be best practices for this?I am concerned because of mobile and/or other countries where bandwidth is an issue. I have the image asset file size part covered with Texturepacker, TinyPNG Re-using certain assets in smart ways, but I know that server calls can be a problem. Any help would be appreciated. Sincerely, Carlos
  25. Occlusion Culling

    Hello All, I am working in a pretty big, closed environment and was looking around for ways to optimize performance. I am using babylon 2.0 and saw a few things while looking around documentation which might help me such as LOD, SceneOptimizer, octrees and shadow maps. All of these optimization techniques are great, but it looks like babylon only does frustum culling (at least by default) because whenever an object is caught in the camera's field of view the frame rate drops considerably (from 50-60 to 5-15) even if the object is behind another object and can't be seen. If occlusion culling is not possible with babylon at the moment, could anyone throw other optimization techniques my way? Right now, I haven't really optimized the scene at all, but am not sure whether the things I mentioned above will be enough to give me at least 40 frames when looking in the direction of a lot of "hidden" objects since they will still be rendered. Any help would be greatly appreciated.