How Radio Streaming Works: Radio Browser API, Icecast & Live Audio in the Browser

TheWorldRadio plays 30,000+ live stations from every country on Earth — entirely in your browser, with no backend server, no app download, and no account. Here's exactly how that works under the hood.

The Radio Browser API — a free, community-driven station database

The foundation of TheWorldRadio is the Radio Browser API (api.radio-browser.info), a community-maintained, open-source database of internet radio stations. Anyone can query it freely — no API key, no rate-limit account, no cost. It currently indexes over 30,000 active stations across every country on the planet.

The API exposes a REST interface that returns JSON. To fetch stations by country, for example:

// GET all stations in Japan, ordered by click count
https://de1.api.radio-browser.info/json/stations/bycountry/japan
  ?order=clickcount
  &reverse=true
  &limit=50
  &hidebroken=true

Each station in the response looks like this:

{
  "stationuuid":   "960c6c7d-0601-11e8-ae97-52543be04c81",
  "name":          "NHK World Radio Japan",
  "url_resolved":  "https://nhkworld.webcdn.stream.ne.jp/www11/live/nhkworld-tv-audio-en.m3u8",
  "country":       "Japan",
  "countrycode":   "JP",
  "tags":          "news,talk,international",
  "bitrate":       128,
  "favicon":       "https://www3.nhk.or.jp/nhkworld/favicon.ico",
  "clickcount":    3241
}

The url_resolved field is the key piece — it's the actual audio stream URL that the browser plays directly. Radio Browser resolves redirects ahead of time so the player doesn't have to follow chains of 301 redirects before audio can begin.

How live audio streams work

Internet radio isn't like a podcast file you download and play. It's a continuous, infinite stream that a broadcast server pushes to every connected listener in real time. Two protocols dominate the space:

Icecast

Icecast is an open-source streaming server. When you tune in, your browser opens an HTTP connection to the Icecast server and keeps it open indefinitely. The server pushes MP3 or AAC audio data continuously down that connection. Icecast streams typically look like:

https://ice2.somafm.com/groovesalad-128-mp3

These are plain MP3/AAC byte streams — no container format, no playlist. The browser's HTMLAudioElement handles them natively.

Shoutcast

Shoutcast (originally by Winamp/Nullsoft) works similarly to Icecast but uses a slightly different server handshake and often embeds track metadata inside the stream using ICY headers. Most modern browsers handle Shoutcast streams transparently. Shoutcast URLs usually serve a .pls or .m3u playlist pointing to the real stream — Radio Browser resolves these so url_resolved always points to the raw stream.

HLS (HTTP Live Streaming)

Increasingly, stations — especially national broadcasters like the BBC and NHK — deliver audio over HLS. Instead of one infinite connection, HLS breaks the stream into small .ts or .aac segments (typically 2–10 seconds each) referenced by an .m3u8 playlist file. The player fetches the playlist, fetches each segment, and stitches them together. This works better over unreliable networks and through firewalls, but introduces a few seconds of latency compared to raw Icecast streams.

Playing streams with the Web Audio API

TheWorldRadio uses the browser's built-in HTMLAudioElement (the same thing a plain <audio> tag uses) to play streams. No external audio library is needed. Setting the stream is as simple as:

// Simplified version of what happens when you click a station
const audio = new Audio()
audio.crossOrigin = 'anonymous'
audio.src = station.url_resolved   // e.g. "https://ice2.somafm.com/groovesalad-128-mp3"
audio.play()

The browser handles buffering, decoding, and playback entirely. For HLS streams ending in .m3u8, modern browsers (Safari, Chrome 87+, Edge) play them natively without any additional library.

Reporting clicks back to Radio Browser

Radio Browser's station rankings (the clickcount field) are community-powered. When a user tunes into a station, TheWorldRadio reports the play back to the API:

GET https://de1.api.radio-browser.info/json/url/{stationuuid}

This keeps the database accurate — stations that nobody listens to drift down the rankings, and genuinely popular stations surface to the top. It also feeds back into clicktrend, which tracks momentum over the past week.

How the interactive globe fits in

The 3-D globe in TheWorldRadio is rendered using globe.gl, a WebGL-based library built on top of Three.js. Country borders are drawn from GeoJSON data. When you click a country, the app reads the country code from the GeoJSON feature, fires a Radio Browser query filtered to that countrycode, and displays the results in a browsable sheet — all without any page navigation or server round-trip beyond the API call itself.

Station clusters on the globe are positioned using centroid coordinates (the geographic centre of each country), pre-calculated and bundled with the app so there's no geolocation API call at runtime.

Why no backend?

TheWorldRadio is a fully static app — the built output is just HTML, CSS, and JavaScript files. There's no Node.js server, no database, no auth layer. This has a few advantages:

• It can be hosted for free on platforms like Netlify, Vercel, or Cloudflare Pages.
• It scales to any number of listeners with no infrastructure cost — every user's browser talks directly to Radio Browser's API and directly to the station's stream server.
• There's no single point of failure beyond the third-party APIs themselves.

The tradeoff is that the app can't cache or proxy streams, so if a station's stream server goes down or is geo-blocked, the player can't work around it. Radio Browser marks broken streams over time as users report them, which is why the hidebroken=true parameter is included in every query.

Summary

When you click a country on TheWorldRadio's globe, the following happens in under a second:

1. The app fetches station metadata from the Radio Browser API, filtered by country code.
2. You pick a station. The app sets audio.src to its url_resolved stream URL.
3. The browser opens a direct HTTP connection to the station's Icecast, Shoutcast, or HLS server.
4. Audio starts playing. The click is reported back to Radio Browser to update the station's popularity count.
5. That's it — no accounts, no plugins, no downloads.