or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

index.md
tile.json

tessl/npm-caniuse-db

Raw browser/feature support data from caniuse.com providing comprehensive web technology compatibility information

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/caniuse-db@1.0.x

To install, run

npx @tessl/cli install tessl/npm-caniuse-db@1.0.0

index.mddocs/

caniuse-db

caniuse-db is a comprehensive data package providing raw browser and feature support information from caniuse.com. It serves as a machine-readable database of web technology compatibility across different browsers and versions, containing structured JSON data for CSS, HTML5, JavaScript APIs, and other web technologies with detailed support matrices, usage statistics, and compatibility statuses.

Package Information

  • Package Name: caniuse-db
  • Package Type: npm
  • Language: JavaScript (JSON data files)
  • Installation: npm install caniuse-db
  • License: CC-BY-4.0

Core Imports

This package provides direct access to JSON data files rather than programmatic APIs. Access the data by importing or reading JSON files:

// Import full database (Node.js)
const canIUseData = require("caniuse-db/data.json");
const fullData = require("caniuse-db/fulldata-json/data-2.0.json");

// Import specific feature data
const flexboxData = require("caniuse-db/features-json/flexbox.json");
const cssGridData = require("caniuse-db/features-json/css-grid.json");

ES Modules:

import canIUseData from "caniuse-db/data.json";
import flexboxData from "caniuse-db/features-json/flexbox.json";

Basic Usage

// Read full caniuse database
const data = require("caniuse-db/fulldata-json/data-2.0.json");

// Access browser information
const chromeInfo = data.agents.chrome;
console.log(chromeInfo.browser); // "Chrome"
console.log(chromeInfo.current_version); // "139"

// Access feature support data
const flexboxSupport = data.data.flexbox;
console.log(flexboxSupport.chrome["21"]); // Support status for Chrome 21

// Read individual feature file
const cssGridData = require("caniuse-db/features-json/css-grid.json");
console.log(cssGridData.title); // "CSS Grid Layout (level 1)"
console.log(cssGridData.description); // Feature description
console.log(cssGridData.stats.chrome["57"]); // "y #4" (supported with note)

Capabilities

Full Database Access

Access the complete caniuse database containing all browser agents and feature support data.

// Main database files
"data.json"                    // Backward compatibility alias (4.1MB)
"fulldata-json/data-2.0.json" // Complete database v2.0 format (4.1MB)  
"fulldata-json/data-1.0.json" // Legacy v1.0 format database

interface FullDatabase {
  agents: BrowserAgents;       // Browser information and metadata
  data: FeatureData;           // Feature support matrices
  cats: FeatureCategories;     // Category mappings
  statuses: SpecStatusMap;     // Specification status descriptions
  updated: number;             // Last update timestamp (Unix)
}

interface BrowserAgents {
  [browserId: string]: BrowserInfo;
}

interface FeatureCategories {
  [categoryName: string]: string[];  // Category name to subcategories mapping
}

interface SpecStatusMap {
  rec: "W3C Recommendation";
  pr: "W3C Proposed Recommendation";
  cr: "W3C Candidate Recommendation";
  wd: "W3C Working Draft";
  ls: "WHATWG Living Standard";
  other: "Other";
  unoff: "Unofficial / Note";
}

interface BrowserInfo {
  browser: string;           // Display name (e.g., "Chrome", "Firefox")
  long_name: string;         // Full name (e.g., "Google Chrome")
  abbr: string;             // Abbreviation (e.g., "Chr.", "FF")
  prefix: string;           // CSS prefix (e.g., "webkit", "moz")
  type: "desktop" | "mobile"; // Browser type
  usage_global: { [version: string]: number }; // Global usage percentages
  version_list: BrowserVersion[]; // Version history with release dates
  current_version: string;   // Latest version
  prefix_exceptions?: { [version: string]: string }; // Version-specific prefixes
}

interface BrowserVersion {
  version: string;           // Version number
  global_usage: number;      // Global usage percentage
  release_date: number;      // Unix timestamp
  era: number;              // Release era relative to current
  prefix: string;           // CSS prefix for this version
}

interface FeatureData {
  [featureId: string]: FeatureSupportMatrix;
}

interface FeatureSupportMatrix {
  [browserId: string]: {
    [version: string]: SupportStatus;
  };
}

Individual Feature Data

Access detailed information about specific web technology features.

// Individual feature files
"features-json/[feature-name].json" // 569 individual feature files

interface FeatureInfo {
  title: string;              // Human-readable feature name
  description: string;        // Feature description
  spec: string;              // URL to relevant specification
  status: SpecStatus;        // Specification status
  links: ExternalLink[];     // Related resources
  bugs: BugReport[];         // Known browser issues
  categories: FeatureCategory[]; // Feature categories
  stats: FeatureSupportMatrix;   // Browser support matrix
  notes?: string;            // Additional notes
  notes_by_num?: { [key: string]: string }; // Numbered notes
  usage_perc_y: number;      // % users with full support
  usage_perc_a: number;      // % users with partial support
  ucprefix: boolean;         // Requires prefixes
  parent?: string;           // Parent feature ID
  keywords?: string;         // Search keywords
  shown: boolean;           // Shown on caniuse.com
  chrome_id?: string;       // Chrome feature ID
}

interface ExternalLink {
  url: string;              // Link URL
  title: string;            // Link title
}

interface BugReport {
  description: string;      // Bug description
}

type SpecStatus = 
  | "rec"    // W3C Recommendation
  | "pr"     // Proposed Recommendation  
  | "cr"     // Candidate Recommendation
  | "wd"     // Working Draft
  | "ls"     // Living Standard
  | "other"  // Other status
  | "unoff"; // Unofficial

type FeatureCategory = 
  | "HTML5" | "CSS" | "CSS2" | "CSS3" | "SVG" 
  | "PNG" | "JS API" | "Canvas" | "DOM" 
  | "Other" | "JS" | "Security";

type SupportStatus = string; // Base values: "y" | "n" | "a" | "u" | "p"
// Support status can include additional modifiers:
// - "y": Supported (full support)
// - "n": Not supported  
// - "a": Partial support
// - "u": Unknown support
// - "p": Polyfill available
// - "d": Disabled by default
// - "x": Requires prefix
// - "#n": Note reference (e.g., "#1", "#2")
// Examples: "y", "n", "y #4", "p d #1", "a x"

Browser Support Queries

Query browser support information for decision making.

// Browser IDs available in the data
type BrowserId = 
  // Desktop browsers
  | "ie" | "edge" | "firefox" | "chrome" | "safari" | "opera"
  // Mobile browsers  
  | "ios_saf" | "op_mini" | "android" | "bb" | "op_mob" 
  | "and_chr" | "and_ff" | "ie_mob" | "and_uc" 
  | "samsung" | "and_qq" | "baidu" | "kaios";

// Usage examples for querying support
interface SupportQuery {
  // Check if feature is supported in specific browser version
  isSupported(featureId: string, browserId: BrowserId, version: string): boolean;
  
  // Get usage percentage for feature across all browsers  
  getUsagePercentage(featureId: string): { full: number; partial: number };
  
  // Get browser info including current version and usage stats
  getBrowserInfo(browserId: BrowserId): BrowserInfo;
}

Validation

Validate feature JSON files against the expected schema.

// Validation script
"validator/validate-jsons.js" // Node.js validation script

// Usage: npm run validate
// Validates all feature files in features-json/ directory
// Checks required fields, valid URLs, status values, categories

Common Usage Patterns

Feature Support Detection

const data = require("caniuse-db/fulldata-json/data-2.0.json");

function isFeatureSupported(featureId, browserId, version) {
  const feature = data.data[featureId];
  if (!feature || !feature[browserId]) return false;
  
  const support = feature[browserId][version];
  return support === "y" || support === "a";
}

// Check CSS Grid support in Chrome 57
const hasGridSupport = isFeatureSupported("css-grid", "chrome", "57");
console.log(hasGridSupport); // true

Browser Version Analysis

const data = require("caniuse-db/fulldata-json/data-2.0.json");

function getBrowserReleaseDate(browserId, version) {
  const browser = data.agents[browserId];
  const versionInfo = browser.version_list.find(v => v.version === version);
  return versionInfo ? new Date(versionInfo.release_date * 1000) : null;
}

// Get Chrome 100 release date
const chrome100Release = getBrowserReleaseDate("chrome", "100");
console.log(chrome100Release); // 2022-03-29

Feature Categories and Search

const flexboxData = require("caniuse-db/features-json/flexbox.json");

console.log(flexboxData.categories); // ["CSS"]
console.log(flexboxData.keywords);   // "flexbox,flex"
console.log(flexboxData.spec);       // "https://www.w3.org/TR/css-flexbox-1/"

Usage Statistics

const cssGridData = require("caniuse-db/features-json/css-grid.json");

console.log(`Full support: ${cssGridData.usage_perc_y}%`);
console.log(`Partial support: ${cssGridData.usage_perc_a}%`);

File Structure

caniuse-db/
├── package.json                    # Package metadata
├── data.json                      # Main database (alias)
├── fulldata-json/
│   ├── data-2.0.json             # Complete database v2.0
│   └── data-1.0.json             # Legacy v1.0 database  
├── features-json/                 # Individual feature files
│   ├── flexbox.json              # CSS Flexbox support
│   ├── css-grid.json             # CSS Grid support
│   ├── webgl.json                # WebGL support
│   └── ... (800+ feature files)
└── validator/
    └── validate-jsons.js         # Validation script

Data Updates

The caniuse-db package is regularly updated to reflect:

  • New browser releases and version support
  • Updated feature implementations
  • New web technologies and specifications
  • Revised usage statistics and compatibility data

Each update increments the patch version (e.g., 1.0.30001739 → 1.0.30001740) and includes the latest browser support information from caniuse.com.