I built a 6.6KB embeddable weather widget — here's how it works

#showdev #webdev #performance #javascript

I've been building wfy24.com solo for the past couple of years — a weather platform covering 5M+ locations in 51 languages. I just shipped a free embeddable weather widget and wanted to share how it works under the hood.

The Problem

Most weather widgets are bloated (100KB+), look ugly, break your CSS, and require paid subscriptions. I wanted something that's tiny, beautiful, and genuinely free.

The Widget

One script tag, that's it:

<script src="https://www.wfy24.com/widget.js"
  data-key="YOUR_API_KEY"
  data-city="london-gb2643743"
  data-theme="auto"
  data-lang="en">
</script>

What you get:

Real-time temperature from 23,000+ weather stations
Lightning detection within 100km radius
Rain nowcast (minutes until rain/dry)
3-day forecast with min/max temps
50+ languages, metric/imperial
Light/dark/auto theme

Technical Details

Size: 6.6KB gzipped. No dependencies, no frameworks, no jQuery.

Shadow DOM: The widget renders inside a Shadow DOM, so it won't interfere with your styles and your styles won't interfere with it. Zero CSS conflicts.

Auto-refresh: Updates every 5 minutes automatically.

Location detection: Supports GPS (if permitted) or IP-based geolocation, or you can set a fixed city.

The Data Pipeline

This is the part I'm most proud of. The backend runs a system called Hyperion — a trust-scored data blending engine that:

Collects readings from 23,000+ weather stations across 12 networks
Assigns trust scores to each station based on historical accuracy
Blends the data using inverse distance weighting
Fuses it with radar, satellite, and NWP (numerical weather prediction) data
Validates against ERA5 reanalysis data

The result is real-time weather data that's more accurate than any single source.

Stack

Backend: Go
Frontend: Next.js
Database: PostgreSQL
CDN: BunnyCDN
Web server: nginx

Try It

Free API key, no credit card, no account needed — just your email and domain.

👉 https://www.wfy24.com/en/widgets

I'd love your feedback — what features would you want in an embeddable weather widget?

DEV Community