demiculus

Members
  • Content Count

    33
  • Joined

  • Last visited

About demiculus

  • Rank
    Advanced Member

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Result: 1. I've removed the masks changing the code below from import * as PIXI from 'pixi.js-legacy' export class RoundedBgView extends PIXI.Container { private readonly sprite: PIXI.Sprite private readonly roundMask: PIXI.Graphics constructor(w: number, h: number, container: PIXI.Container, texture: PIXI.Texture) { super() container.addChildAt(this, 0) this.sprite = new PIXI.Sprite() this.sprite.width = w this.sprite.height = h this.sprite.texture = texture this.addChild(this.sprite) const round = 5 this.roundMask = new PIXI.Graphics() this.roundMask.beginFill(0x000000) this.roundMask.drawRoundedRect(0, 0, this.width, this.height, round) this.addChildAt(this.roundMask, 1) this.sprite.mask = this.roundMask } isSameBg(texture: PIXI.Texture): boolean { if(texture == this.sprite.texture) return true return false } } to import * as PIXI from 'pixi.js-legacy' export class RoundedBgView extends PIXI.Graphics { private readonly texture: PIXI.Texture constructor(w: number, h: number, container: PIXI.Container, texture: PIXI.Texture) { super() this.texture = texture const matrix = new PIXI.Matrix() matrix.scale(w/texture.width, h/texture.height) this.beginTextureFill(texture, 0xFFFFFF, 1, matrix) this.drawRoundedRect(0,0, w, h,5) this.endFill() container.addChildAt(this, 0) } isSameBg(texture: PIXI.Texture): boolean { return texture == this.texture } } 2. I've made default powerPreference low-power this.app = new PIXI.Application({ antialias: antialias, // default value is window.devicePixelRatio * window.innerWidth <= 2000 resolution: resolution, // default value is window.devicePixelRatio backgroundColor: GameColor.getColorHexValue(GameColor.Color.Sea), powerPreference: powerPref, // default value is 'low-power' }) 3. I've added buttons for antialias, resolution & powerPreference, so players can change it: https://prnt.sc/qqoc4k The game seems to be more optimized. But it still heats up my mac while playing. The problem is most other games also heat it up. I think macs have an internal problem with webGL. Plain HTML games never heat it up. I also checked "two videoadapters" things and my mac only has one. I hope after this update windows users won't have any problems and mac users will be okay with it. 15% of our players are from mac. Lets see how the community reacts to it.
  2. I'm using pixi.js-legacy and when I do forceCanvas: true everything slows down. I know the game is simple and shouldn't need webGL but pixi is built for that I guess
  3. I'm using pixi v5, not sure why but everything works very slow when I just use canvas..
  4. Its v5 1. Why remove all cacheAsBitmap? 2. Spector.js looks cool but I can't make sense of whats going on, my understanding of all those calls and stuff aren't enough. Any resource you can recommend that'll increase my understanding of how things work and how I can debug to find where to optimize?
  5. I'm putting all the tiles & ports to the same container then using `cacheAsBitmap = true` on the container but the resolution goes south why is that? How can I fix it? Before resolution: https://prnt.sc/qppdw4 After resolution: https://prnt.sc/qppdzh
  6. Also I'm using PIXI.Text for most texts. Each time I use it, it creates a different canvas. Is this a good practice? When the views are removed are the canvas removed as well or are they still kept in the memory? If they are kept in the memory how can I remove the canvases from the memory? https://prnt.sc/qponiq
  7. When my game is played (colonist.io) it heats up the computer. Does it draw everything on the page every tick? For example I have a lot of tiles https://prnt.sc/qpc4l6 after drawing them all once would it increase the performance if I made them cacheAsABitmap? Could this be the reason why it is using a lot of resources or is it something small? There are around 110 sprites on the map (tile, dice, port etc.) and these do not change throughout the game. Are these using a lot of resources just staying the way they are. If I cache them as bitmap would the game use less resources? How can I track the resources they use?
  8. Hello, I'm creator of colonist.io The game is heating up the computer in macs and lagging. I've looked everywhere (at the best of my skills) and couldn't find the bottlenecks which causing this. Here is some of our players complaining to give you a better idea about the problem: https://colonist.featureupvote.com/suggestions/55589/cpugpu-usage-optimisation Once you play for 3 minutes you'll hear your mac fan. If you're using windows you should see the animation lagging. This is our testing server: https://hexs.io/ you can see the code in non minimized version. I've done a few performance improvements so Once you figure out the bottleneck which is causing all the lag you can email us the solution on colonist.jobs@gmail.com or post here. I will post here who has received the bounty once someone solves the issue. Let me know if there is anything else. Best of luck
  9. I'm using pixi v5. On my PIXI.Text I can set "resolution = 2" But that doesn't exist on PIXI.BitmapText. So how should I set resolution for PIXI.BitmapText? Thanks
  10. Hello developers, I'm one of the devs of colonist.io. I coded the UI and I can't say I've done a great job. I'm looking for someone to find the bottlenecks (cases which use a lot of resources) and help me fix them. I'm using Pixi.js for the game and plain HTML/CSS for the other elements, and writing them in typescript. Reach out here or colonist.jobs@gmail.com
  11. Ctrl + Shift + R Apparently I updated the css but it was still using the css from cache so you need a full refresh in order to fix it. I'm going to make the new css also include the version number. file.css?v=23 Also I'm curious how you found this forum for support, we have an email for such questions. After the update we got this questions from all over the place. Sorry it spread here as well. Feel free to delete Vakuus post & the ones which were related to keep the forum cleaner.
  12. Damn, I've been trying to figure out where SVGResource is for the past 2 hours (also trying other stuff) now realized it was for v5 I'm afraid to upgrade 😰 should I? or wait? 🤔 I'll dig deeper tomorrow
  13. I have many svg files that look alike with a few things different in each of them. Here is an example one. <?xml version="1.0" encoding="utf-8"?> <!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="500px" height="500px" viewBox="0 0 500 500" enable-background="new 0 0 500 500" xml:space="preserve"> <polygon fill="#2237FF" stroke="#000B71" stroke-width="30" stroke-miterlimit="10" points="270.073,318.023 270.073,209.126 319.049,209.126 176.098,57.9 33.148,209.126 82.124,209.126 82.124,462.342 217.969,462.342 270.073,462.342 467.852,462.342 467.852,318.023 "/> </svg> In pixi.loader I add images like: PIXI.loader .add('city_blue', getImagePath('city_blue.svg'), { crossOrigin: true }) .add('city_red', getImagePath('city_red.svg'), { crossOrigin: true }) .add('city_yellow', getImagePath('city_yellow.svg'), { crossOrigin: true }) .add('city_orange', getImagePath('city_orange.svg'), { crossOrigin: true }) .add('city_green', getImagePath('city_green.svg'), { crossOrigin: true }) .add('city_gray', getImagePath('city_gray.svg'), { crossOrigin: true }) ... The polygon fill & stroke is the only parameters different in this image but my sever needs to load ALL of the images in order for this to work. So my question is how can I dynamically change a single svg images parameters so that my website loads faster?
  14. After a lot of googling I've fixed the problem with adding crossOrigin: true .add('tile_lumber', getImagePath('tile_lumber.svg'), { crossOrigin: true }) I have no idea what crossOrigin does or how it works but it seems to have solved the problem. I got the answer from If the problem occurs again, I'll post here.
  15. @ivan.popelyshev I had removed caching thus fixed the problem (sort of) But now I wanted my game to be faster thus I'm trying to cache everything. This problem is back. I'm digging deeper into what is going on, so far what I have found is - This bug happens only on chromium browsers (chrome, brave etc..) - This bug happens only when using webGL rendering not canvas: https://youtu.be/9oTXm5ejWWY I'm looking deeper into how renderers work but I lack a lot of knowledge. I might create a standalone project which reproduces the bug. I'll post here if I do.