Smart Environment Detector

A powerful, lightweight library for comprehensive environment detection in JavaScript applications

Zero Dependencies

TypeScript Ready

Cross-Platform

Accessibility Aware

Try Demo Read Docs

npm install smart-env-detector

Quick Example

import { detect, supports } from 'smart-env-detector';

// Get complete environment info
const env = detect();
console.log(env.platform);        // "browser"
console.log(env.runtime.name);    // "Chrome"
console.log(env.runtime.version); // "91.0"

// Quick capability checks
if (supports('webGL')) {
  initializeWebGLRenderer();
}

if (supports('serviceWorker')) {
  registerServiceWorker();
}

50+

Environment Properties

13.7KB

Bundle Size (gzipped)

100%

TypeScript Coverage

Passing Tests

Live Environment Detection

See what your current environment looks like through Smart Environment Detector

Click "Detect Environment" to see your current environment details

Quick Capability Tests

Documentation

Installation Quick Start API Reference Examples

Installation

Install Smart Environment Detector using your preferred package manager:

npm

npm install smart-env-detector

yarn

yarn add smart-env-detector

pnpm

pnpm add smart-env-detector

CDN Usage

You can also use it directly in the browser via CDN:

HTML

<script src="https://unpkg.com/smart-env-detector@latest/dist/index.umd.js"></script>
<script>
  const { detect, supports } = SmartEnvironmentDetector;
  const env = detect();
  console.log(env);
</script>

Quick Start

Get started with Smart Environment Detector in just a few lines of code:

Basic Usage

import { detect, supports, getSummary } from 'smart-env-detector';

// Get complete environment information
const env = detect();
console.log(env.platform);        // "browser"
console.log(env.runtime.name);    // "Chrome"
console.log(env.runtime.version); // "91.0"

// Quick capability checks
if (supports('webGL')) {
  initializeWebGLRenderer();
}

if (supports('indexedDB')) {
  setupOfflineStorage();
}

// Human-readable summary
console.log(getSummary()); 
// Output: "Chrome 91.0 on browser"

Advanced Usage

Class-based API

import { SmartEnvironmentDetector } from 'smart-env-detector';

const detector = new SmartEnvironmentDetector();

// Detect with experimental features
const env = detector.detect({
  includeExperimentalFeatures: true,
  cacheDuration: 60000 // Cache for 1 minute
});

// Check cutting-edge capabilities
if (env.experimental.webGPU) {
  console.log('WebGPU is available!');
}

if (env.experimental.webXR) {
  console.log('VR/AR capabilities detected!');
}

API Reference

`detect(options?: DetectionOptions): EnvironmentInfo`

Returns comprehensive environment information about the current runtime.

Parameters:

interface DetectionOptions {
  includeExperimentalFeatures?: boolean; // Include experimental APIs (default: false)
  cacheDuration?: number;                 // Cache duration in ms (default: 300000)
}

Returns:

interface EnvironmentInfo {
  platform: 'browser' | 'nodejs' | 'webworker' | 'electron' | 'react-native' | 'unknown';
  runtime: {
    name: string;
    version: string;
    engine: string;
  };
  capabilities: {
    localStorage: boolean;
    sessionStorage: boolean;
    indexedDB: boolean;
    webGL: boolean;
    webAssembly: boolean;
    serviceWorker: boolean;
    // ... and many more
  };
  performance: {
    memoryLimit: number | null;
    cpuCores: number | null;
    connectionType: string | null;
    devicePixelRatio: number | null;
  };
  security: {
    https: boolean;
    mixedContent: boolean;
    cookiesEnabled: boolean;
    thirdPartyCookies: boolean;
  };
  accessibility: {
    reducedMotion: boolean;
    highContrast: boolean;
    screenReader: boolean;
  };
  experimental?: {
    webGPU: boolean;
    fileSystemAccess: boolean;
    webRTC: boolean;
    webXR: boolean;
  };
}

`supports(capability: string): boolean`

Quick check for specific platform capability.

if (supports('webGL')) {
  // WebGL is available
  initializeWebGLRenderer();
}

if (supports('serviceWorker')) {
  // Service Worker supported
  registerServiceWorker();
}

`getSummary(): string`

Returns a human-readable environment summary.

console.log(getSummary());
// Outputs: "Chrome 91.0 on browser"
//          "Node.js v16.14.0 on nodejs"
//          "Safari 14.1 on browser"

Examples

Progressive Feature Loading

Adapt your application based on available capabilities:

import { detect, supports } from 'smart-env-detector';

async function initializeApp() {
  const env = detect();
  
  // Load features based on capabilities
  if (supports('webGL') && env.performance.cpuCores >= 4) {
    // High-performance 3D features
    const { WebGLRenderer } = await import('./renderers/webgl-renderer');
    return new WebGLRenderer();
  } else if (supports('webGL')) {
    // Basic 3D features
    const { BasicWebGLRenderer } = await import('./renderers/basic-webgl');
    return new BasicWebGLRenderer();
  } else {
    // 2D fallback
    const { Canvas2DRenderer } = await import('./renderers/canvas-renderer');
    return new Canvas2DRenderer();
  }
}

Accessibility-First UI

Respect user preferences for better accessibility:

import { detect } from 'smart-env-detector';

function setupAccessibility() {
  const env = detect();
  
  // Respect motion preferences
  if (env.accessibility.reducedMotion) {
    document.documentElement.style.setProperty('--animation-duration', '0.01ms');
    console.log('Animations disabled per user preference');
  }
  
  // High contrast support
  if (env.accessibility.highContrast) {
    document.body.classList.add('high-contrast');
    console.log('High contrast mode enabled');
  }
  
  // Screen reader optimizations
  if (env.accessibility.screenReader) {
    document.body.classList.add('screen-reader-optimized');
    loadAriaEnhancements();
    console.log('Screen reader optimizations enabled');
  }
}

Cross-Platform Adaptation

Handle different platforms gracefully:

import { detect } from 'smart-env-detector';

function adaptToPlatform() {
  const env = detect();
  
  switch (env.platform) {
    case 'browser':
      // Browser-specific optimizations
      if (env.runtime.name === 'Safari') {
        loadSafariPolyfills();
      }
      enableBrowserFeatures();
      break;
      
    case 'nodejs':
      // Node.js environment
      enableServerFeatures();
      setupFileSystemAccess();
      break;
      
    case 'electron':
      // Electron app
      enableDesktopFeatures();
      setupNativeIntegration();
      break;
      
    case 'react-native':
      // React Native app
      enableMobileFeatures();
      setupNativeModules();
      break;
      
    default:
      // Unknown platform - use safe defaults
      enableBasicFeatures();
  }
}