webGL crash on High dpi

Help
#1

I’m developing a html5 game with a starling framework

on mobile devices it was blurry so i added this line in project xml
window allow-high-dpi=“true”
now it look great but after few minutes webgl crashes
WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost
and on some devices for example Galaxy S6 it doesn’t load at all

and is there any way to turn on and off high-dpi depending on screen size?

any ideas?

#2

I think this is happening because of lost memory.

Could you try -Dopenfl-share-context (or <define name="openfl-share-context" /> in XML) and see if it behaves any differently?

#3

I think you are right, game memory increases while playing and i guess i’m not removing something properly and after some time is crashes.
is there any way to turn on or off high dpi depending on mobile screen size in project.lime xml file? because for example on Samsung galaxy S6 it can’t render game on high dpi, goes black screen instantly

#4

turned off hight dpi and found a solution for assets not to be blurry
by default in index html device pixel ratio should be > 2
on iphone 7 it was 2 and thats why assets were blurry
so I changed the code a bit and its looks perfect now

if (typeof window.devicePixelRatio != ‘undefined’) {
var meta = document.getElementById (“viewport”);
meta.setAttribute (‘content’, ‘width=device-width, initial-scale=’ + (1 / window.devicePixelRatio) + ‘, user-scalable=no’);
}

#5

Does that look correct, even if you do have <window allow-high-dpi="true" />?

#6

you mean the code I edited and hight dpi true at the same time?

#7

Hi! I did not test yet but i guess it works
<window allow-high-dpi=“true” />
//////////////////////////////
renderMode = “auto”, profile = “auto”
_starling.skipUnchangedFrames = false;
Texture.asyncBitmapUploadEnabled = false;
_starling.supportBrowserZoom = false;
_starling.supportHighResolutions = true;
_starling.antiAliasing = 0;

//////////////////
_starling.stop(true);

#8

p.s. and about that error > WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost

I think that error occurs because of filters. I forced to add and remove filters fast and game has crashed.
and now without filters memory doesn’t increase anymore.
Is there another way to remove filters? because = null isn’t enough as it seems…

#9

i think high dpi is very heavy and it is a better choice to edit devicePixelRatio

#10

and thanks for your help ^

#11

What does <window allow-high-dpi="true" /> actually do?
My html5 game is also crashing on old devices during assets loading (looks like they run out of memory), but I though allow-high-dpi was mostly for high definition fonts.

#12

when i ho full screen on android game is blurry again :frowning:

#13

I found out that on full screen device pixel ratio goes back to 1

found a solution but couldnt make it work :frowning:

“You can try keeping the initial-scale=1, then set the canvas.width and canvas.height to be double the appropriate dimensions you’ve determined, and use CSS to set the CSS width and CSS height to be the correct size. This should give you a higher resolution canvas. The canvas.height and canvas.width properties set the actual number of pixels in the canvas, while the CSS height and width simply stretch (or in this case, compress) the canvas to a particular size.”

#14

That’s what allow high-DPI does, but that’s also why it requires more memory

#15

yeah but don’t actually know why but performance drops much more than with other solutions.

and what do you think about filters that even after removing it somehow stays in memory and makes webgl crash?

#16

That sounds like an issue where the browser might not be properly garbage collecting WebGL resources.

#17

I think the same :frowning:

#18

Any update? My project uses canvas instead of webgl to avoid headaches, however, in the last release of openfl, filters stopped working as before at canvas build…