Reverse Dev

case study

VYREON

A free web app for live TV and radio. It runs in the browser on any phone and can be installed like an app.

  • roleSolo: design, code, hosting
  • stackHTML, CSS, JavaScript, HLS.js
  • hostingCloudflare Pages, LuaDNS

The problem

People living abroad, and people at home, want to watch and listen to their local live TV and radio on whatever phone they have. The streams exist, but they are scattered across many sites, full of pop-ups, and they break often. When one stops working there is no message, just a black box.

What I built

  • Country picker to jump straight to one country's channels and stations.
  • Categories like News, Sports and Music as quick filter chips, plus search.
  • Mini player that keeps playing while you move between pages.
  • Saved list for favourite channels, stored on the device.
  • Installable PWA so it opens from the home screen with no app store.
  • Offline cache so the app shell still opens on a bad connection.

How it works

  • Player: HLS.js plays the .m3u8 streams. Safari uses native HLS. On a network error the player retries, on a media error it calls recovery, and if a stream is truly dead it shows a clear message and falls back to the next source.
  • Caching: a service worker caches the app shell. Each release gets a new cache name, and old caches are deleted on activate, so users never get stuck on stale files.
  • Deploys: the site is on Cloudflare Pages. Every push to the main branch builds and goes live, with preview links for other branches.
  • DNS: managed on LuaDNS. www is a CNAME to Pages, and the bare domain redirects to www.
  • Security: a strict Content Security Policy plus headers like X-Content-Type-Options, Referrer-Policy and frame blocking.
  • Scraping: the channel data and player code are lightly obfuscated. It won't stop a determined person, but it stops easy copy-paste clones.

Screenshots

  • VYREON home screen with rows of live TV channels and radio stations
    Home
  • VYREON Live TV page with country picker, category chips and channel cards
    Live TV
  • VYREON Radio page listing popular stations with play buttons
    Radio

What I learned

  • Live streams fail all the time. Planning for failure (retries, recovery, clear errors) matters more than the happy path.
  • Service worker caching is easy to get wrong. Changing the cache name on every release saved me from users stuck on old code.
  • Small pages win on mobile data. Every library I skipped made the app open faster.
  • DNS and redirects take real care. One wrong record can take the whole site down.