npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

browser-data

v0.2.11

Published

Check browser support for a given CSS property

Downloads

3

Readme

Browser data

Check CSS properties support on major browsers

Usage

var bdata =  require('browser-data')

var browser = {name: "Firefox", version: "3"}
console.log(bdata.getEngine(browser)) // {name: 'Gecko', version: '1.9.1'}

console.log(bdata.browserSupport(browser, "border-radius")) // false
console.log(bdata.browserSupport(browser, "border-color")) // true

Database sources

Support database was built from the MDN CSS reference pages, it is the most complete and reliable source of information I've found. Mozilla is working on a project which will give access to this data with an API, no release date have been specified. In the meantime the data is gathered by scrapping the web pages, which unfortunately are not standardized and not complete (this is a collective effort, don't hesitate to contribute to the documentation on MDN Developper Network).

Rebuilding the database

make supportdb

Generates db/mdnDb.json with the following structure :

{
":active":{
  "n":":active",
  "t":[
    "CSS Pseudo-class",
    "Layout"
  ],
  "c":{
    "bs":{
      "c":[
        {"p":"","v":"1.0"}
      ],
      "f":[
        {"p":"","v":"1.0 (1.7 or earlier)"}
      ]
    }
  }
}
}

Main Object has CSS properties as key names

Property object :

  • 'n' (name)
  • 't' (tags)
  • 'c' (compatibilities) : object whith compatibilities name as keys ** 'bs' stands for 'Basic support'

Each compatibility line is an object with browser id as keys :

  • 'c' : Chrome
  • 'f' : Firefox
  • 'e' : Internet Explorer Edge
  • 'ie': Internet Explorer
  • 'o' : Opera
  • 's' : Safari
  • 'a' : Android
  • 'aw': Android Webview
  • 'fo': Firefox OS
  • 'fm': Firefox Mobile
  • 'iem': Internet Explorer Mobile
  • 'om' : Opera Mobile
  • 'sm' : Safari Mobile
  • 'cm' : Chrome for Android

Each browser object is an array of prefix / version tuples :

  • 'p' : prefix
  • 'v' : version

Alternate source

Support database was built from the wikipedia page https://en.wikipedia.org/w/index.php?title=Comparison_of_layout_engines_%28Cascading_Style_Sheets%29 (see tools/wikipediaScraper.js)

Browsers / engines versions matches comes from these sources :

  • Firefox: https://developer.mozilla.org/en-US/docs/Mozilla/Gecko/Versions
  • Safari: https://en.wikipedia.org/wiki/Safari_version_history
  • Android: https://decadecity.net/blog/2013/11/21/android-browser-versions
  • Chrome: http://www.useragentstring.com/pages/Chrome/
  • Opera: http://www.opera.com/docs/history/presto/
  • Internet Explorer: https://en.wikipedia.org/wiki/Trident_%28layout_engine%29#Release_history