ua-parser-js
UAParser.js - The Essential Web Development Tool for User-Agent Detection.
Top Related Projects
The Universal Device Detection library will parse any User Agent and detect the browser, operating system, device used (desktop, tablet, mobile, tv, cars, console, etc.), brand and model.
Browser sniffing gone too far — A useragent parser library for PHP
A multi-language port of Browserscope's user agent parser.
Quick Overview
UA-Parser.js is a lightweight JavaScript library for parsing user agent strings. It provides detailed information about the browser, operating system, and device from a given user agent string. This library is useful for web developers and analysts who need to understand and categorize their users' browsing environments.
Pros
- Lightweight and fast, with no dependencies
- Supports both browser and Node.js environments
- Regularly updated with new user agent patterns
- Extensive test coverage and community support
Cons
- May not always be 100% accurate due to the ever-changing nature of user agent strings
- Requires manual updates to keep up with new browser and device releases
- Limited information for less common or older devices and browsers
Code Examples
Parsing a user agent string:
const parser = new UAParser();
const result = parser.setUA('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36').getResult();
console.log(result);
Getting specific information:
const parser = new UAParser();
console.log(parser.getBrowser());
console.log(parser.getOS());
console.log(parser.getDevice());
Using custom regular expressions:
const parser = new UAParser();
parser.setUA('Mozilla/5.0 MyCustomAgent/1.0');
parser.browser.set('MyBrowser', 'MyBrowser', '1.0');
console.log(parser.getBrowser());
Getting Started
-
Install the library:
npm install ua-parser-js
-
Import and use in your project:
import UAParser from 'ua-parser-js'; const parser = new UAParser(); const result = parser.getResult(); console.log(result);
-
For browser usage, include the script in your HTML:
<script src="https://cdnjs.cloudflare.com/ajax/libs/UAParser.js/1.0.2/ua-parser.min.js"></script> <script> var parser = new UAParser(); var result = parser.getResult(); console.log(result); </script>
Competitor Comparisons
The Universal Device Detection library will parse any User Agent and detect the browser, operating system, device used (desktop, tablet, mobile, tv, cars, console, etc.), brand and model.
Pros of device-detector
- More comprehensive device detection, including operating systems, browsers, and bots
- Regularly updated database of user agents and device information
- Supports multiple programming languages through various implementations
Cons of device-detector
- Larger file size and potentially higher memory usage due to extensive database
- May have a steeper learning curve for basic use cases
- Requires more frequent updates to maintain accuracy
Code Comparison
device-detector:
$dd = new DeviceDetector($userAgent);
$dd->parse();
$clientInfo = $dd->getClient();
$osInfo = $dd->getOs();
$device = $dd->getDeviceName();
ua-parser-js:
var parser = new UAParser();
var result = parser.setUA(userAgent).getResult();
var browser = result.browser;
var os = result.os;
var device = result.device;
Both libraries offer similar functionality for parsing user agent strings, but device-detector provides more detailed information and supports a wider range of devices and platforms. ua-parser-js is more lightweight and easier to integrate for simple use cases, while device-detector offers more comprehensive detection capabilities at the cost of increased complexity and resource usage.
Browser sniffing gone too far — A useragent parser library for PHP
Pros of Parser-PHP
- More comprehensive device and browser detection
- Regularly updated with new user agent patterns
- Supports server-side PHP environments
Cons of Parser-PHP
- Slower parsing speed compared to ua-parser-js
- Larger file size and memory footprint
- Limited to PHP environments, less versatile across platforms
Code Comparison
Parser-PHP:
$result = new WhichBrowser\Parser($_SERVER['HTTP_USER_AGENT']);
echo "You are using " . $result->browser->name . " " . $result->browser->version->toString() . " on " . $result->os->name . ".";
ua-parser-js:
var parser = new UAParser();
var result = parser.getResult();
console.log("You are using " + result.browser.name + " " + result.browser.version + " on " + result.os.name + ".");
Both libraries aim to parse user agent strings, but Parser-PHP offers more detailed detection at the cost of performance and versatility. ua-parser-js is lightweight and fast, suitable for client-side parsing in JavaScript environments. The choice between them depends on the specific requirements of your project, such as the need for detailed device information or cross-platform compatibility.
A multi-language port of Browserscope's user agent parser.
Pros of ua-parser
- Multi-language support (Java, Python, PHP, etc.)
- More comprehensive device detection
- Larger community and more frequent updates
Cons of ua-parser
- Larger file size and potentially slower performance
- More complex setup and integration
- Less focused on JavaScript/browser environments
Code Comparison
ua-parser-js:
var parser = new UAParser();
var result = parser.getResult();
console.log(result.browser.name, result.browser.version);
ua-parser:
var parser = new UAParser();
var ua = parser.parse(navigator.userAgent);
console.log(ua.family, ua.major + '.' + ua.minor + '.' + ua.patch);
Key Differences
- ua-parser-js is specifically designed for JavaScript environments, while ua-parser supports multiple programming languages.
- ua-parser-js offers a simpler API and is more lightweight, making it easier to integrate into web projects.
- ua-parser provides more detailed device information but may require additional setup for JavaScript use.
- ua-parser-js has a more active JavaScript-focused community, while ua-parser has a broader, multi-language user base.
- Performance may vary, with ua-parser-js potentially being faster for JavaScript-only applications.
When choosing between the two, consider your specific use case, language requirements, and the level of detail needed in user agent parsing.
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
UAParser.js
The most comprehensive, compact, & up-to-date isomorphic JavaScript library to detect user's Browser, Engine, OS, CPU, and Device type/model. Runs either in browser (client-side) or node.js (server-side).
Overview
import { UAParser } from 'ua-parser-js';
// 1. Problem:
// Imagine getting this wild user-agent string from a visitor:
const ua = `Mozilla/5.0 (Linux; Android 10; STK-LX1
Build/HONORSTK-LX1; wv) AppleWebKit/537.36 (KHTML,
like Gecko) Version/4.0 Chrome/110.0.5481.153 Mobile
Safari/537.36 musical_ly_2022803040 JsSdk/1.0
NetType/WIFI Channel/huaweiadsglobal_int
AppName/musical_ly app_version/28.3.4 ByteLocale/en
ByteFullLocale/en Region/IQ Spark/1.2.7-alpha.8
AppVersion/28.3.4 PIA/1.5.11 BytedanceWebview/d8a21c6`;
// Note: this is a real user-agent (what???)
// 2. Solution:
// Just pass the complex user-agent string to `UAParser`
const parser = new UAParser(ua);
// 3. Result:
// And voila!
console.log(parser.getBrowser());
// { name : "TikTok", version : "28.3.4", major : "28", type: undefined }
console.log(parser.getCPU());
// { architecture : undefined }
console.log(parser.getEngine());
// { name : "Blink", version : "110.0.5481.153" }
console.log(parser.getDevice());
// { type : "mobile", vendor : "Huawei", model : "STK-LX1" }
console.log(parser.getOS());
// { name : "Android", version : "10" }
console.log(parser.getResult());
/*
{
ua: "Mozilla/5.0 (Linux; Android 10; STK-LX1 Build/HONORSTK-LX1; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/110.0.5481.153 Mobile Safari/537.36 musical_ly_2022803040 JsSdk/1.0 NetType/WIFI Channel/huaweiadsglobal_int AppName/musical_ly app_version/28.3.4 ByteLocale/en ByteFullLocale/en Region/IQ Spark/1.2.7-alpha.8 AppVersion/28.3.4 PIA/1.5.11 BytedanceWebview/d8a21c6",
browser: {
name: "TikTok",
version: "28.3.4",
major: "28"
},
cpu: {},
device: {
type: "mobile",
model: "STK-LX1",
vendor: "Huawei"
},
engine: {
name: "Blink",
version: "110.0.5481.153"
},
os: {
name: "Android",
version: "10"
}
}
*/
// 4. Conclusion:
// The visitor is browsing from a TikTok app using an Android-powered Huawei device
// Phew! Thanks, UAParser.js!
- Live demo: https://uaparser.dev
Documentation
- v1.0: https://github.com/faisalman/ua-parser-js/tree/1.0.38#documentation
- v2.0: https://docs.uaparser.dev
Before upgrading from v0.7
/ v1.0
, please read CHANGELOG to
see what's new & breaking.
License Options
Open-Source Editions | PRO / Commercial Editions | ||||
---|---|---|---|---|---|
License options | MIT (v1.x) | AGPL (v2.x) | PRO Personal | PRO Business | PRO Enterprise |
Browser detection | â ï¸ | â | â | â | â |
CPU detection | â ï¸ | â | â | â | â |
Device detection | â ï¸ | â | â | â | â |
Engine detection | â ï¸ | â | â | â | â |
OS detection | â ï¸ | â | â | â | â |
Enhanced detection | âï¸ | â | â | â | â |
Client Hints support | âï¸ | â | â | â | â |
Extras (Apps, Bots, Libs, Emails, Media Players, etc) | âï¸ | â | â | â | â |
CommonJS support | â | â | â | â | â |
ES modules support | âï¸ | â | â | â | â |
npm module available | â | â | â | â | â |
TypeScript declarations available | â ï¸ | â | â | â | â |
Allowed for commercial use | â | â | âï¸ | â | â |
Permissive (non-copyleft) license | â | âï¸ | â | â | â |
Unlimited use per 1 license | â | â | â | â ï¸ | â |
1-year support | âï¸ | âï¸ | â | â | â |
Lifetime updates | â | â | â | â | â |
Price | FREE (License) | FREE (License) | $12 (License) | $25 (License) | $500 (License) |
GET THE PRO PACKAGES ð¥ |
Development
Contributors
Please read CONTRIBUTING guide first for the instruction details.
Made with contributors-img.
Backers & Sponsors
Top Related Projects
The Universal Device Detection library will parse any User Agent and detect the browser, operating system, device used (desktop, tablet, mobile, tv, cars, console, etc.), brand and model.
Browser sniffing gone too far — A useragent parser library for PHP
A multi-language port of Browserscope's user agent parser.
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot