themoonrat

Members
  • Content Count

    218
  • Joined

  • Last visited

About themoonrat

  • Rank
    Advanced Member
  • Birthday 11/25/1982

Contact Methods

  • Website URL
    http://www.moonrat.co.uk
  • Twitter
    themoonrat

Profile Information

  • Gender
    Male
  • Location
    UK

Recent Profile Visitors

2,370 profile views
  1. themoonrat

    Adaptive playback

    So, there are 2 methods to have adaptive quality; one is to dynamically change things at runtime depending on performance, and the other is to figure out a quality before the app even loads to adapt. At runtime, then yes, you are measuring fps. But you have to record a rolling average, really. If after reading the fps over the last 5 seconds, the frame rate had a min of 20 and a max of 30...then it's clear there is a persistent issue in performance, and maybe you could adjust the resolution of the app on the fly, or not play certain particle effects / filters. Just a one off measurement might be you getting unlucky during garbage collection or something. But also make sure make sure that you're measuring at the right time. Don't measure whilst loading assets; download assets and uploading textures to the gpu can cause stutters on any device, so wait to measuring until you know the device has it's best chances of displaying good performance. Figuring out the quality before the app loads usually gives the best user experience.... and you have 2 ways of this route. The first is as ivan suggested and give the user the option to choose. The other is to try and detect the capabilities of the device and change settings based on that. At a basic level, if the device can only support the canvas renderer, you know you've got a low quality device on your hands. You could detect browser versions. You could detect WebGL capabilities: http://webglreport.com/ is a super useful website in that respect. Compare the hardware you have via that website; find out what differences there are in the hardware that runs your app well and the hardware that runs your app less well. For example, the lower end hardware may support less texture units, or may not support anti-aliasing.
  2. themoonrat

    Degraded PIXI.Text performance in iOS 12.0.1

    Is it possible to set up a fiddle to demonstrate this? I have a large range of devices available I could set on tomorrow to see if there's a difference between different ios versions
  3. themoonrat

    No TouchEvents Error

    There is something bizarre in your setup that isn't quite right. Because, for you, PIXI is just entirely broken. But it's not broken for anyone else I've just got the testers here to test on IE and Firefox on Windows 7, IE and Firefox on Windows 10, Safari on a mac... and it all works. And they all work because they do not have 'window.ontouchstart', and thus 'this.supportsTouchEvents' becomes false, thus there is no issue on the if statement in question. So the first port of all... load up a fresh instance of IE, go to about:blank, and then in the console, type in 'window.ontouchstart'. I'd expect it to return 'undefined' If that is the same for you, the question becomes... why does your setup have 'ontouchstart' defined for ALL browsers, no matter what, when browser themselves do not have that property? Which makes me think somewhere in your code base is adding it. Perhaps a polyfill?
  4. themoonrat

    No TouchEvents Error

    @botmaster Could you create a little jsfiddle please demonstrating the error you are describing, and I'll take a look. Games I make using PIXI are tested against pretty much everything, and we've never seen anything like this before. It'd also be useful to know what kind of desktop device you are playing on.... or does it go wrong on a range of devices? Thanks!
  5. https://chrome.google.com/webstore/detail/spectorjs/denbgaamihkadbghdceggmchnflmhpmk?hl=en is a great extension to analyse what WebGL calls are being made
  6. themoonrat

    Question about resolution

    Also for 2. I wouldn't just link devicePixelRatio to the resolution part of PIXI. Otherwise you get mobile devices trying to render at 4k or over... which is just silly. By all means, adjust resolution based on device, but I'd pick a few resolutions, and select which one to use based on inspecting the device To change resolution of the renderer dynamically, you can use code like this const oldResolution = renderer.resolution; renderer.plugins.interaction.resolution = newResolution; if ( renderer.gl ) ) { renderer.resolution = renderer.rootRenderTarget.resolution = newResolution; } else { renderer.resolution = renderer.rootResolution = newResolution; } renderer.resize( renderer.width / oldResolution, renderer.height / oldResolution );
  7. themoonrat

    PIXI element typof

    If you wanted to go down that route, you can also do const prettyImage = new PIXI.Sprite(); const constructorName = prettyImage.constructor.name; // will return 'Sprite' https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/name
  8. themoonrat

    Pixi-Sound vs Howler

    Both are great options! The main advantage of Howler is it's wider use. I use it, and love it, and feel more secure in using it because so many devs do too. The main downside is fitting it into the Pixi loading process. Even if you download audio as a blob, you still need to account in your preloading process for passing it to Howler for it to be decoded. The main advantage for Pixi Sound is that it covers this integration for you. In production code, it's easier to get up and running. And the syntax and use is all very familiar because it was made by a Pixi Dev. But that's not saying Pixi Sound is not reliable, it is! And it's not saying Howler is hard to use... it really isn't. Both are great options with active and receptive maintainers.
  9. themoonrat

    Audio Format Compatibility

    1. I would use m4a as primary choice, and off as fallback. m4a has the same compatibility range on browsers as mp3, but sounds better for the same file size, and loops better for background music. ogg is the fallback for the uncommon occasion m4a isn't supported. 2. ALL mobile browsers now require a user touch to enable unlocking audio. If you have a 'touch here to continue' kinda screen after loading, that'll get you the touch you need
  10. themoonrat

    PIXI js game black screen delay

    They are popping in because the assets are loading in the background, and show when they've finished loading. To stop that effect, you should use the preloader within pixi to preload all assets (showing a loading screen perhaps) before starting the game
  11. themoonrat

    Audio on Mobile

    https://github.com/pixijs/pixi-sound is made to integrate into the loader that pixi uses, and is successfully used in a number of projects. You really want to use another lib to handle sound to get web audio support at the very least. Otherwise you're setting yourself up for more issues in the future.
  12. themoonrat

    Audio on Mobile

    I'd really recommend using Howler or pixi sound for audio, it'll handle this stuff for you
  13. themoonrat

    Audio on Mobile

    Mobile requires a user interaction to 'unlock' audio and allow it to play
  14. The scale mode of the texture needs to be set to nearest. You can either do that on a texture by texture basis via the scaleMode property, or change the default via http://pixijs.download/dev/docs/PIXI.settings.html#.SCALE_MODE
  15. themoonrat

    set and cancel fullsreen mode in mobile.

    For mobile devices, some of those events above are not classes as valid events to unlock audio or unlock full screen API. touchstart or touchend is usually what you need