JavaScript Navigator deviceMemory Property

What You’ll Learn

navigator.deviceMemory returns the approximate device RAM in GiB from the Device Memory API. Learn privacy coarsening, secure context rules, adaptive loading, five examples, and try-it labs.

Introduction

Low-memory phones struggle with heavy pages: big images, complex animations, and large JavaScript bundles. The Device Memory API exposes a rough RAM estimate so you can dial features down when needed.

navigator.deviceMemory is read-only and returns an approximate amount of memory in gigabytes. MDN stresses the value is intentionally imprecise to reduce fingerprinting.

Understanding the deviceMemory Property

Think of deviceMemory as a coarse “how much RAM?” bucket — not the exact megabyte count from your OS settings.

• Approximate GiB — floating-point number coarsened to a power of two.
• Clamped — browsers may hide very low or very high extremes for privacy.
• Example buckets — MDN notes values like 2, 4, 8, 16, 32 when bounds apply.
• Secure context — HTTPS / localhost in supporting browsers.
• Related header — Sec-CH-Device-Memory Client Hint (HTTP side).

📝 Syntax

General form of the property:

navigator.deviceMemory

Value

• A floating-point number: approximate device memory in GiB (when supported).

Common patterns

// MDN-style log:
const memory = navigator.deviceMemory;
console.log(`This device approximately ${memory}GiB of RAM.`);

// Adaptive check (when present):
if (typeof navigator.deviceMemory === "number" && navigator.deviceMemory < 4) {
  // Prefer lighter assets / fewer heavy widgets
}

Examples Gallery

Examples follow MDN Device Memory / navigator.deviceMemory patterns. Prefer Try It Yourself on a supporting Chromium browser over HTTPS. Use View Output for expected messaging.

const supported = "deviceMemory" in navigator;
console.log(supported ? "deviceMemory available" : "deviceMemory missing");

deviceMemory available
(or "deviceMemory missing" in Safari / Firefox)

const lines = [
  "isSecureContext: " + window.isSecureContext,
  "deviceMemory: " + (("deviceMemory" in navigator) ? "present" : "absent")
];
console.log(lines.join("\n"));

isSecureContext: true
deviceMemory: present
(on supporting secure pages)

if (!("deviceMemory" in navigator)) {
  console.log("unsupported");
} else {
  const memory = navigator.deviceMemory;
  console.log(`This device approximately ${memory}GiB of RAM.`);
}

This device approximately 8GiB of RAM.
(exact bucket varies; or "unsupported")

function pickExperienceTier() {
  const mem = navigator.deviceMemory;
  if (typeof mem !== "number") return "full"; // safe default
  if (mem < 2) return "minimal";
  if (mem < 4) return "light";
  return "full";
}

console.log("tier: " + pickExperienceTier());

tier: full
(or light / minimal on lower reported GiB)

function deviceMemoryStatus() {
  if (!window.isSecureContext) {
    return { ok: false, reason: "insecure-context" };
  }
  if (!("deviceMemory" in navigator)) {
    return { ok: false, reason: "unsupported" };
  }
  const gib = navigator.deviceMemory;
  return {
    ok: true,
    gib: gib,
    lowMemory: typeof gib === "number" && gib < 4
  };
}

console.log(JSON.stringify(deviceMemoryStatus()));

{"ok":true,"gib":8,"lowMemory":false}
(or unsupported / insecure-context)

🚀 Common Use Cases

• Lighter pages on low RAM — skip autoplaying video, reduce particle effects.
• Image / asset budgets — serve smaller galleries when memory is constrained.
• Defer heavy JS — load charts or editors only on higher-memory tiers.
• RUM segmentation — coarse memory buckets in performance reports (privacy-aware).
• Progressive enhancement — improve Chromium experiences without requiring the API.

📝 Notes

• Limited availability / not Baseline — mainly Chromium; often missing in Safari and Firefox.
• Not Deprecated, Experimental, or Non-standard on MDN — no status banner on this page.
• Secure context required (HTTPS / localhost).
• Values are approximate and clamped — never treat them as exact RAM.
• Related: devicePosture, connection, JavaScript hub.

💡 Best Practices