Hello everyone May I ask, in the goal of "openfl html5", Is there a built-in method to detect whether the runtime environment is on a computer or a mobile device?

Haxe
1

.
Hello everyone
May I ask, in the goal of “openfl html5”,
Is there a built-in method to detect whether the runtime environment is on a computer or a mobile device?
.
In the goal of “openfl html5”,
I need to check whether the runtime environment is on a computer or a mobile device,
Does’ openfl 'have such a method? Thank you
.

2

.
@Bink
@joshtynjala
.
I am inquiring with two senior developers
.

3

You may use Haxe conditional compilation for that: Conditional Compilation - Haxe - The Cross-platform Toolkit

Like, to check out if the code is running from HTML5: #if (js && html5)

4

If I’m not mistaken, the question is specific to the HTML5 build target, and seeking to find a way to detect the end-user’s device type in the HTML5 environment: mobile or desktop.

@785597448 , I’m not aware of such a feature within Lime or OpenFL, but I wouldn’t count my word as the final say on that. There are others here who are more familiar with the code base than I.

Using a more typical method though, you can access the browsers user agent via js.Browser.navigator.userAgent. You can then evaluate it with regex.

This works when I test it on desktop, using the dev tools to simulate a mobile device.

#if html5
var isMobile = ~/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.match(js.Browser.navigator.userAgent);

if (isMobile) {
    trace("Mobile device detected!");
} else {
    trace("Desktop device detected!");
}
#end

I should caution, the user agent is not regarded as a completely reliable means to perform this detection. The fact that I can fake it using dev tools is one example of why. In the past, I’ve used 3rd party libraries to help detect these things using capability checks, even then with varying success.

5

.
@chokito
@Bink
.
Thank you very much for your reply,
As I mentioned earlier,
I want to know if ‘openfl’ has built-in method implementations,
.
@Bink
.
What I need is a reliable method,
As you mentioned above, programs can be forged ..
.

6

.
@Bink
.
Have you tested it,
Which of the “openfl” and “starling” true type text fields has higher performance?
.

7

OpenFL’s TextField should have higher performance because true type fonts in Starling’s TextField are rendered using OpenFL’s TextField. It’s an extra step to draw the OpenFL TextField to a Starling Texture to display in a Starling TextField.

8

As far as HTML5 is concerned (not an OpenFL limitation), user agent and features sniffing are the only ways I’m aware of to try and determine end user device. Neither method is perfect though, because not all features are exclusive to mobile (touch screen etc), and the user agent can be spoofed.

I mentioned elsewhere, that the HTML5 target must exist withing a browser sandbox, which limits what any application running within that sandbox (such as OpenFL) can do. This includes fingerprinting based on device characteristics (not talking about cookies here). There is only limited information a HTML5 application can sniff about the end-user’s device, and all of that is limited to what their browser will let the application sniff.

If you come across a reliable method any HTML5 application can use to determine end-user device, perhaps it’s something we could attempt to make work in an OpenFL code snippet.

9

This code should detect if a device likely has a touchscreen and no mouse on the HTML5 target.

var htmlWindow = cast(js.Lib.global, js.html.Window);
if (htmlWindow.matchMedia("screen and (hover: none) and (pointer: coarse)").matches {
   // has a touchscreen and no mouse
}

However, it is possible to connect a mouse to many types of mobile devices, so that may not always work, even if it does most of the time.

Unfortunately, there isn’t a perfect way in JavaScript to be absolutely sure whether a device is mobile or desktop. Bink explained that well. However, you can make a pretty good guess by using media queries, like the one above. It may be a good idea to fall back to checking the user agent for certain strings too, as a last resort.

10

.
@Bink
@joshtynjala
@chokito
.
ok HTML5 does have too many restrictions. If a better method cannot be found, it can only be done this way ..
.

11

@joshtynjala

I didn’t test this,
But you gave the answer,
That’s great.

12

@Bink
@joshtynjala

I just did a test,
The maximum number of animations played on the same screen,
The performance of ‘openfl tilemap’ is higher than that of ‘starling moveclip’,
I thought ‘Starling Movieclip’ had high performance before testing ..

13

@Bink
@joshtynjala

The performance of ‘openfl TextField’ is higher than that of ‘starling TextField’,
The performance of ‘openfl tilemap’ is higher than that of ‘starling moveclip’,
Isn’t it said that ‘Starling’ performs better than ‘OpenFL’?

14

TileMap is highly optimized to display lots of tiles and hardware rendered, it’s no surprise it runs better than starling’s MovieClip : those are 2 very different things, with different usages.

I do have a kind of TileMap lib for starling, which (of course) runs far better than MovieClip, it still needs a bit of work before I can publicly release it though. I expect to post about it in the coming weeks.

15

@Matse

That’s great,
Are you the author of ‘Starling’?

16

Haha no, the author of Starling is Daniel Sperl. I helped with the haxe version and ported some libs.

17

@Matse

Are you maintaining the ‘OpenFL version Starling’?

18

No, I just help when I can