HTML5 Game is rendering blurry only on first render?

When I bundle or run a built HTML5 version of my game, it opens blurry, but when I tab out and return it re-renders sharp. Is there any way to make it so my game will render sharp on the first render and not just any subsequent ones?


1 Like

Have you found any solution?

1 Like

Are you seeing this happen? Maybe try manually resizing the canvas viewport on load?

Do we have any JS onload event we can use? So far the only workaround I found is to trigger

window.dispatchEvent(new Event(‘resize’))

after some timeout:

if html5 then
	timer.delay(.5, false, function()
		html5.run("window.dispatchEvent(new Event('resize'));")
	end)
end

Does the blurry issue happen in an empty Defold project without any extensions too, or only in your game? If it’s the latter, which extensions are you using?

1 Like

I found issue in my case - I call msg.post(‘@render:’, ‘resize’, { width = 1240, height = 700 }) in game init (while display size in project file is set to 1920x1080) - to make the window fit into MacBook screen.

6 Likes

I had the same problem because I was using DefOS:
[defos]
view_width = 405
view_height = 900

Yes, it’s a known issue in DefOS - View size from game.project affects HTML5 canvas size until first window resize · Issue #134 · subsoap/defos · GitHub

1 Like

Please test this version and confirm it’s no longer causing a problem on HTML5. Very minor change to disable this for HTML5.

1 Like