resolution parameter in config object stretches the game

[Nulligma]

Hello,

I am using Intel XDK with phaser to create a mobile game. To scale the game to every resolution I use this code

ratio = window.devicePixelRatio || 1;
w = window.screen.availWidth * ratio;
h = window.screen.availHeight * ratio;

var config = {
    "width": w,
    "height": h,
    "renderer": Phaser.AUTO,
    "parent": 'game',
    "resolution": ratio
	};

game = new Phaser.Game(config);

This works properly when ratio < 3 but above that game gets stretched vertically so for devices like iphone 6+ and devices with FHD resolution. 

If i dont provide the resolution parameter all the images becomes blurred. 

Can someone help me with this problem.

Thanks

[Nulligma]

I found out that this was due to rendering in WEBGL mode. When I render into CANVAS mode this problem vanishes. But a new problem arises, in CANVAS mode framerate drops below 5.

I am making 1010! clone and there is no more than 1 sprite moving at a time and there is no timer even and nothing. The game is very basic.

Does canvas mode performs very poorly on mobile devices? 

I am stuck between a choice, if I take WEBGL performance is 60 FPS but without "resolution" parameter everything is blurry or if I take CANVAS I can choose "resolution" parameter but get 5 FPS.