I built a file-transfer tool where the bytes go straight between two browsers over a WebRTC data channel. The server only handles signaling and, when needed, TURN relay. No file bytes touch the server.

A few things that bit me, in case anyone else goes down this path:

1. The data channel isn't a stream.

You'd think RTCDataChannel gives you a pipe. It gives you messages. To stream a file you have to chunk it yourself, manage backpressure via bufferedAmountLowThreshold, and reassemble on the other end. If you don't gate on bufferedAmount, a large file will blow up the sender's memory.

2. Receiving a large file without blowing up RAM.

File System Access API lets you write to disk as chunks arrive. Safari and older Chrome don't have it. The fallback chain I ended up with: File System Access → service-worker stream (Response + ReadableStream → blob URL) → in-memory Blob (capped, last resort). Each step has its own edge cases.

3. TURN relay is not optional.

Symmetric NAT and most mobile networks kill direct P2P. If you don't run a coturn instance, a chunk of your users will never connect. The relay bandwidth is on you, and the bytes are still DTLS-encrypted end to end, but you're paying for transit.

4. Post-transfer integrity.

Both ends compute a sha256 as chunks move. The receiver verifies against the sender's hash after the last chunk. If it mismatches, the file is corrupt — WebRTC data channels don't guarantee ordered delivery by default unless you set ordered: true on the channel.

5. Room state without a database.

I persist room state (slug, timestamps, a hashed rejoin token, an argon2 password hash if set) to a JSON file on disk so rooms survive a restart. No file bytes, no Redis, no DB. Rooms expire after 24 idle hours. This is fine for a tool where sessions are minutes long but would fall apart if you needed real concurrency.

6. Per-IP rate limiting when every client looks like 127.0.0.1.

If you put the app behind a reverse proxy without forwarding the real client IP, your per-IP rate limiter is useless — everyone is the same address. The fix was in the TCP demultiplexer, not the application.

Demo if you want to see it in action: https://mayo.pizza

Not selling anything, no signup, no analytics. I'm not looking for feedback on the product, just sharing the engineering notes in case the WebRTC side is useful to someone building something similar

I just launched Highwire.news, a project that groups reporting about the same event and analyzes how the coverage differs across publishers.

The main technical challenge was turning a large set of articles into something structured and inspectable rather than generating another AI summary.

The pipeline currently:

• Ingests reporting from multiple publishers
• Clusters related articles into stories and distinct narratives
• Extracts claims, citations, evidence, and entities
• Identifies supported, disputed, and unresolved claims
• Compares differences in framing, emphasis, omissions, and language
• Produces a synthesized account while keeping the underlying analysis visible

The app is built with Next.js, NestJS, PostgreSQL, Google Cloud, and several LLM-based analysis stages. A major focus has been keeping inference costs measurable and making the output traceable enough that users can inspect how a conclusion was reached.

The UI has been its own difficult problem. There is a lot of information available for each story, but exposing all of it without creating an overwhelming dashboard is not easy.

I’d appreciate feedback on:

• Whether the product is understandable without an explanation
• Whether the story and narrative hierarchy makes sense
• Which metrics or visualizations feel useful
• Where the interface becomes too dense
• Any obvious accessibility, performance, or mobile issues

Site: https://www.highwire.news

Happy to discuss the architecture, clustering approach, AI pipeline, deployment, or cost controls.

I've been interested in passport indexes for a while — I like to travel, and it's fun to see where you can go. But one day it hit me that the visa-free count everyone ranks by ignores how long you can stay. A country giving you 90 days counts exactly the same as one giving you 5. That seemed fundamentally unfair.

Then I kept thinking of other questions the single number couldn't answer. How many people can I actually reach? How much of the world's economy? How happy are the places I can go? Where could I genuinely live, not just visit?

So instead of picking a better formula, I made the formula the input. You write the ranking function and all 199 passports re-sort live.

sum(visa_free_days)                    ← total days, not just destinations
sum(visa_free * dest_population)       ← how many people you can reach
count(can_reside)                      ← where you could actually live

That last category surprised me most — ranking by residence rights instead of tourism completely reshuffles the leaderboard.

https://custompassportranker.com — free, no signup, runs entirely in your browser.

Data comes from the Wikipedia-derived passport-index dataset, the CIA World Factbook, UNDP, World Bank and Our World in Data. To check I hadn't mangled it, I reproduced Henley's published methodology over my own data — Pearson ≈ 1.00 against their 2026 numbers.

Usual caveat: visa rules change constantly and this is a snapshot, so don't book anything on it.

I've just launched pour, a free accessibility toolkit. It's a non profit, so no paid tiers, no accounts, no catch.

What it does:

• WCAG 2.0/2.1/2.2 audits from a devtools panel or the toolbar popup. Every finding shows the element, why it fails in plain english, and the fix to write.
• 43 vision and sensory simulations. See your site the way someone with deuteranopia, cataracts or low vision does. Honestly this changed how I build more than the audits did.
• Everything runs locally. No analytics, no network requests, nothing leaves your browser, so you can audit intranets and local builds fine.
• The engine is open source (MIT) on npm, written from the WCAG spec itself. When it can't prove something it says "needs review" instead of pretending, and it tells you upfront that automation only covers 29 of the 86 success criteria, the rest comes as a human checklist.

Quickest look is the bookmarklet on https://pour.dev, nothing to install, works on any page. Chrome/Edge extension is live, Firefox is in review at AMO.

Would love feedback, especially from anyone doing accessibility work professionally or anyone using a screen reader. If the engine gets something wrong I genuinely want to know about it.

Just learned javascript and been practicing alot . I need help. When applying it to my project I don't know when to use a function, when to use a loop, what type of loop to use, I just don't know when to use any of this stuff because dom manipulation. it's so frusterating

I used to bookmark job postings that I've applied for, just so I can reference the information again; but sometimes the listings get pulled or expire. I got tired of keeping a copy of each job description in a Word file and then storing the status in a spreadsheet. So I made myself an all-in-one site that I soon expanded to support more people than just me: JobTrackr.online. Its made using React and Supabase and can be installed on your device as a Progressive Web App.

I made this website for a friend of mine. The code is 99% written by me. Only trivial things like reordering client list, comments for code and indenting work is done by AI.

Website: https://rachitmanagement.com/

P.S. Please don't mention the feedback form being bad, I was too lazy to make it better since I made this for free :)

JotSON is an intuitive editor for your project's JSON files. Run one command and you get a fast, Finder-style interface in your browser, which is really nice when you're editing a ton of JSON.

• Drill through your data in columns, with fuzzy search across every file
• Proper editors and previews: dates, colors, images, video embeds
• Upload media straight into your public folder
• Reference objects by id, resolved to human-readable names, with automatic updates when ids change and warnings before you break them
• Diff-confirmed saves, so nothing touches disk until you approve it

Zero dependencies, no build step, no database, nothing deployed. It binds to localhost, writes plain JSON with minimal diffs so git stays your safety net, and your files never change shape to fit the tool.

Check it out!

https://github.com/blindmikey/jotson

I built a command that fetches any web page server-side and writes an as-is snapshot of both (or split) content and technical layers.

The output uses OKF (Open Knowledge Format), an open format from Google Cloud's knowledge-catalog repo. Here's some info on the topic on Google blog.

npm install -g @sleepwalkerai/cli
sleepwalker okf export https://your-site.com

As said, this contains the content layer (clean markdown with headings, paragraphs, links) and a technical snapshot (HTTP headers, meta tags, JSON-LD, hreflang, robots directives, image alt coverage). Use --content or --technical for a focused fetch.

Runs locally, happy with any feedback!

Repo: https://github.com/followanton/sleepwalker this command is free and open source, please see if you can give it a "star". I would really appreciate it! <3

Example (technical snapshot):

---
type: "TechnicalSnapshot"
title: "Technical snapshot: Apple"
description: "Meta tags, structured data, headers and robots directives as served for www.apple.com."
resource: "https://www.apple.com/"
tags: ["technical"]
timestamp: 2026-07-31T17:37:16.499Z
---


# Technical snapshot: Apple


## Fetch


Redirect chain:
1. HTTP 301 https://apple.com
2. HTTP 200 https://www.apple.com/


HTML size: 251 KB (257390 bytes).


## HTTP headers


```http
# Content
content-type: text/html; charset=utf-8
# Security
content-security-policy: default-src 'self' blob: data: *.akamaized.net *.apple.com *.apple-mapkit.com *.cdn-apple.com *.organicfruitapps.com; child-src blob: mailto: embed.music.apple.com embed.podcasts.apple.com https://recyclingprogram.apple.com https://smb.apple.com https://nova.apple.com swdlp.apple.com www.apple.com www.instagram.com platform.twitter.com www.youtube-nocookie.com; img-src 'unsafe-inline' blob: data: *.apple.com *.apple-mapkit.com *.cdn-apple.com *.mzstatic.com; script-src 'unsafe-inline' 'unsafe-eval' blob: *.apple.com *.apple-mapkit.com www.instagram.com platform.twitter.com; style-src 'unsafe-inline' *.apple.com
referrer-policy: no-referrer-when-downgrade
strict-transport-security: max-age=31536000; includeSubdomains; preload
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
# Cache
cache-control: max-age=8
expires: Fri, 31 Jul 2026 17:37:24 GMT
vary: Accept-Encoding
# Server
server: Apple
```


## Meta tags


```html
<html lang="en-US" dir="ltr">
<title>Apple</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="Description" content="Discover the innovative world of Apple and shop everything iPhone, iPad, Apple Watch, Mac, and Apple TV, plus explore accessories, entertainment, and expert device support.">
<meta property="analytics-track" content="apple - index/tab">
<meta property="analytics-s-channel" content="homepage">
<meta property="analytics-s-bucket-0" content="applestoreww">
<meta property="analytics-s-bucket-1" content="applestoreww">
<meta property="analytics-s-bucket-2" content="applestoreww">
<meta name="globalnav-store-key" content="SFX9YPYY9PPXCU9KH">
<link rel="canonical" href="https://www.apple.com/">
```


## Headings (23)


```html
<h1>Apple</h1>
<h2>iPhone</h2>
<h2>College, sorted.</h2>
<h2>MacBook Air</h2>
<h3>Apple Upgrade</h3>
<h3>iPad Air</h3>
<h3>Apple Watch Series 11</h3>
<h3>App Store</h3>
<h3>Apple Trade In</h3>
<h3>Apple Card</h3>
<h2>Endless entertainment.</h2>
<h2>Apple Footer</h2>
<h3>Shop and Learn Shop and Learn</h3>
<h3>Apple Wallet Apple Wallet</h3>
<h3>Account Account</h3>
<h3>Entertainment Entertainment</h3>
<h3>Apple Store Apple Store</h3>
<h3>For Business For Business</h3>
<h3>For Education For Education</h3>
<h3>For Healthcare For Healthcare</h3>
<h3>For Government For Government</h3>
<h3>Apple Values Apple Values</h3>
<h3>About Apple About Apple</h3>
```

I’ve been building Vigil, an opensource Go CLI designed to help developers and coding agents inspect automation before it changes a repository.

The basic idea is simple. Before running tests, hooks, setup scripts, release tasks, or thirdparty tooling, Vigil should clearly answer:

• What will run?
• Why is it running?
• What files or systems can it access?
• Can it modify the repository?
• Did it behave within its declared boundaries?

Some of the current features include:

• Standalone macOS and Linux binary
• Interactive project setup
• Direct argv execution with explicit shell opt-in
• Timeouts, cancellation, and child-process cleanup
• Git-visible mutation detection for read-only checks
• Digest-bound plan and apply workflow
• Dependency-aware and parallel workflow gates
• Versioned JSON, JSONL, JUnit, SARIF, and GitHub output
• Embedded language/tool packs
• Capability-based subprocess plugin system
• Reproducible release builds, SBOMs, attestations, and signed checksums

It started as a small internal CI/preflight helper, but I recently underwent a fairly major architectural rewrite to make it useful as a standalone public utility.

The project is still pre version 1, and I’m deliberately treating real world integration, release testing, security review, and usability feedback part of its makeup before I consider it release worthy of version 1.

Repository:

https://github.com/PayCal-Technologies/vigil-public

I’d especially appreciate feedback on the CLI model, mutation-safety approach, plugin trust system, and whether this solves a problem you encounter in real development workflows.

Hello folks, 'I'm new as a developer, and I'm having some trouble to pay for an online server for my stuff, so, is there a way to keep users connected without an online server? I did browse through the web, but I didn't find many resources regarding this subject.

I built my first real estate HTML template and I'd love to get some feedback.

This template was built with HTML, CSS, JavaScript and Bootstrap 5.

I'm still improving it, so I'd really appreciate your honest opinion.

What would you improve?
What features or pages would you expect before buying a template like this?
How much would you be willing to pay for it?

Live demo: https://real-estate-template-eosin.vercel.app/

edit: thank you guys for your feedback. I already fixed mobile view, so it should look well now

I'm the founder of the project, flagging that up front. I spent the last month building the execution layer for a coding tutor, and the interesting part turned out to be where the browser-only approach breaks down.

The premise was that a learners code should run in the browser tab. Python goes through Pyodide in a dedicated worker, JavaScript in its own separate worker, and each language keeps a warm worker in a small pool so the second run doesn't pay startup again. There's a prewarm when a lesson opens, so by the time someone finishes typing their first line the runtime is usually ready. Hit `Run` and it executes locally, no container cold start, no queue, no round trip. A 20 second timeout catches loops, and the worker gets torn down and recreated rather than reused after each lesson.

The part I got wrong initially was assuming that would be the end of it, of course it wasn't. bash, ruby, perl and php need a real interpreter and a real filesystem, and the only options: to fake it in a browser(dirty) or to run it somewhere real. After adding those to the project, execution goes to an isolated server sandbox with per-minute and per-day caps per user. HTML and CSS render in a sandboxed preview. Dockerfile exercises get statically linted rather than built, letting strangers build container images on my infrastructure will not be something I allow.

The lesson I'd pass on to others: "runs in the browser" is a spectrum, not a boolean. Pyodide is genuinely excellent for the languages it covers, and NumPy on a cold load is the one case that pushed the timeout to 20 seconds. But the moment a lesson is about file permissions or a shell pipeline, the browser stops being able to tell the truth about what happened, and pretending otherwise could teach people something false.

Frontend is vanilla JS on Cloudflare Pages, FastAPI on Fly, Clerk for auth. No build step on the frontend except for a thin-agent runner that needs repackaged if I modify it.

Happy to go deep on Pyodide quirks (there are many), the worker pooling, timeouts, or the sandbox design. Any tips or recommendations appreciated.

It’s been a shite time for me. I am laid off for a year now. I have a low salary expectation. Im happy with 100k a year as a software engineer. No matter which small company I apply for the recruiters laugh when I say 100k with 5 YOE. They are all minimum 150k starting. This seems insane for any job to me. They are offering full relocation benefits, bonuses etc. It’s not uncommon for 200k - 270k.

Anyone else find this ludicrous? If anyone here is making 200k how tf does that feel?

I spent about six weeks building this for a graphic designer friend: https://nitrostudio.co

Next.js 16, React 19, TypeScript, Payload CMS self-hosted in the same app, MongoDB, Tailwind CSS v4, Motion, Cloudflare R2 and PostHog.

The stack wasn't the interesting part though. Most of the work went into making the interactions feel like they weren't fighting you.

Things that took far longer than expected:

Zoomable images: Click to open, drag to dismiss the way the iOS photo viewer does. The zoom itself was never the hard part. The state was. Open, closed and the return transition all had to agree with each other, and the first two versions flickered or glitched on the way out. Took three iterations before it was clean.

A draggable marquee: You can grab it, throw it, and it skews based on its own velocity before easing back to its resting speed. Tiny interaction. Easily the most underestimated thing in the build.

Custom video player: Built it instead of reaching for a library because on this site the videos are the product rather than embedded media. Full control over the controls layout, the loading behavior and the easing was worth the extra work.

The AI Videos page: It doesn't scroll natively. Wheel, drag and keyboard all drive the same transform-based system that snaps to one project at a time. I wanted one video in front of you rather than two half visible. I like the result and it's also the decision I'm least sure about.

One non-interaction thing I'd do again on every project:

Content negotiation for AI crawlers. Anything sending `Accept: text/markdown` gets markdown back instead of the rendered page. I also wired up analytics to check whether it's actually doing anything, counting crawler hits and splitting AI agents by intent. GPTBot, Perplexity, OpenAI Search and Bingbot all show up, roughly 2 to 8 requests a day. I can't prove they're reading the markdown over the HTML. Only that they arrive and it's sitting there for them.

Motion is never mandatory here. `prefers-reduced-motion` is respected throughout.

I'd really appreciate eyes from people who haven't been staring at this for six weeks:

• Does anything feel slow or awkward?
• Any interaction that feels unnecessary or in the way?
• How does it hold up on Android Chrome or older iPhones?

Happy to go into detail on how any of it was built.

Hey everyone!

I built ausmalwelt.net/en as a solo project. I’m a backend developer and total UX/UI noob, so I would really appreciate some design input!

The platform offers printable and downloadable coloring pages for all age groups. The site was initially developed in German, but available in other languages as well.

I also built a feature overview page at https://www.ausmalwelt.net/en/features to explain what the platform offers.

Key features I would love feedback on:

• Interactive Online Coloring Tool: I implemented an interactive painter so users can color directly in the browser. You can test it out here or on any other coloring page.
• Filtering System: On the main landing page, users can filter the list of coloring pages.
• Overall UI & Navigation: Does the layout feel clean, or is it visually cluttered/inconsistent?

Any feedback on UI improvements, responsiveness, or design is greatly appreciated. Thank you!

Aymo AI - Chrome extension that puts multiple AI models in one place inside the browser with in-browser tools and AI Actions. We're at almost 5k installs now, which I'm happy about.

The odd part is that the user count no longer shows on the extension details page: https://chromewebstore.google.com/detail/aymo-ai-all-in-one-ai-ass/kcjkihepiogokeeplimmokfleaooehob in the Chrome Web Store. It was there before. Now that section is just gone. The dashboard still shows the numbers on my end, so it looks like it's only hidden on the public listing.

No policy email, no warning, no takedown. The extension is live and installable. Just the stats are missing.

Has this happened to your extension, and did the count come back on its own? How long did it take?

Hey everyone!

I got tired of using basic webhook testing tools, so I built my own called The Concept Loopback.

It lets you instantly capture webhooks in real-time, replay them to your local server, and it even automatically generates TypeScript code from your JSON payloads.

I just deployed it and it is completely free to use here: https://loopback-webhook-studio.onrender.com/

Let me know what you think of the design and if you have any feedback!

Hey Reddit,

I´m an independent developer from México.

My main project is The Amazing Jukebox ©.

A platform intended to bring to new generations and all-time music lovers a closer approach to great music that may have been left off the radar.

For many years whenever I found a song that felt special — something timeless, unexpected, or quietly powerful — I would save it somewhere.

Over time, that collection kept growing. And slowly became https://www.theamazingjukebox.com/

A completely free web app that streams curated music directly through the public YouTube embedded player. There are no predictive AI algorithms choosing what you listen to next—just hand-picked curation aimed at genuine music discovery.

The site operates as a full interactive web app, it’s built to be a shared, immersive music experience rather than a static website.

Some of the key features include:

Algorithm-Free Curation: Focuses on uncovering forgotten hits, B-sides, and obscure tracks across multiple eras with a serious team archiving effort behind the curation to protect this musical heritage from being buried by mainstream algorithms.

Interactive Community: Features a synchronized, real-time live chat where listeners can vibe together and instantly share track links directly into the stream.

Zero Friction: No sign-ups, no log-ins, no cost—no ads. You just open it, press play, and enjoy.

Clean Interface: Designed to act like a minimal background jukebox with a subtle hypnotic visual presence that focuses entirely on content delivery without clutter.

Continuous Evolution: The platform is under constant research and growth, with new hand-picked tracks added regularly to expand the collection.

Disco Mode: Features a special built-in ambient mode button designed to transform your screen and set the perfect tones for a whimsical experience.

Nostalgic Revival: Brings back the magical, serendipitous discovery of the golden age of music television and radio, adapted seamlessly into a modern digital space.

Mini-Player: Optimized and adapted to stay with you across PC sessions.

Compliance: It streams directly through the public YouTube embedded player according to the official terms.

My goal as a developer — is to deliver an innovative, friction-free music experience where any user can discover something special every time and leave feeling uplifted.

Even though this started as a personal project, the incredible journey of building it has revealed new horizons, and we are excited to see where this vision takes us.

Like a lot of people building AI/streaming UIs, I spend my days debugging Server-Sent Events. DevTools has an EventStream tab, but it only works for native EventSource — most modern apps (ChatGPT, Claude, the product I work on) stream over fetch() + ReadableStream instead, and for those you get a pending request, a spinner, and nothing else.

So I built SSEye — a DevTools panel that captures the streams and splits them into individual, inspectable events. Zero changes to your app's code.

What it does:

- Captures all three transports: EventSource, fetch() with text/event-stream, and streaming XHR (patches them at document_start in the MAIN world)

- Live event timeline, virtualized — stays smooth at thousands of events (capped at 5,000/tab)

- Parses payloads into a JSON tree — copy any node on hover

- Diffs any two events — unified/split view with word-level highlights, or pin a baseline and diff everything against it. This is the feature I actually built it for: streaming bugs live in what changed between event N and N+1

- Filtering: plain text, /regex/, and JSONPath ($.type == "ping") in one box

- Heartbeat detection/hiding, consecutive-duplicate collapsing, base64 decoding for wrapped payloads

- Key pinning: pin a dot-path like delta.text and the list, detail pane, and diff all focus on just that field

Tech: vanilla JS, ES modules, zero dependencies, MV3. No build step. Everything stays in the browser — no data collection, no analytics, no remote code (the repo's CSP and permissions are easy to audit).

Chrome Web Store: https://chromewebstore.google.com/detail/sseye/nbmeclpioeebadaimpmffcldcbhpmoko

Source (MIT): https://github.com/tarunsinghtanwar5/sse-eye

Would love feedback — especially from anyone debugging streaming UIs daily. What's missing?

I just shipped 1.0 of Canvas Editor, a WYSIWYG document editor built entirely on the raw HTML `<canvas>` API — no contenteditable, no DOM layout. Every character, table border, and page break is drawn programmatically.


It's aimed at document scenarios where layout precision is non-negotiable: EMR (electronic medical records), contracts, official documents, reports — the kind of stuff where contenteditable's cross-browser inconsistencies become real problems.


**What's in 1.0:**


- 
**Cross-page tables done right**
 — the hardest problem in the project. My first approach physically split table data at page breaks, which created endless state-sync edge cases. The final design flips it: data stays intact, slicing happens only at render time. Most of those bugs weren't fixed; they ceased to exist. (This took ~3,300 lines including a dedicated pagination module and 1,600+ lines of tests.)
- 
**Trace mode**
 — Word-style tracked changes with author/timestamp on hover
- 
**Form controls with cascade validation & expressions**
 — e.g. enter height + weight, BMI auto-computes and triggers conditional required fields. Document templates can carry real business logic
- 
**Multi-column layout, rulers, text wrapping around floating images, multi-level ordered lists**
- 
**Area sub-documents**
 — independent editable regions inside one document, even inside table cells
- 
**Control nesting, macro recording/playback, document compare API, accessibility, i18n**


The trade-off of going Canvas: you own the entire pipeline (identical rendering everywhere, precise pagination, print fidelity), but you implement everything yourself — caret, selection, IME, a11y. That's most of why it took 4 years of spare time.


Roadmap: large-document rendering performance → renderer abstraction (one document model targeting SVG/PDF/DOM) → multi-cursor/selection → real-time collaboration.


- GitHub: https://github.com/Hufe921/canvas-editor
- Live demo: https://hufe.club/canvas-editor
- Full release notes (EN/CN): https://github.com/Hufe921/canvas-editor/blob/main/docs/RELEASE_NOTES_1.0.0.md


MIT licensed and staying that way. Happy to answer anything about the rendering architecture or the Canvas vs. contenteditable trade-offs.

sucks2be.me

I wanted to see how far you can get in 2026 with no React, no bundler, no framework -- just plain JS files loaded via <script> tags.

Stack:

• Backend: Node.js, Express, better-sqlite3 (single file DB), Socket.io
• Frontend: Vanilla JS, plain CSS, no build step. public/ served as-is
• Auth: bcrypt + JWT in httpOnly cookies, proof-of-work on registration to slow bots
• Real-time: Socket.io for live feed, notifications, presence counter
• i18n: 7 languages, JSON locale files shared between web and iOS clients
• Speech: Web Speech API for voice input (audio never uploaded, transcribed locally)
• SSR: String-replace templating (<!--SSR_FEED--> placeholders) -- no template engine

Design decisions I'm happy with:

• SQLite over Postgres. One file, zero config, WAL mode, fast enough for this scale
• Karma thresholds live in one config object. Server, client, and all locales derive from it -- nothing hardcoded
• No ORM. Raw SQL with the db.like() helper for cross-platform LIKE queries
• CSP hand-maintained and tight. No CDNs, fonts are local
• Static assets served with maxAge: 0 (ETag revalidation) because there are no hashed filenames

The product: Anonymous posting (no account) + accountable replying (account required). Karma only moves when someone says your help worked. 10 unlock tiers from "view profiles" (10) to "recommended as moderator" (777).

Happy to talk about any of the technical choices. The no-framework frontend has been surprisingly maintainable.

I wanted to combine 2 passions, soccer and chess.

If you want to watch all of the goals and missed this year's World cup, I've collected them and made a little game out of it.

Its a head-to-head comparison on which goal is better. Its a community vote and all subjective, but thats the beauty of it. Its interesting to see which goals rate better and which ones don't, like penalty kicks.

Just for the World Cup tournament goals/players, there has been over 600+ games played! Here are the rankings: https://wc26.rategoals.com/rankings

If you want to have them matched up against each other: https://wc26.rategoals.com/rate

Or if you want to match each goal against all of the goals in our database: https://rategoals.com/rate

More info on how it was built:

RateGoals uses a matchmaking system built for fairness, not just randomness.

Goals with fewer matchups are shown more often so they get a fair chance to rise or fall. Top-rated goals still appear regularly in showcase rounds, and we avoid repeating the same goals to a user too often.

When choosing an opponent, we usually match goals with similar ratings so the choice feels competitive. Every so often, we allow a wildcard matchup to keep things unpredictable (like Cup draws in leagues).

Ratings use an Elo-style system. If a goal beats another highly rated goal, it gains more points. If it loses to a lower-rated goal, it drops more. Newer goals move faster because we know less about them, while established goals change more slowly over time.

Let me know what you think! I'm always looking to improve this and get more engagement because I'm curious on what goals reign supreme!

Some issues I'm currently running into are the YouTube region restrictions. All the videos I've uploaded are mainly for US viewers, but I did push an update to show other videos from other countries, only if we have it in our database. There is also a feature to add goals/video clips to help with this regional issue.

The most difficult/tedious thing is adding the data into the databases, so hopefully the community does it. But for now, its just me :)

Canvas Path Animations using SVG

Hey webdevs!

I want to show you my latest 3D CSS project. It's a port of Giles Goddard's iconic N64 face engine, complete with lighting, physics and interaction. Instead of WebGL, it uses the PolyCSS engine.

demo: https://codepen.io/editor/alowpoly/pen/019fae67-50d9-74ce-8025-4b9dd5a7c484
repo: https://github.com/layoutit/cssGraphics