Discover which iOS devices are used on your site

Deprecated: iOS 12.2 removed the GPU information, this doesn’t work anymore. ☹️

If you’re a web developer and you’ve tried to know the specific iOS devices used by your users, you’ve hit a wall: different devices have the same user agent and screen size.

The solution, found in apple.com’s JavaScript , is to ask WebGL for the user’s GPU; iOS devices return a string like “Apple A12 GPU”. Combined with the screen size that’s enough to differentiate most devices.

Use cases:

Learn for which generation of iOS device to optimize your site

Get a clearer idea of your users’ spending profiles

Discover the split between different models introduced at the same time

iDevice.js

iDevice.js is a library that will tell you which iOS device is being used.

Download Star 0.98kB gzipped, v2.1.0 or npm i idevice

< script src = "/js/idevice.js" ></ script > < script > if ( iDevice ) { console . log ( 'The iOS device is an ' + iDevice ); } </ script >

The variable iDevice is a string such as “iPhone XS” when it identifies an iOS device, otherwise it’s undefined .

Integration with Google Analytics

if ( iDevice ) { ga ( 'send' , 'event' , 'iOS devices' , 'Page view' , iDevice , { nonInteraction : true }); }

if ( iDevice ) { gtag ( 'event' , 'Page view' , { 'event_category' : 'iOS devices' , 'event_label' : iDevice , 'non_interaction' : true }); }

Stats will then be available in Behavior > Events > Top Events.

Limitations

Devices that run iOS 7 or older (2% of active devices) don’t have WebGL and return undefined .

Not-yet-known iOS devices are reported as “Unidentified <CPU> <screen>”. For instance “Unidentified A13 375x812@3”.

Some devices are indistinguishable from others (9% of active devices):

“iPhone 5/5c” (PowerVR SGX 543, 320×568@2x)

“iPad 2/mini 1” (PowerVR SGX 535, 768×1024@1x)

“iPad Air/mini 2/mini 3” (Apple A7 GPU, 768×1024@2x)

And some devices might be their bigger sibling with Display Zoom:

“iPhone SE (or 6s with Display Zoom)” (Apple A9 GPU, 320×568@2x)

“iPhone XS (or XS Max with Display Zoom)” (Apple A12 GPU, 375×812@3x)

“iPhone 6s” and “iPhone XS Max” are correctly returned when they don’t use Display Zoom.

Detecting Display Zoom

If you’d like to know what percentage of your users have Display Zoom enabled, you may do so on select devices. Check whether:

“iPhone 6”, “iPhone 7” or “iPhone 8” has a screen.width of 320

of 320 “iPhone 6 Plus”, “iPhone 6s Plus”, “iPhone 7 Plus”, “iPhone 8 Plus” or “iPhone XR” has a screen.width of 375

Changelog

2.1.0 (2019/03/18)

Add 2019 iPad Air and iPad mini

2.0.0 (2018/11/03)

Handle Display Zoom

“iPhone SE” is now “iPhone SE (or 6s with Display Zoom)”

“iPhone XS” is now “iPhone XS (or XS Max with Display Zoom)”

iPad Pros’ names now have an inch sign

“iPad Pro 11 (2018)” is now “iPad Pro 11" (2018)”, etc.

1.1.0 (2018/11/03)

Add 2018 iPad Pros

1.0.2 (2018/11/03)

Add tests

Fix 2015 iPad Pro release year

Fix A10 iPad release year

Add MIT license

1.0.1 (2018/09/20)

Fix iPad 10.5″ and 12.9″ detection.

1.0.0 (2018/09/19)

Initial release.