The Next Browser APIs

What's coming to navigator.*—from WebGPU to AI, the web platform keeps expanding

WebLLM Team
The Next Browser APIs

The navigator object has grown from a simple browser detector into the gateway for web platform capabilities. What started with navigator.userAgent now includes geolocation, media devices, service workers, Bluetooth, USB, GPU access, and dozens more.

What's coming next? By looking at what's shipping, what's in development, and what the obvious gaps are, we can predict the browser APIs of the next few years.

Some will seem inevitable. Some might surprise you. One in particular—AI—represents the biggest expansion of browser capabilities since we got camera access.

The Evolution of navigator.*

First, let's appreciate how far we've come.

2005 Era

// This was basically it
navigator.userAgent; // "Mozilla/5.0..."
navigator.language; // "en-US"
navigator.cookieEnabled; // true
navigator.plugins; // Plugin array

2015 Era

// Significant expansion
navigator.geolocation; // Location access
navigator.mediaDevices; // Camera/microphone
navigator.serviceWorker; // Offline, background
navigator.onLine; // Network status
navigator.vibrate; // Haptic feedback
navigator.getBattery(); // Battery status (later removed)

2025 Era

// Full platform capabilities
navigator.gpu; // GPU compute (WebGPU)
navigator.bluetooth; // Bluetooth devices
navigator.usb; // USB devices
navigator.serial; // Serial ports
navigator.hid; // Human interface devices
navigator.credentials; // Authentication
navigator.permissions; // Permission management
navigator.storage; // Storage management
navigator.locks; // Web locks
navigator.mediaSession; // Media controls
navigator.wakeLock; // Prevent sleep
navigator.clipboard; // Read/write clipboard
navigator.share; // Native share dialogs
navigator.scheduling; // Task scheduling priority

The pattern is clear: browser APIs expand to match what native apps can do, with permission models to maintain user control.

What's Shipping Now

These APIs are in stable browsers or actively rolling out:

WebGPU (navigator.gpu)

Status: Chrome 113+, Safari/Firefox in development

const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();
// Full GPU compute access

Impact: ML inference, advanced graphics, scientific computing in browser. This is foundational for AI capabilities.

File System Access API

Status: Chrome 86+, limited in other browsers

// Read a file the user selects
const [fileHandle] = await window.showOpenFilePicker();
const file = await fileHandle.getFile();
const contents = await file.text();

// Write to a file
const writable = await fileHandle.createWritable();
await writable.write(newContents);
await writable.close();

Impact: Native-quality file editing apps (text editors, IDEs, image editors). VS Code web uses this.

Web Codecs

Status: Chrome 94+

// Direct video codec access
const decoder = new VideoDecoder({
  output: (frame) => renderFrame(frame),
  error: (e) => console.error(e),
});

decoder.configure({
  codec: 'vp8',
  width: 1920,
  height: 1080,
});

// Decode raw video data
decoder.decode(encodedChunk);

Impact: Video editing, streaming, custom media players without relying on <video> element limitations.

Multi-Screen Window Placement

Status: Chrome 100+

// Get information about connected screens
const screens = await window.getScreenDetails();

// Position windows on specific screens
await window.open(
  url,
  '_blank',
  `
  left=${screens.screens[1].availLeft},
  top=${screens.screens[1].availTop}
`
);

Impact: Multi-monitor apps (trading platforms, media production, presentations).

Web Locks API

Status: Chrome 69+, Firefox 96+, Safari 15.4+

// Coordinate across tabs/workers
await navigator.locks.request('resource', async (lock) => {
  // Only one tab has this lock at a time
  await doExclusiveWork();
});

Impact: Better tab coordination, prevent race conditions in multi-tab apps.

What's In Development

These APIs are being actively standardized and implemented:

WebNN (Web Neural Network API)

Status: Chrome Origin Trial, specification in development

// Hardware-accelerated ML inference
const context = await navigator.ml.createContext();
const builder = new MLGraphBuilder(context);

// Define operations
const input = builder.input('input', { type: 'float32', dimensions: [1, 3, 224, 224] });
const conv = builder.conv2d(input, weights, {
  /* options */
});
const relu = builder.relu(conv);

// Build and execute
const graph = await builder.build({ output: relu });
const results = await context.compute(graph, { input: inputData });

Impact: Native ML acceleration using GPU/NPU without WebGPU complexity. Optimized for inference.

WebTransport

Status: Chrome 97+, others in development

// Low-latency bidirectional communication
const transport = new WebTransport('https://example.com/api');
await transport.ready;

// Unreliable datagrams (like UDP)
const writer = transport.datagrams.writable.getWriter();
await writer.write(new Uint8Array([1, 2, 3]));

// Reliable streams
const stream = await transport.createBidirectionalStream();

Impact: Real-time applications (games, collaboration) with lower latency than WebSocket.

Speculation Rules API

Status: Chrome 109+

// Prerender pages before user clicks
<script type="speculationrules">
{
  "prerender": [{
    "source": "list",
    "urls": ["/next-page", "/other-page"]
  }]
}
</script>

Impact: Instant page navigations, dramatically improved perceived performance.

View Transitions API

Status: Chrome 111+

// Smooth animated transitions between pages
document.startViewTransition(() => {
  updateDOM(); // Change the page content
});

Impact: Native-quality page transitions in web apps, smoother UX.

Popover API

Status: Chrome 114+, Firefox, Safari

<button popovertarget="menu">Open Menu</button>
<div id="menu" popover>
  <!-- Popover content -->
</div>

Impact: Standardized popover/dropdown behavior without JavaScript.

What's Being Proposed

These are at various stages of proposal and discussion:

Local Font Access

Status: Origin trial, specification discussion

// Access fonts installed on user's system
const fonts = await window.queryLocalFonts();
for (const font of fonts) {
  console.log(font.family, font.style);
}

Impact: Design tools, document editors that use system fonts.

Compute Pressure API

Status: Chrome Origin Trial

// React to device computational load
const observer = new PressureObserver((records) => {
  const pressure = records[0].state; // "nominal", "fair", "serious", "critical"
  adjustQuality(pressure);
});

await observer.observe('cpu');

Impact: Adaptive quality in games/video/ML inference based on device capability.

Handwriting Recognition

Status: Chrome Origin Trial

// Browser-native handwriting recognition
const recognizer = await navigator.ink.requestRecognizer({
  languages: ['en'],
});

const strokes = [
  /* stylus/touch stroke data */
];
const results = await recognizer.recognize(strokes);
console.log(results[0].text); // Recognized text

Impact: Note-taking apps, form filling, accessibility.

Screen Capture Improvements

Status: Various stages

// More control over screen capture
const stream = await navigator.mediaDevices.getDisplayMedia({
  video: {
    displaySurface: 'monitor', // Capture whole screen
  },
  systemAudio: 'include', // Include system audio
});

Impact: Better screen recording, streaming, remote desktop.

The Obvious Gap: AI

Every major operating system is adding AI APIs:

  • Apple: Core ML, Apple Intelligence APIs
  • Google: ML Kit, Gemini APIs
  • Microsoft: Windows ML, Copilot runtime
  • Meta: PyTorch Mobile, Llama integration

The browser has... nothing standard.

The Current State

Today, if you want AI in a web app, your options are:

1. Server-side AI (most common)

// Call your server, which calls OpenAI/Anthropic
const response = await fetch('/api/ai', {
  method: 'POST',
  body: JSON.stringify({ prompt: userInput }),
});
  • Requires server infrastructure
  • Data leaves the device
  • Latency overhead
  • Ongoing API costs

2. WebGPU-based ML (emerging)

// Run models directly via transformers.js or similar
import { pipeline } from '@xenova/transformers';
const classifier = await pipeline('sentiment-analysis');
const result = await classifier('I love this!');
  • Works locally
  • No server needed
  • Limited to models that fit in browser
  • Complex setup

3. Polyfill extensions (experimental)

// WebLLM approach - extension provides the API
const result = await navigator.llm.prompt('Summarize this page');
  • Best developer experience
  • User controls providers
  • Privacy-preserving option
  • Not yet standardized

What a Native AI API Could Look Like

// Hypothetical navigator.llm or navigator.ai
// Following established browser API patterns

// Check capability
if ('llm' in navigator) {
  // Request with permission prompt (like geolocation)
  const session = await navigator.llm.createSession({
    model: 'default', // User's configured model
    capabilities: ['text-generation'],
  });

  // Simple prompt
  const response = await session.prompt('Explain quantum computing');

  // Streaming
  for await (const chunk of session.streamPrompt('Write a story')) {
    display(chunk);
  }

  // System messages and conversation
  const chat = await session.createChat({
    system: 'You are a helpful assistant',
  });
  const reply = await chat.send('Hello!');
}

Why Browser AI Makes Sense

Following the patterns we've seen:

1. Capability exists on devices

  • Every new phone has NPUs
  • Every laptop has capable GPUs
  • Desktop systems are overpowered for most tasks
  • Cloud AI APIs are mature

2. Users want control

  • Privacy concerns with cloud AI
  • Different users prefer different models
  • Some want local, some want cloud, some want specific providers

3. Permission model fits

  • Similar to location: "This site wants to use AI"
  • User grants or denies
  • Site-specific permissions
  • Revocable

4. Developer need is clear

  • Adding AI to web apps is common
  • Current approaches are fragmented
  • Standard API would simplify development

The Path to Reality

For AI to become a browser API:

Stage 1 (Now): Extensions and polyfills prove the concept

  • WebLLM demonstrates the API design
  • Real apps use it
  • Patterns solidify

Stage 2 (Soon): Browser vendors take notice

  • Chrome experiments (Origin Trials)
  • Standards body discussions
  • Safari/Firefox interest

Stage 3 (Later): Specification work

  • W3C/WHATWG drafts
  • Multi-stakeholder input
  • Security/privacy review

Stage 4 (Eventually): Stable shipping

  • Chrome stable
  • Firefox follows
  • Safari completes the trio

This is the same path WebGL, WebRTC, and WebGPU took. AI will follow.

Timeline Predictions

Based on historical patterns:

APICurrent StatusPrediction
WebGPUShippingUniversal by 2025-2026
WebNNOrigin TrialShipping 2025-2026
WebTransportPartially shippingUniversal 2025-2026
File System AccessChrome-onlySafari/Firefox 2025-2026
AI/LLM APIPolyfills onlyOrigin Trial 2025-2026, Shipping 2027-2028

The AI timeline is speculative, but pressure is building:

  • Apple announced on-device AI in iOS 18
  • Google is pushing Gemini everywhere
  • Microsoft integrates Copilot into Windows
  • Users expect AI in applications

The browser will need to keep pace.

What Developers Should Do Now

For Current Projects

1. Use progressive enhancement

// Check for capabilities
if ('gpu' in navigator) {
  // Use WebGPU
} else {
  // Fall back gracefully
}

2. Watch Origin Trials

Chrome Origin Trials let you test upcoming APIs before stable release. For AI-heavy apps, watch for:

  • WebNN trials
  • Any AI-related experiments

3. Build with polyfills

For AI specifically, using polyfills like WebLLM:

  • Validates your API usage patterns
  • Works today
  • Will transition smoothly when native APIs ship

For Future Planning

1. Assume capabilities will exist

If you're designing an app for 2026+, assume browsers will have:

  • Full GPU compute (WebGPU)
  • ML acceleration (WebNN)
  • Possibly native AI APIs

2. Design for user control

Whatever AI API emerges will likely follow permission patterns:

  • User grants access
  • User controls which provider
  • Site doesn't know implementation details

Design your app to work regardless of which AI backend the user chooses.

3. Consider privacy modes

Some users will want:

  • Fully local AI (no network)
  • Specific providers only
  • Different models for different sites

Build for flexibility.

Conclusion

The navigator object tells the story of web platform expansion. From simple browser detection to GPU compute, the trend is clear: capabilities that matter become browser APIs.

AI is the obvious next addition. The need is clear, the patterns are established, and the question is timing and design—not whether it will happen.

In the meantime, polyfills like WebLLM let developers build with tomorrow's APIs today. When navigator.llm (or whatever it's called) ships natively, apps built on WebLLM patterns will be ready.

The next chapter of the web platform is being written now. The browsers of 2027 will have capabilities we can only prototype today. But we can see the direction—and AI is unmistakably part of it.


Further Reading

In this article:

Share this article: