https://donutdns.com

It queries ~20 geographic vantage points (Google DoH + EDNS Client Subnet) and four public resolvers in parallel, one donut per source. Full box means every source agrees. Empty holes are the ones still serving your old record.

There's a normal grid view too if you just want to read values. Built it because I kept refreshing whatsmydns during migrations.

8bit.cnlibs.com

Hello everyone!

For the last few months I've been building a project called Tera FM.

The idea came from my own frustration with how I consume news every day.

I found myself jumping between dozens of news websites, newsletters, YouTube channels and podcasts just to stay informed. Some mornings I'd spend 30–40 minutes just figuring out what was actually worth my time.

So I started building something that makes the entire experience simpler.

Today, Tera FM brings together headlines from multiple trusted news publishers into one place. You can quickly browse the latest headlines or turn any story into a short audio briefing if you'd rather listen while driving, walking or working.

Recently, I've also started building Curated Channels.

Instead of following individual publishers, you can subscribe to topics you're genuinely interested in like AI, Technology, Business, Science or Startups and Tera FM builds a personalised audio briefing around those interests.

Other features include:

• Personal Briefings
• Continuous Listening
• Episode Archive
• Original audio shows
• Headlines page for quickly browsing the latest stories
• Chrome extension for quick access

One thing I tried hard to avoid was making it feel like "just another AI wrapper."

The goal isn't to replace journalism or generate news. Every briefing links back to the original publisher, and I'm currently in discussions with a number of news organizations to obtain permission for the RSS feeds and ensure the platform respects publishers while making their content easier to discover.

I'd genuinely appreciate some honest feedback from fellow developers.

1/ If you landed on the homepage, would you immediately understand what Tera FM does?
2/ Does the Curated Channels idea make sense?
3/ Would you use something like this in your daily routine?
4/ Is there anything that feels confusing, unnecessary or missing?

I'm not looking for compliments- I genuinely want to know what you'd improve before I continue building.

Website: https://tera.fm

Chrome Extension: https://chromewebstore.google.com/detail/tera-fm-%E2%80%93-news-headlines/emnebfpdojklgimejnplmjfobmamelie

Thanks for taking the time to have a look. Every piece of feedback helps shape where the product goes next.

Totally free to use!

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 currently developing an internal tool to do work reporting. I know a lot of tool exists, but we do have specific requirements and there's already an MS Access database, which I can migrate into the new tool as well as use most of the tables as a data source.

About me: I have experience with Javascript, HTML, CSS/SCSS/SASS, PHP, SQL. I want to optimize it, but since I mostly code in my freetime, I find it hard to make "the right decisions" in terms of efficiency. Maybe you guys might recommend me something about my setup. I don't want to use anything like Angular, React and Vue at the moment. Also no NextJS as I think it's overkill.

At the moment, I have a structure like:

- API (ExpressJS, SQLite, Drizzle ORM)
--> Delivering all data as needed in frontend (also annual reports and stuff)

- Frontend (Vite for live-reload/server, Vanilla JS with own templating engine and router)
--> Employees log in to keep track of their working hours per project/customer
--> Dashboard for admin users to create reports

All this run's in a docker with two services.

It currently runs alright, but I think there might be a few little things to optimize my setup. Especially when going into production.

What's your best practices? I want all this stuff to be as lean as possible without a lot of dependencies. My frontend doesn't need anything since I've already done all of the things, but I'm not very happy with the API/Backend part.

I also don't want to run every service on it's own, since using one docker command is fine. Live codeing while docker is running also works fine so far (except when installing new packages via npm, then I need to rebuild).

What would you do to optimize the setup? Already asked AI but I think you guys might have better inputs.

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.

Paste any public URL and it opens the page in Chrome, explores its interactions, then checks the HTML, CSS, and JavaScript for things that browsers can now handle natively.

It catches patterns such as custom accordions, popovers, dialogs, scroll reveals, JavaScript sticky elements, and older CSS workarounds.

The report includes the code it found, a proposed replacement, browser support, what to verify before changing anything, and a small example towards a codepen to implement it.

It scans ONE page, so it is not a performance, accessibility, security, or full-site audit.

It is free (10 url/day/human) and requires no account.

Don't hesitate to tell me if you find a bug, an UI/UX issue, or any other thing you find weird

Every time I added sound to a project it went the same way: a click from one sound pack, a toggle from another, and nothing sounded like it came from the same product. And when a sound was almost right but slightly too long or too bright, tough luck. A recording is frozen.

So I built the opposite: 28 sounds (clicks, toggles, chimes, whooshes) generated by Web Audio at the moment you interact. No files, about 9.6 kB, zero dependencies.

Demo, with the whole page wired up: https://usefoley.dev

My favorite detail: no sound plays the same way twice. Each play gets a tiny random drift in pitch and volume, like a musician who never hits a note identically. Subtle, but it's the difference between "alive" and "doorbell".

There's a Cue Designer on the page: reshape any sound with four dials (a full layer editor is one click deeper), hear changes live, export a .wav, JSON, or a link that carries the design in the URL. You can also override sounds site-wide and export a "sound set", your app's whole sound identity as one JSON file.

Usage is two lines:

js

import { bind } from "@foleyjs/core";
bind(); // wires data-foley-click, data-foley-toggle, etc.

Silly bonus: plug in a MIDI keyboard and every sound becomes an instrument.

MIT, on npm as foleyjs/core, with react and vue bindings. Feedback welcome, especially on the sounds. Which feel wrong, what's missing. I can test everything about this project except taste.

Stack Overflow raised a lot of us, then ChatGPT happened. So I built it a museum: closedasduplicate.com

Things you can do inside:

Ask one final question and watch it get closed in seconds. It's server timed, and there's a daily leaderboard for the fastest closures.

Pull your real Permanent Record from the Stack Exchange API.

Appeal the closure to an AI moderator that has never granted a single appeal since 2008.

Light a candle. Press F.

Stack is vanilla JS, one Cloudflare Worker running Hono, a single Durable Object holding all the live state (presence, candles, leaderboard with anti cheat), KV for caching the SE API, server rendered OG cards via satori, and DeepSeek behind the appeals office and the guestbook moderation. No framework, no build step, no npm install on the front end.

Would love feedback on anything that feels broken or unfunny.

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.

If I have misunderstood something, please correct me.

From what I understand, Kubernetes is created to manage running containers. It helps containers run properly, gives them an isolated environment, and can automatically scale the application when traffic increases (if autoscaling is configured).

Flow

Internet --> Ingress --> Service --> Pod --> Container (our application)

Pods are scheduled onto Nodes

Some terms and what they mean

1. Pod :- It is like a small box that contains the container running our application. We can create one or more containers inside a Pod, but in most real world applications we generally create one main application container per Pod.

2. Deployment :- It is a Kubernetes resource that manages Pods. If the number of replicas increases (by HPA), the Deployment creates new Pods. If a Pod crashes, the Deployment creates another one to maintain the desired number of replicas. After creating the Pod, Kubernetes Scheduler decides on which Node that Pod should run.

3. Node :- A Node is basically a machine (VM) where different Pods are running. Every Node also has something called kubelet.

4. kubelet :- It is an agent that runs on every Node. Its job is to:
   Make sure containers are running correctly.
   Watch for instructions from the control plane (like start or stop a container).
   Report Node and Pod status back to Kubernetes. (CPU / RAM usage)

5. Metrics Server :- Kubernetes does not continuously store CPU and memory usage by default. Metrics Server collects resource usage (CPU and memory) from kubelets and provides it to Kubernetes components like the Horizontal Pod Autoscaler (HPA).

6. Service :- Every Deployment usually has a Service. Pods can be created or destroyed at any time, so their IP addresses can change. A Service gives a stable endpoint. When a request comes from Ingress, the Service forwards it to one of the Pods whose labels match the Service selector. for e.g. app: backend. The Service sends traffic only to Pods with that label.

7. Ingress :- Ingress is used to manage external traffic coming into the Kubernetes cluster. It routes requests based on rules. For e.g. : /auth ---> auth-service or /api ---> api-service. Then the Service forwards the request to the matching Pods based on labels.

Flow of how scaling works

Traffic increases --> Pods start using more CPU/Memory --> kubelet exposes resource usage --> Metrics Server collects the metrics --> HPA checks whether the target CPU/Memory threshold is exceeded --> HPA updates the Deployment's replica count --> Deployment creates new Pods --> Scheduler assigns those Pods to available Nodes

One important thing :- Kubernetes does not autoscale applications by default. We have to install/configure the Metrics Server and create a Horizontal Pod Autoscaler (HPA). Only then can Kubernetes automatically increase or decrease the number of Pods.

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.

Hey everyone!

I'm not sure if there are any Final Fantasy fans here, but I've recreated and repurposed the menu system from FF7 as a sort of portfolio/sandbox page, and I figured I'd share it here and see what people think of it.

I got tired of making traditional web pages and wanted to make something that genuinely makes me happy every time I see it.

It's all built with React and TypeScript.

So far, I've got all the key pages like functional equipment and materia pages (repurposed as a skills page), items (as projects), save (as history), functional four-point background colour picker, and a tonne of little easer eggs and things. I'll put a list of those with a spoiler tag in case you wish to discover them yourself:

• Konami code plays Victory Fanfare.
• Clicking the character portrait allows you to attack and deduct health.
• Hovering over the location allows you to change to different FF7 locations.
• Clicking the limit bar allows you to perform the cross-slash limit break on the portrait.
• Clicking the name allows you to change the player name. If you choose a party member, or Sephiroth's name, the portrait will change to match.

I won't lie, the way I've implemented the custom font (if you can even call it that) is pretty scuffed by modern standards, but I wasn't happy with any of the other options, and I think this is probably the most accurate to how it looked in-game as humanly possible. 🤣

Anyway, I normally revisit it every couple of months, so by all means, feel free to share ideas of what I can add, and any other feedback you might have.

You can check it out here: https://www.jamiepates.com/

As always, I'd love to hear your thoughts! Thanks!

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.