mirror of
https://github.com/faisalman/ua-parser-js.git
synced 2025-09-27 16:08:47 +03:00
1548 lines
93 KiB
HTML
1548 lines
93 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
|
|
<meta name="keywords"
|
|
content="browser detection, user-agent, javascript, detect os, mobile, tablet, detect device, cpu, javascript, nodejs, jquery, typescript, client hints, bots, iphone, ipad, android" />
|
|
<meta name="description" content="UAParser.js is the most comprehensive, compact, & up-to-date isomorphic JavaScript library to detect visitor's Browser, Engine, OS, CPU, and Device type/model.">
|
|
<title>UAParser.js - Detect Browser, Engine, OS, CPU, and Device type/model from User-Agent & Client Hints data using JavaScript. Supports browser & node.js environment. Also available as jQuery plugin & TypeScript-ready development.</title>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/default.min.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/srcery.min.css">
|
|
<link rel="icon" type="image/png" href="images/logo.png">
|
|
<link rel="stylesheet" type="text/css" href="semantic-ui/semantic.css">
|
|
<link rel="stylesheet" type="text/css" href="css/style.css">
|
|
<script src="js/jquery-3.6.0.min.js"></script>
|
|
<script src="semantic-ui/semantic.js"></script>
|
|
<script src="js/clipboard.min.js"></script>
|
|
<script src="js/ua-parser.js"></script>
|
|
<script src="js/ua-list-example.js"></script>
|
|
<script src="js/script.js"></script>
|
|
<script defer src="https://app.tinyanalytics.io/pixel/9nNpPJDLeUns0LD3"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/highlight.min.js"></script>
|
|
<script src="https://assets.lemonsqueezy.com/lemon.js" defer></script>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="pusher">
|
|
<div class="ui inverted instagram vertical masthead center aligned segment">
|
|
<h2 class="ui inverted header">
|
|
What <span class="ui massive black label">device.type</span> am I using?
|
|
</h2>
|
|
<div class="ui text container">
|
|
<h1>
|
|
<p><a href="https://uaparser.dev">{UAParser.js}</a> is a JavaScript library to detect user's
|
|
<u>Browser</u>, <u>Engine</u>, <u>OS</u>, <u>CPU</u>, and <u>Device</u> type/model. Runs either
|
|
in browser (client-side) or node.js (server-side).</p>
|
|
</h1>
|
|
<div class="ui massive buttons">
|
|
<a href="#try" class="ui violet button"><i class="magic icon"></i>Try Demo</a>
|
|
<a href="https://docs.uaparser.dev" class="ui green button"><i class="book icon"></i>Read Docs</a>
|
|
<a href="#download" class="ui blue button"><i class="download icon"></i>Download</a>
|
|
</div>
|
|
</div>
|
|
<img alt="UAParser.js Illustration" class="ui centered image illustration" src="images/uap-illustrations.png" />
|
|
</div>
|
|
|
|
|
|
<div id="try" class="ui text container">
|
|
<div class="ui horizontal divider">
|
|
FEATURED : OUR SPONSORS
|
|
</div>
|
|
<div class="ui tall stacked segment">
|
|
<div class="ui stackable grid">
|
|
<div class="column">
|
|
<a href="https://opencollective.com/ua-parser-js"
|
|
class="ui right floated large labeled icon button">
|
|
<i class="share icon"></i>PUT YOUR LOGO / TEXT HERE</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="ui text container">
|
|
<div id="demo" class="ui horizontal divider">
|
|
DEMO : A USER-AGENT PLAYGROUND
|
|
</div>
|
|
<div class="ui tall stacked segment">
|
|
<div class="ui basic segment">
|
|
<div class="ui black massive label">
|
|
<p id="ua-txt" class="code"></p><button id="btn-clipboard"
|
|
class="ui right floated labeled icon violet large button" data-clipboard-target="#ua-txt"><i
|
|
class="clipboard icon"></i>COPY TO CLIPBOARD</button>
|
|
</div>
|
|
<div class="ui basic segment center aligned">
|
|
<p class="what-provides" id="ua-txt-info">
|
|
What your browser provides = 😱😵💫❓
|
|
</p>
|
|
<div class="ui horizontal divider">
|
|
VS
|
|
</div>
|
|
<p class="what-provides">
|
|
What {UAParser.js} provides = 🙂👍🎉
|
|
</p>
|
|
</div>
|
|
<pre><code id="ua-result" class="language-json"></code></pre>
|
|
</div>
|
|
<div id="demo-result" class="ui equal width stackable internally celled grid">
|
|
<div class="row">
|
|
<div class="column">
|
|
<div class="ui center aligned animated icon">
|
|
<i class="edge icon"></i>
|
|
Browser
|
|
</div>
|
|
<div class="ui center aligned header">
|
|
<div class="header" id="browser-txt"></div>
|
|
</div>
|
|
<div class="ui basic segment">
|
|
<img alt="detected browser icon" class="ui tiny centered image" id="browser-img" src="">
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui center aligned animated icon">
|
|
<i class="cogs icon"></i>
|
|
Engine
|
|
</div>
|
|
<div class="ui center aligned header">
|
|
<div class="header" id="engine-txt"></div>
|
|
</div>
|
|
<div class="ui basic segment">
|
|
<img alt="detected engine icon" class="ui tiny centered image" id="engine-img" src="">
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui center aligned animated icon">
|
|
<i class="windows icon"></i>
|
|
OS
|
|
</div>
|
|
<div class="ui center aligned header">
|
|
<div class="header" id="os-txt"></div>
|
|
</div>
|
|
<div class="ui basic segment">
|
|
<img alt="detected os icon" class="ui tiny centered image" id="os-img" src="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<div class="ui center aligned animated icon">
|
|
<i class="tv icon"></i>
|
|
Type
|
|
</div>
|
|
<div class="ui basic segment">
|
|
<img alt="detected device type icon" class="ui tiny centered image" id="type-img" src="">
|
|
<div class="ui center aligned header">
|
|
<div class="header" id="type-txt"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui center aligned animated icon">
|
|
<i class="mobile alternate icon"></i>
|
|
Model
|
|
</div>
|
|
<div class="ui basic segment">
|
|
<img alt="detected device vendor icon" class="ui tiny centered image" id="device-img" src="">
|
|
<div class="ui center aligned header">
|
|
<div class="header" id="device-txt"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui center aligned animated icon">
|
|
<i class="microchip icon"></i>
|
|
CPU
|
|
</div>
|
|
<div class="ui basic segment">
|
|
<img alt="detected cpu icon" class="ui tiny centered image" id="cpu-img" src="">
|
|
<div class="ui center aligned header">
|
|
<div id="cpu-txt"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ui horizontal divider">
|
|
TRY MORE EXAMPLES
|
|
</div>
|
|
<form class="ui large form">
|
|
<div class="field">
|
|
<label>Pick another User-Agent to test:</label>
|
|
<select class="ui search dropdown" id="demo-select">
|
|
<option value="">Select</option>
|
|
</select>
|
|
</div>
|
|
<div class="field">
|
|
<label>OR simply type any User-Agent that you want to check:</label>
|
|
<div class="ui right action input">
|
|
<input type="text" name="custom-ua"
|
|
placeholder="Mozilla/5.0 (Linux; U; Android 4.0.3; H4NY4-C0NT0H Build/CR7) . . . .">
|
|
<div class="ui right labeled icon violet button" id="demo-btn">
|
|
<i class="redo alternate icon"></i>
|
|
CHECK
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div id="gpu-divider" class="ui horizontal divider">
|
|
DETECT GPU FROM WEBGL DATA (EXPERIMENTAL FEATURE)
|
|
</div>
|
|
<div id="gpu-segment" class="ui tall stacked segment">
|
|
<div class="ui equal width stackable internally celled grid">
|
|
<div class="row">
|
|
<div class="column">
|
|
<div class="ui right aligned icon">
|
|
<i class="microchip icon"></i>
|
|
GPU
|
|
</div>
|
|
<img alt="detected gpu icon" class="ui tiny centered image" id="gpu-img" src="">
|
|
<div class="ui center aligned header">
|
|
<div id="gpu-txt"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ui horizontal divider">
|
|
QUICKSTART : SUPPORT VARIOUS DEVELOPMENT STRATEGIES
|
|
</div>
|
|
<div class="ui top attached tabular menu">
|
|
<a class="item active" data-tab="esm">ESM / TypeScript</a>
|
|
<a class="item" data-tab="node">Node.js</a>
|
|
<a class="item" data-tab="html">HTML</a>
|
|
<a class="item" data-tab="jquery">jQuery</a>
|
|
<a class="item" data-tab="cli">Command Line</a>
|
|
</div>
|
|
<div class="ui bottom attached tab tall stacked segment active" data-tab="esm">
|
|
<div class="ui basic segment">
|
|
<p>To get started, install UAParser.js using npm:</p>
|
|
|
|
<pre><code>$ npm install ua-parser-js
|
|
</code></pre>
|
|
|
|
<p>Then, import the library in your application:</p>
|
|
|
|
<pre><code class="language-js">import { UAParser } from 'ua-parser-js';
|
|
|
|
const ua = 'Mozilla/5.0 (X11; U; Linux armv7l; en-GB; rv:1.9.2a1pre)
|
|
Gecko/20090928 Firefox/3.5 Maemo Browser 1.4.1.22 RX-51 N900';
|
|
|
|
const { browser, cpu, device } = UAParser(ua);
|
|
|
|
console.log(browser.name); // Maemo Browser
|
|
console.log(cpu.is('arm')); // true
|
|
console.log(device.is('mobile')); // true
|
|
console.log(device.vendor); // Nokia
|
|
console.log(device.model); // N900
|
|
</code></pre>
|
|
|
|
<a href="https://docs.uaparser.dev/intro/quick-start/using-es-modules-typescript.html" class="ui large violet button"><i class="external alternate icon"></i>READ THE DOCS</a>
|
|
</div>
|
|
</div>
|
|
<div class="ui bottom attached tab tall stacked segment" data-tab="html">
|
|
<div class="ui basic segment">
|
|
|
|
<p>Download UAParser.js from the official GitHub repository: <a href="https://github.com/faisalman/ua-parser-js/blob/master/dist/ua-parser.min.js">ua-parser-js</a>, then place the following script tag in your HTML file to include the library:</p>
|
|
|
|
|
|
<pre><code class="language-js"><script src="ua-parser.min.js"></script>
|
|
</code></pre>
|
|
<p>Alternatively, you can use a CDN like <a href="https://cdn.jsdelivr.net/npm/ua-parser-js/src/ua-parser.min.js">jsDelivr</a> or <a href="https://cdnjs.com/libraries/UAParser.js">cdnjs</a> in your script tag:</p>
|
|
|
|
<pre><code class="language-js"><script src="https://cdn.jsdelivr.net/npm/ua-parser-js/dist/ua-parser.min.js"></script>
|
|
</code></pre>
|
|
|
|
<p>Then, use the library in your HTML page:</p>
|
|
|
|
<pre><code class="language-html">
|
|
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<script src="ua-parser.min.js"></script>
|
|
<script>
|
|
|
|
const uap = new UAParser();
|
|
console.log(uap.getResult());
|
|
/*
|
|
/// This will print an object structured like this:
|
|
{
|
|
ua: "",
|
|
browser: {
|
|
name: "",
|
|
version: "",
|
|
major: "",
|
|
type: ""
|
|
},
|
|
engine: {
|
|
name: "",
|
|
version: ""
|
|
},
|
|
os: {
|
|
name: "",
|
|
version: ""
|
|
},
|
|
device: {
|
|
model: "",
|
|
type: "",
|
|
vendor: ""
|
|
},
|
|
cpu: {
|
|
architecture: ""
|
|
}
|
|
}
|
|
*/
|
|
// The result depends on current window.navigator.userAgent value
|
|
|
|
// Now let's try a custom user-agent string as an example
|
|
const uastring1 = "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/535.2 (KHTML, like Gecko) Ubuntu/11.10 Chromium/15.0.874.106 Chrome/15.0.874.106 Safari/535.2";
|
|
uap.setUA(uastring1);
|
|
const result = uap.getResult();
|
|
|
|
console.log(result.browser); // {name: "Chromium", version: "15.0.874.106", major: "15", type: undefined}
|
|
console.log(result.device); // {model: undefined, type: undefined, vendor: undefined}
|
|
console.log(result.os); // {name: "Ubuntu", version: "11.10"}
|
|
console.log(result.os.version); // "11.10"
|
|
console.log(result.engine.name); // "WebKit"
|
|
console.log(result.cpu.architecture); // "amd64"
|
|
|
|
// Do some other tests
|
|
const uastring2 = "Mozilla/5.0 (compatible; Konqueror/4.1; OpenBSD) KHTML/4.1.4 (like Gecko)";
|
|
console.log(uap.setUA(uastring2).getBrowser().name); // "Konqueror"
|
|
console.log(uap.getOS()); // {name: "OpenBSD", version: undefined}
|
|
console.log(uap.getEngine()); // {name: "KHTML", version: "4.1.4"}
|
|
|
|
const uastring3 = 'Mozilla/5.0 (PlayBook; U; RIM Tablet OS 1.0.0; en-US) AppleWebKit/534.11 (KHTML, like Gecko) Version/7.1.0.7 Safari/534.11';
|
|
console.log(uap.setUA(uastring3).getDevice().model); // "PlayBook"
|
|
console.log(uap.getOS()); // {name: "RIM Tablet OS", version: "1.0.0"}
|
|
console.log(uap.getBrowser().name); // "Safari"
|
|
|
|
</script>
|
|
</head>
|
|
<body>
|
|
</body>
|
|
</html>
|
|
</code></pre>
|
|
|
|
<a href="https://docs.uaparser.dev/intro/quick-start/using-html.html" class="ui large violet button"><i class="external alternate icon"></i>READ THE DOCS</a>
|
|
</div>
|
|
</div>
|
|
<div class="ui bottom attached tab tall stacked segment" data-tab="node">
|
|
<div class="ui basic segment">
|
|
|
|
<p>In a server-side environment like Node.js, UAParser.js can parse the <code>[User-Agent]</code> and <code>[Sec-CH-UA-*]</code> headers from the incoming HTTP requests. </p>
|
|
|
|
<p>To get started, install UAParser.js using npm:</p>
|
|
|
|
<pre><code>$ npm install ua-parser-js
|
|
</code></pre>
|
|
|
|
<p>Then, require the library in your Node.js application:</p>
|
|
|
|
<pre><code class="language-js">const http = require('http');
|
|
const uap = require('ua-parser-js');
|
|
|
|
http.createServer(function (req, res) {
|
|
// get user-agent header
|
|
let ua = uap(req.headers['user-agent']);
|
|
|
|
/*
|
|
// Since v2.0.0
|
|
// you can also pass Client Hints data to UAParser
|
|
// note: only works in a secure context (localhost or https://)
|
|
// from any browsers that are based on Chrome 85+
|
|
// https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Sec-CH-UA
|
|
|
|
const getHighEntropyValues = 'Sec-CH-UA-Full-Version-List, Sec-CH-UA-Mobile, Sec-CH-UA-Model, Sec-CH-UA-Platform, Sec-CH-UA-Platform-Version, Sec-CH-UA-Arch, Sec-CH-UA-Bitness';
|
|
res.setHeader('Accept-CH', getHighEntropyValues);
|
|
res.setHeader('Critical-CH', getHighEntropyValues);
|
|
|
|
ua = uap(req.headers).withClientHints();
|
|
*/
|
|
|
|
// write the result as response
|
|
res.end(JSON.stringify(ua, null, ' '));
|
|
})
|
|
.listen(1337, '127.0.0.1');
|
|
|
|
console.log('Server running at http://127.0.0.1:1337/');
|
|
</code></pre>
|
|
|
|
<a href="https://docs.uaparser.dev/intro/quick-start/using-node-js.html" class="ui large violet button"><i class="external alternate icon"></i>READ THE DOCS</a>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="ui bottom attached tab tall stacked segment" data-tab="jquery">
|
|
<div class="ui basic segment">
|
|
<p>Although written in vanilla JavaScript, UAParser.js automatically detects the presence of <code>jQuery</code> (or <code>Zepto</code>) and creates a <code>$.ua</code> object in addition to the <code>window.UAParser</code> constructor.</p>
|
|
|
|
<h4>Properties</h4>
|
|
|
|
<p>The result of detected user-agent</p>
|
|
|
|
<ul>
|
|
<li><code>$.ua.browser</code></li>
|
|
<li><code>$.ua.cpu</code></li>
|
|
<li><code>$.ua.device</code></li>
|
|
<li><code>$.ua.engine</code></li>
|
|
<li><code>$.ua.os</code></li>
|
|
</ul>
|
|
|
|
<h4>Methods</h4>
|
|
|
|
<p>To get or set the user-agent</p>
|
|
|
|
<ul>
|
|
<li><code>$.ua.get()</code></li>
|
|
<li><code>$.ua.set(ua)</code></li>
|
|
</ul>
|
|
|
|
<h4>Code Example:</h4>
|
|
|
|
<pre><code>// Say we are in a browser where jQuery is present
|
|
// with user-agent: "Mozilla/5.0 (Linux; U; Android 2.3.4; en-us; Sprint APA7373KT Build/GRJ22) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0"
|
|
|
|
// Get the details
|
|
console.log($.ua.device); // {vendor: "HTC", model: "Evo Shift 4G", type: "mobile"}
|
|
console.log($.ua.os); // {name: "Android", version: "2.3.4"}
|
|
console.log($.ua.os.name); // "Android"
|
|
console.log($.ua.get()); // "Mozilla/5.0 (Linux; U; Android 2.3.4; en-us; Sprint APA7373KT Build/GRJ22) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0"
|
|
|
|
if($.ua.browser.is("IE")) {
|
|
alert("Please upgrade!");
|
|
}
|
|
|
|
// Now let's try another custom user-agent
|
|
$.ua.set('Mozilla/5.0 (Linux; U; Android 3.0.1; en-us; Xoom Build/HWI69) AppleWebKit/534.13 (KHTML, like Gecko) Version/4.0 Safari/534.13');
|
|
|
|
// Test again
|
|
console.log($.ua.browser.name); // "Safari"
|
|
console.log($.ua.engine.name); // "Webkit"
|
|
console.log($.ua.device); // {vendor: "Motorola", model: "Xoom", type: "tablet"}
|
|
console.log($.ua.browser.version); // "4.0"
|
|
console.log($.ua.browser.major); // "4"
|
|
|
|
// Add class to <body> tag
|
|
// <body class="ua-browser-safari ua-devicetype-tablet">
|
|
$('body')
|
|
.addClass(
|
|
'ua-browser-' +
|
|
$.ua.browser.name +
|
|
' ua-devicetype-' +
|
|
$.ua.device.type);
|
|
</code></pre>
|
|
|
|
<a href="https://docs.uaparser.dev/intro/quick-start/using-jquery.html" class="ui large violet button"><i class="external alternate icon"></i>READ THE DOCS</a>
|
|
</div>
|
|
</div>
|
|
<div class="ui bottom attached tab tall stacked segment" data-tab="cli">
|
|
<div class="ui basic segment">
|
|
|
|
You can use <code>npx</code> to run UAParser.js from the command line without installing the package:
|
|
|
|
<pre><code>$ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)"
|
|
|
|
# console output:
|
|
"
|
|
[
|
|
{
|
|
"ua": "Flock/2.16 (Zenwalk 7.3; es_PR;)",
|
|
"browser": {
|
|
"name": "Flock",
|
|
"version": "2.16",
|
|
"major": "2"
|
|
},
|
|
"cpu": {},
|
|
"device": {},
|
|
"engine": {},
|
|
"os": {
|
|
"name": "Zenwalk",
|
|
"version": "7.3"
|
|
}
|
|
}
|
|
]
|
|
"
|
|
|
|
# let's save the result into a log file:
|
|
$ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt
|
|
</code></pre>
|
|
|
|
<a href="https://docs.uaparser.dev/intro/quick-start/using-cli.html" class="ui large violet button"><i class="external alternate icon"></i>READ THE DOCS</a>
|
|
</div>
|
|
</div>
|
|
<div class="ui horizontal divider">
|
|
FEATURES: WHEN LESS IS MORE
|
|
</div>
|
|
<div class="ui tall stacked segment">
|
|
<div class="ui equal width stackable grid">
|
|
<div class="row">
|
|
<div class="column">
|
|
<div class="ui basic segment">
|
|
<h3 class="ui header">
|
|
<i class="filter icon"></i>
|
|
<div class="content">Extract Only What's Valuable</div>
|
|
</h3>
|
|
<p>{UAParser.js} filters the noise away and only extracts the most meaningful data in a well-structured format.</p>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui basic segment">
|
|
<h3 class="ui header">
|
|
<i class="paper plane icon"></i>
|
|
<div class="content">Relatively Small Footprint</div>
|
|
</h3>
|
|
<p>While {UAParser.js} covers a vast range of detection, on the other hand its size is always kept to be as light as possible.</p>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui basic segment">
|
|
<h3 class="ui header">
|
|
<i class="js square icon"></i>
|
|
<div class="content">
|
|
Zero-deps Vanilla JS
|
|
</div>
|
|
</h3>
|
|
<p>No dependencies, bloated framework, unnecessary boilerplate, transpiler, or large-sized files required.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<div class="ui basic segment">
|
|
<h3 class="ui header">
|
|
<i class="github icon"></i>
|
|
<div class="content">
|
|
100% Free & Open Source
|
|
</div>
|
|
</h3>
|
|
<p>{UAParser.js} is free to use & modify at no charge. PRO licenses also available if you need a non-free license.</p>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui basic segment">
|
|
<h3 class="ui header">
|
|
<i class="keyboard icon"></i>
|
|
<div class="content">
|
|
Best Developer Experience
|
|
</div>
|
|
</h3>
|
|
<p>{UAParser.js} generates a plugin for jQuery user, and provides predefined type for TypeScript user.</p>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui basic segment">
|
|
<h3 class="ui header">
|
|
<i class="npm icon"></i>
|
|
<div class="content">Client-side & Server-side</div>
|
|
</h3>
|
|
<p>{UAParser.js} is an isomorphic JavaScript library that's able to run either in browser or node.js environment.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ui horizontal divider">
|
|
TESTIMONIALS : LOVED BY DEVELOPERS
|
|
</div>
|
|
<div class="ui tall stacked segment">
|
|
<div class="ui equal width stackable divided grid">
|
|
<div class="row">
|
|
<div class="column">
|
|
<div class="ui basic segment">
|
|
<div class="ui items">
|
|
<div class="item">
|
|
<div class="content">
|
|
<span class="header">Great Utility!</span>
|
|
<div class="extra">
|
|
<div class="ui star rating" data-rating="5" data-max-rating="5"></div>
|
|
5/5
|
|
</div>
|
|
<div class="description">
|
|
<p class="code"><em>"A great utility library to have when you're
|
|
investigating what kind of users are visiting your website and
|
|
how you can improve their UX. Supports most browsers out
|
|
there."</em></p>
|
|
<p><strong>Gabrijel Golubić</strong> - Frontend Web Developer</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="ui basic segment">
|
|
<div class="ui relaxed divided items">
|
|
<div class="item">
|
|
<div class="content">
|
|
<span class="header">Totally Rocks!</span>
|
|
<div class="description">
|
|
<p class="code"><em>"I've been using your library for a long time and it
|
|
totally rocks!"</em>.</p>
|
|
<p><strong>Christian Rich</strong> - Web Developer</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="item">
|
|
<div class="content">
|
|
<span class="header">Very Useful!</span>
|
|
<div class="description">
|
|
<p class="code"><em>"Thank you for putting out this very useful
|
|
library!"</em>.</p>
|
|
<p><strong>Anuj Nijhawan</strong> - Web Developer</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ui horizontal divider">
|
|
SHOWCASES : TRUSTED BY TOP COMPANIES
|
|
</div>
|
|
<div class="ui tall stacked segment" id="showcase">
|
|
<div class="ui basic centered segment">
|
|
<h2 class="ui dividing header">Who's Using {UAParser.js} ?<div class="sub header">Showcasing some
|
|
companies that are using our library</div>
|
|
</h2>
|
|
</div>
|
|
<div class="ui basic centered segment">
|
|
<div class="ui equal width stackable grid"">
|
|
<div class=" row">
|
|
<div class="column">
|
|
<img alt="Microsoft logo" src="images/companies/microsoft.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://opensource.microsoft.com/thanks/" target="_blank"
|
|
class="ui green button"><i class="windows icon"></i>Website</a>
|
|
<a href="https://github.com/microsoft/accessibility-insights-web" target="_blank"
|
|
class="ui blue button"><i class="search plus icon"></i>Accessibility
|
|
Insights</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Amazon logo" src="images/companies/amazon.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon buttons">
|
|
<a href="https://www.amazon.com/gp/help/customer/display.html?nodeId=200309690"
|
|
target="_blank" class="ui orange button"><i class="amazon icon"></i>Kindle for
|
|
iOS / Android</a>
|
|
<a href="https://github.com/aws/amazon-chime-sdk-js" target="_blank"
|
|
class="ui black button"><i class="amazon icon"></i>Amazon Chime SDK for
|
|
JavaScript</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Facebook logo" src="images/companies/facebook.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/facebook/fbjs/tree/fbjs-v2.0.0/packages/fbjs"
|
|
target="_blank" class="ui blue button"><i class="facebook icon"></i>Facebook /
|
|
FBJS</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Instagram logo" src="images/companies/instagram.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.instagram.com" target="_blank" class="ui pink button"><i
|
|
class="instagram icon"></i>Web-based Instagram</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="WhatsApp logo" src="images/companies/whatsapp.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://web.whatsapp.com" target="_blank" class="ui green button"><i
|
|
class="whatsapp icon"></i>Web-based WhatsApp</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Slack logo" src="images/companies/slack.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://slack.com/libs/desktop" target="_blank" class="ui red button"><i
|
|
class="slack hash icon"></i>Web-based App</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="Google logo" src="images/companies/google.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/google/tachometer" target="_blank"
|
|
class="ui green button"><i class="thermometer icon"></i>Tachometer</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="HTTPToolkit logo" src="images/companies/httptoolkit.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon buttons">
|
|
<a href="https://httptoolkit.com/" target="_blank" class="ui red button"><i
|
|
class="code icon"></i>HTTP Toolkit UI</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="AliExpress logo" src="images/companies/aliexpress.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.aliexpress.com" target="_blank" class="ui orange button"><i
|
|
class="cart icon"></i>AliExpress Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Vercel logo" src="images/companies/vercel.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/vercel/next.js" target="_blank"
|
|
class="ui black button"><i class="react icon"></i>Next.js</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Gitpod logo" src="images/companies/gitpod.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://gitpod.io" target="_blank" class="ui teal button"><i
|
|
class="cube icon"></i>Web-based App</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Apple logo" src="images/companies/apple.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://music.apple.com/" target="_blank" class="ui black button"><i
|
|
class="music icon"></i>Apple Music Website</a>
|
|
<a href="https://tv.apple.com/" target="_blank" class="ui grey button"><i
|
|
class="tv icon"></i>Apple TV Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="Discord logo" src="images/companies/discord.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://discord.com/acknowledgements" target="_blank"
|
|
class="ui purple button"><i class="discord icon"></i>Web-based App</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Mozilla logo" src="images/companies/mozilla.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/mozilla/addons-frontend/tree/2019.06.06" target="_blank"
|
|
class="ui orange button"><i class="firefox icon"></i>Add-on Frontend</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Automattic logo" src="images/companies/automattic.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/Automattic/wp-calypso/tree/v6.12.0/client"
|
|
target="_blank" class="ui blue button"><i
|
|
class="wordpress icon"></i>WP-Calypso</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Shopify logo" src="images/companies/shopify.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/Shopify/quilt/tree/%40shopify/react-form%400.12.0/packages/browser"
|
|
target="_blank" class="ui green button"><i
|
|
class="shopping cart icon"></i>Browser Sniffer</a>
|
|
<a href="https://github.com/Shopify/blockchain-components/tree/main/packages/connect-wallet"
|
|
target="_blank" class="ui orange button"><i class="bitcoin icon"></i>Blockchain
|
|
Components</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Amplitude logo" src="images/companies/amplitude.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/amplitude/Amplitude-JavaScript" target="_blank"
|
|
class="ui blue button"><i class="github icon"></i>JavaScript SDK</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="LINE logo" src="images/companies/line.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://line.me" target="_blank" class="ui green button"><i
|
|
class="chat icon"></i>LINE Messenger</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="Electron logo" src="images/companies/electron.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.electronjs.org/" target="_blank" class="ui green button"><i
|
|
class="react icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="LiveChat logo" src="images/companies/livechat.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/livechat/emoji-keyboard" target="_blank"
|
|
class="ui orange button"><i class="chat icon"></i>Emoji Keyboard</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="RocketChat logo" src="images/companies/rocket.chat.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/RocketChat/Rocket.Chat/tree/3.12.1" target="_blank"
|
|
class="ui red button"><i class="rocketchat icon"></i>Rocket.Chat</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="8th Wall logo" src="images/companies/8thwall.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="http://www.8thwall.com/" target="_blank" class="ui violet button"><i
|
|
class="eye icon"></i>Web AR</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="CircleCI logo" src="images/companies/circleci.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://circleci.com/docs/enterprise/open-source/" target="_blank"
|
|
class="ui black button"><i class="osi icon"></i>CircleCI Enterprise</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Salesforce logo" src="images/companies/salesforce.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/SalesforceCommerceCloud/pwa-kit" target="_blank"
|
|
class="ui teal button"><i class="cube icon"></i>PWA Kit</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="ProtonMail logo" src="images/companies/protonmail.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/ProtonMail/WebClient/" target="_blank"
|
|
class="ui violet button"><i class="mail icon"></i>WebClient</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="AutoDesk logo" src="images/companies/autodesk.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.autodesk.com/company/legal-notices-trademarks/autodesk-desktop-platform-components/2021"
|
|
target="_blank" class="ui blue button"><i class="desktop icon"></i>Desktop
|
|
Platform</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Confluent logo" src="images/companies/confluent.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.confluent.io/third_party_software_CP_v5_0/" target="_blank"
|
|
class="ui blue button"><i class="cube icon"></i>Confluent Platform</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Elastic logo" src="images/companies/elastic.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.elastic.co/guide/en/cloud-enterprise/current/ece-dependencies.html"
|
|
target="_blank" class="ui orange button"><i class="cloud icon"></i>Cloud
|
|
Enterprise</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Optimizely logo" src="images/companies/optimizely.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/optimizely/ua-parser-js" target="_blank"
|
|
class="ui blue button"><i class="circle outline icon"></i>Platform</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Reddit logo" src="images/companies/reddit.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://reddit.com/" target="_blank" class="ui orange button"><i
|
|
class="reddit icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="Scribd logo" src="images/companies/scribd.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.scribd.com/" target="_blank" class="ui green button"><i
|
|
class="scribd icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Zendesk logo" src="images/companies/zendesk.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.zendesk.com/" target="_blank" class="ui green button"><i
|
|
class="life ring icon"></i>Support Desk</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Imgur logo" src="images/companies/imgur.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://imgur.com/" target="_blank" class="ui black button"><i
|
|
class="file image icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Vimeo logo" src="images/companies/vimeo.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://vimeo.com/" target="_blank" class="ui teal button"><i
|
|
class="vimeo v icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Tumblr logo" src="images/companies/tumblr.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.tumblr.com/policy/en/web-credits" target="_blank"
|
|
class="ui teal button"><i class="tumblr icon"></i>Web & Mobile App</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Pinterest logo" src="images/companies/pinterest.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.pinterest.com/" target="_blank" class="ui red button"><i
|
|
class="pinterest icon"></i>Website</a>
|
|
<a href="https://github.com/pinterest/gestalt" target="_blank"
|
|
class="ui black button"><i class="paint brush icon"></i>Gestalt</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="Zoho logo" src="images/companies/zoho.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://mail.zoho.com" target="_blank" class="ui black button"><i
|
|
class="envelope icon"></i>Zoho Mail</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Snapchat logo" src="images/companies/snapchat.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.snapchat.com/" target="_blank" class="ui blue button"><i
|
|
class="snapchat ghost icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Udemy logo" src="images/companies/udemy.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.udemy.com/" target="_blank" class="ui orange button"><i
|
|
class="bullhorn icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Linktree logo" src="images/companies/linktree.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://linktr.ee/" target="_blank" class="ui teal button"><i
|
|
class="tree icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Blinkist logo" src="images/companies/blinkist.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.blinkist.com/" target="_blank" class="ui green button"><i
|
|
class="book icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Notion logo" src="images/companies/notion.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.notion.so/" target="_blank" class="ui blue button"><i
|
|
class="archive icon"></i>Web-based App</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="Uber logo" src="images/companies/uber.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.uber.com/a/join-new" target="_blank" class="ui black button"><i
|
|
class="car icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Disney logo" src="images/companies/disney.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.disneyplus.com" target="_blank" class="ui blue button"><i
|
|
class="tv icon"></i>Disney+ Website</a>
|
|
<a href="https://www.nationalgeographic.com/" target="_blank"
|
|
class="ui yellow button"><i class="square outline icon"></i>National Geographic
|
|
Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Livescore logo" src="images/companies/livescore.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.livescore.com/" target="_blank" class="ui orange button"><i
|
|
class="futbol outline icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Freelancer logo" src="images/companies/freelancer.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.freelancer.com/" target="_blank" class="ui teal button"><i
|
|
class="paper plane icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Instacart logo" src="images/companies/instacart.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.instacart.com/" target="_blank" class="ui green button"><i
|
|
class="shopping cart icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Expedia logo" src="images/companies/expedia.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.expedia.com/" target="_blank" class="ui blue button"><i
|
|
class="fighter jet icon"></i>Web-based App</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="OLX logo" src="images/companies/olx.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.olx.com/" target="_blank" class="ui blue button"><i
|
|
class="circle outline icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Grab logo" src="images/companies/grab.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://food.grab.com" target="_blank" class="ui green button"><i
|
|
class="utensils icon"></i>GrabFood Web</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Traveloka logo" src="images/companies/traveloka.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.traveloka.com" target="_blank" class="ui blue button"><i
|
|
class="plane icon"></i>Web-based App</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Shopee logo" src="images/companies/shopee.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://seller.shopee.co.id/" target="_blank" class="ui orange button"><i
|
|
class="shopping bag icon"></i>Seller Center</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Bukalapak logo" src="images/companies/bukalapak.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://bukalapak.com/" target="_blank" class="ui red button"><i
|
|
class="blogger b icon"></i>Web-based App</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Tokopedia logo" src="images/companies/tokopedia.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://tiket.tokopedia.com/" target="_blank" class="ui green button"><i
|
|
class="briefcase icon"></i>Ticket & Travel Page</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="JetBrains logo" src="images/companies/jetbrains.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.jetbrains.com/help/hub/third-party-software.html"
|
|
target="_blank" class="ui yellow button"><i class="cube icon"></i>Hub</a>
|
|
<a href="https://www.jetbrains.com/idea/download/" target="_blank"
|
|
class="ui pink button"><i class="cube icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Here logo" src="images/companies/here.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://github.com/heremaps/harp.gl/tree/master/%40here/harp-test-utils"
|
|
target="_blank" class="ui teal button"><i
|
|
class="map marker alternate icon"></i>Harp.gl</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Postman logo" src="images/companies/postman.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.postman.com/explore" target="_blank"
|
|
class="ui orange button"><i class="fighter jet icon"></i>Website</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Intuit logo" src="images/companies/intuit.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://myturbotax.intuit.com/" target="_blank" class="ui blue button"><i
|
|
class="user icon"></i>Web & Mobile Platform</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Neo4j logo" src="images/companies/neo4j.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://neo4j.com/terms/thirdpartylicenses/bloom/" target="_blank"
|
|
class="ui blue button"><i class="spinner icon"></i>Neo4j Bloom</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Mongodb logo" src="images/companies/mongodb.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://docs.mongodb.com/charts/master/third-party-licenses/"
|
|
target="_blank" class="ui green button"><i class="leaf icon"></i>MongoDB
|
|
Charts</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="column">
|
|
<img alt="Dell logo" src="images/companies/dell.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://cloud.ibm.com/media/docs/downloads/oss-licensing-info/IBMCloud-DeveloperConsole-OSS-Licenses.txt"
|
|
target="_blank" class="ui blue button"><i class="hdd icon"></i>EMC
|
|
PowerStore</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="IBM logo" src="images/companies/ibm.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://cloud.ibm.com/media/docs/downloads/oss-licensing-info/IBMCloud-DeveloperConsole-OSS-Licenses.txt"
|
|
target="_blank" class="ui grey button"><i class="desktop icon"></i>Developer
|
|
Console</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Oracle logo" src="images/companies/oracle.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://docs.oracle.com/cloud/latest/netsuitecs_gs/NSLIU/NSLIU.pdf"
|
|
target="_blank" class="ui red button"><i class="database icon"></i>Oracle
|
|
NetSuite</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Siemens logo" src="images/companies/siemens.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://premiumservices.siemens.com/assets/ReadMe_OSS.html" target="_blank"
|
|
class="ui teal button"><i class="stethoscope icon"></i>Premium Services</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="HPE logo" src="images/companies/hpe.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.hpe.com/content/dam/hpe/download/pdf/Software/HPE%20OVGD%20v1.40%20ALA.pdf"
|
|
target="_blank" class="ui green button"><i
|
|
class="square outline icon"></i>OneView Global Dashboard</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<img alt="Verizon logo" src="images/companies/verizon.png" />
|
|
<div class="ui popup">
|
|
<div class="ui labeled icon small buttons">
|
|
<a href="https://www.verizon.com/supportresources/content/dam/verizon/support/consumer/documents/ftw-open-source-licenses190228.pdf"
|
|
target="_blank" class="ui red button"><i class="tv icon"></i>Fios TV</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ui horizontal divider">
|
|
DOWNLOADS : CHOOSE YOUR PACKAGE
|
|
</div>
|
|
<div class="ui tall stacked segment" id="download">
|
|
<div class="ui basic centered segment">
|
|
<h2 class="ui dividing header">Package Options<div class="sub header">Comparison between our regular open-source & PRO licenses</div>
|
|
</h2>
|
|
<table class="ui center aligned collapsing celled unstackable table">
|
|
<thead>
|
|
<tr>
|
|
<th class="left aligned"></th>
|
|
<th colspan="2">Open-Source Editions</th>
|
|
<th colspan="3">Commercial Editions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="left aligned">License</td>
|
|
<td>MIT</td>
|
|
<td>AGPL</td>
|
|
<td>PRO Personal</td>
|
|
<td>PRO Business</td>
|
|
<td>PRO Enterprise</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Browser detection</td>
|
|
<td class="warning" data-tooltip="Basic detection" data-inverted=""><i class="large yellow circle exclamation icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">CPU detection</td>
|
|
<td class="warning" data-tooltip="Basic detection" data-inverted=""><i class="large yellow circle exclamation icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Device detection</td>
|
|
<td class="warning" data-tooltip="Basic detection" data-inverted=""><i class="large yellow circle exclamation icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Engine detection</td>
|
|
<td class="warning" data-tooltip="Basic detection" data-inverted=""><i class="large yellow circle exclamation icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">OS detection</td>
|
|
<td class="warning" data-tooltip="Basic detection" data-inverted=""><i class="large yellow circle exclamation icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Enhanced detection</td>
|
|
<td class="negative"><i class="large red minus circle icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Client Hints support</td>
|
|
<td class="negative"><i class="large red minus circle icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Extras (Apps, Bots, Libs, Emails, Media Players, etc)</td>
|
|
<td class="negative"><i class="large red minus circle icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">CommonJS support</td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">ES modules support</td>
|
|
<td class="negative"><i class="large red minus circle icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">TypeScript declarations available</td>
|
|
<td class="warning" data-tooltip="Community version" data-inverted=""><i class="large yellow circle exclamation icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Public npm module available</td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Direct downloads available</td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Allowed for commercial use</td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="negative" data-tooltip="Non-commercial use only (personal/educational/non-profit/etc)" data-inverted=""><i class="large red minus circle icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Permissive license</td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="negative" data-tooltip="Copyleft license" data-inverted=""><i class="large red minus circle icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Unlimited use per 1 license</td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="negative" data-tooltip="1 project per 1 license" data-inverted=""><i class="large red minus circle icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">1-year limited support</td>
|
|
<td class="negative"><i class="large red minus circle icon"></i></td>
|
|
<td class="negative"><i class="large red minus circle icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Lifetime updates</td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
<td class="positive"><i class="large green checkmark icon"></i></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left aligned">Price</td>
|
|
<td data-tooltip="Pay as you want" data-inverted="">FREE</td>
|
|
<td data-tooltip="Pay as you want" data-inverted="">FREE</td>
|
|
<td data-tooltip="$12 (one-time fee)" data-inverted="">$12</td>
|
|
<td data-tooltip="$25 (one-time fee)" data-inverted="">$25</td>
|
|
<td data-tooltip="$500 (one-time fee)" data-inverted="">$500</td>
|
|
</tr>
|
|
</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<th class="right aligned" colspan="6">
|
|
<a target="_blank" class="ui icon right labeled violet large button" href="https://store.faisalman.com/checkout/buy/e236ea87-9b2b-400e-9683-24367f731b35">GET THE PACKAGE <i class="icon arrow circle right"></i></a>
|
|
</th>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="ui horizontal divider">
|
|
CONTRIBUTORS : SUPPORTED BY THE AMAZING OPEN-SOURCE COMMUNITIES
|
|
</div>
|
|
<div class="ui tall stacked segment" id="contributors">
|
|
<div class="ui basic centered segment">
|
|
<h2 class="ui dividing header">Contributors <div class="sub header">Those who collaborate and
|
|
continuously improve this library to be awesome</div>
|
|
</h2>
|
|
<a href="https://github.com/faisalman/ua-parser-js/graphs/contributors"><img alt="contributor photos" class="ui centered image"
|
|
src="https://opencollective.com/ua-parser-js/contributors.svg?avatarHeight=64&width=640" /></a>
|
|
</div>
|
|
<div class="ui basic centered segment">
|
|
<h2 class="ui dividing header">Backers & Sponsors <div class="sub header">Those who give back and get
|
|
the value from using this library</div>
|
|
</h2>
|
|
<div class="description">
|
|
<a href="https://opencollective.com/ua-parser-js"><img alt="organization backer photos" class="ui centered image"
|
|
src="https://opencollective.com/ua-parser-js/organizations.svg?avatarHeight=128" />
|
|
<img alt="individual backer photos" class="ui centered image"
|
|
src="https://opencollective.com/ua-parser-js/individuals.svg?avatarHeight=128" /></a>
|
|
</div>
|
|
</div>
|
|
<div class="ui basic left aligned segment">
|
|
<h3 class="ui dividing header">Contribute to UAParser.js<div class="sub header">It's free to use, but
|
|
feel free to contribute if you find it helpful</div>
|
|
</h3>
|
|
<a href="https://opencollective.com/ua-parser-js/donate?interval=oneTime"
|
|
class="ui labeled icon black button">
|
|
<i class="dollar sign icon"></i>ONE-TIME SPONSOR</a>
|
|
<a href="https://opencollective.com/ua-parser-js/donate?interval=month"
|
|
class="ui labeled icon black button">
|
|
<i class="sync icon"></i>MONTHLY SPONSOR</a>
|
|
<a href="https://github.com/sponsors/faisalman" class="ui labeled icon black button">
|
|
<i class="github alternate icon"></i>GITHUB SPONSOR</a>
|
|
</div>
|
|
</div>
|
|
<div class="ui hidden divider">
|
|
</div>
|
|
</div>
|
|
<div class="ui instagram inverted vertical footer segment">
|
|
<div class="ui text container">
|
|
<div class="ui stackable inverted divided equal height stackable grid">
|
|
<div class="five wide column">
|
|
<div class="ui basic right aligned segment">
|
|
<img alt="UAParser.js logo transparent" class="ui centered small image" src="images/uap-logo-transparent.png">
|
|
</div>
|
|
</div>
|
|
<div class="eleven wide column">
|
|
<div class="ui basic right aligned segment">
|
|
<div class="ui inverted link animated selection horizontal list">
|
|
<a target="_blank" class="item" href="https://github.com/faisalman/ua-parser-js"><img
|
|
alt="GitHub stars badge" src="https://img.shields.io/github/stars/faisalman/ua-parser-js?color=yellow&logo=github&style=for-the-badge"></a>
|
|
<a target="_blank" class="item" href="https://www.npmjs.com/package/ua-parser-js"><img
|
|
alt="NPM downloads badge" src="https://img.shields.io/npm/dm/ua-parser-js?color=red&logo=npm&label=NPM%20DOWNLOADS&style=for-the-badge"></a>
|
|
<a target="_blank" class="item" href="https://www.npmjs.com/package/ua-parser-js"><img
|
|
alt="NPM latest version badge" src="https://img.shields.io/npm/v/ua-parser-js.svg?logo=npm&color=red&style=for-the-badge"></a>
|
|
<a target="_blank" class="item"
|
|
href="https://www.jsdelivr.com/package/npm/ua-parser-js"><img
|
|
alt="Jsdelivr badge" src="https://img.shields.io/jsdelivr/npm/hm/ua-parser-js?logo=jsdelivr&style=for-the-badge"></a>
|
|
<a target="_blank" class="item" href="https://bundlephobia.com/package/ua-parser-js"><img
|
|
alt="Bundlephobia badge" src="https://img.shields.io/bundlephobia/minzip/ua-parser-js?logo=hackthebox&logoColor=white&style=for-the-badge" /></a>
|
|
<a target="_blank" class="item"
|
|
href="https://github.com/faisalman/ua-parser-js/graphs/contributors"><img
|
|
alt="GitHub sponsors badge" src="https://img.shields.io/github/contributors/faisalman/ua-parser-js?color=purple&logo=githubsponsors&style=for-the-badge"></a>
|
|
<a target="_blank" class="item" href="https://cdnjs.com/libraries/UAParser.js"><img
|
|
alt="CDNJS badge" src="https://img.shields.io/cdnjs/v/UAParser.js.svg?color=orange&style=for-the-badge"></a>
|
|
<a href="https://opencollective.com/ua-parser-js" target="_blank" class="item"><img
|
|
alt="OpenCollective badge"
|
|
src="https://img.shields.io/opencollective/all/ua-parser-js?color=teal&style=for-the-badge"></a>
|
|
<a href="https://github.com/faisalman/ua-parser-js" target="_blank" class="item">
|
|
<img alt="OSSF Scorecard badge" src="https://img.shields.io/ossf-scorecard/github.com/faisalman/ua-parser-js?label=openssf%20scorecard&style=for-the-badge"></a>
|
|
<iframe src="https://github.com/sponsors/faisalman/button" title="Github Sponsor"
|
|
height="32" width="114" style="border: 0; border-radius: 6px;"></iframe>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ui right aligned basic segment">
|
|
<p>UAParser.js is licensed under MIT, AGPLv3 & PRO licenses. Copyright (c) 2012-2024 Faisal Salman.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ui mini modal">
|
|
<div class="header">Success</div>
|
|
<div class="content">
|
|
<p>Copied!</p>
|
|
<p></p>
|
|
</div>
|
|
<div class="actions">
|
|
<div class="ui ok green button">OK</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |