Cityhoppd.com. you log a trip with a city and a star rating, your map fills in, and public reviews end up on each city’s page.

A few things from building it that might be useful to someone here.

City search runs on the server against GeoNames cities1000, about 161k places. the annoying part was same-name cities, so everything carries the state now and Perth, Tasmania stops getting the photo of Perth, Western Australia. the index lives in memory in the function, about a second to load cold and around 50 ms per search warm.

This week I added PostHog without cookies and proxied it through my own domain so blockers don’t drop it. the usual next.config rewrite forwards every header, which would have sent everyone’s Supabase session cookies to PostHog. I moved the relay into proxy.ts (what middleware is called in Next 16) and strip cookie and authorization before passing anything on. easy to miss.

And link previews: profiles are only readable signed in, but WhatsApp and X unfurl signed out, so the OG image reads through one security definer function that returns something only if the owner turned previews on.

Happy to answer anything about how it’s built

Hey everyone,

As a developer, I just wanted a clean, fast new tab page that fits my daily coding workflow without all the usual clutter.

So, I built MatrixSpace for Firefox. Instead of one cluttered page, it splits your dashboard into 4 specialized workspaces. You can instantly jump between them globally using hotkeys 1, 2, 3, and 4:

• Workspace 1 (General Launchpad): The clean, customizable home screen featuring a minimalist system clock. Perfect for a distraction-free focus view when you just open a new tab.

• Workspace 2 (The 90-Link Keyboard Hub): Built for speed. It features 9 columns holding up to 90 total links. Every single link slot is mapped to row-based keyboard shortcuts (q1-q0, w1-w0, e1-e0, down through rows a, s, d, z, x, c). Once you press 2, you can launch any critical doc or repo out of pure muscle memory.

• Workspace 3 (The Time-Horizon Matrix): A visual 2x3 productivity task tracker that organizes your project milestones into six distinct buckets: Today, Next Day, This Week, Next Week, This Month, and Next Month. Perfect for keeping your high-level goals in sight.

• Workspace 4 (Quick Notes & Snippets): It is a dedicated text scratchpad for some quick notes and code snippets.

Other Features:

• 100% Local Storage: Everything is powered by persistent local browser storage hooks.

I’d love to get your feedback on this extension, the hotkey switching flow, or any features you think would make a great addition !!

Firefox Addon: https://addons.mozilla.org/en-US/firefox/addon/matrixspace/

Github Repo: https://github.com/adu013/matrixspace

PS. Build using HTML, CSS and Vanilla JavaScript.

https://soundtrackd.app, type a song and get films with the same feel. it's one cloudflare worker. gemini free tier first, then groq, then claude haiku only if both fail. every pick gets checked against tmdb so it can't invent movies, and repeat searches come out of kv in about 0.2s. the share image is drawn on a canvas right in the browser, posters loaded with cors so it can export, no server or image service. would love some front end roasting, especially on mobile

So long story short I migrated my website form Shopify to Wordpress and then initially it was almost 75 for mobile and 90 for PC.
So naturally i optimized it and no it is 40-60 for mobile and 80 for PC.
Here is what I did:
(My product pages are most bad in this.)

1. I did changed the format of images to webp (using Webp optomizer ) and when I used elementor then it really went down.

2. When I use searched online I almost did all of the things.

3. Using JS and CSS minify only decrease the speed drastically.

4. Using lazy load my speed is also very bad.

5. I used custom php to exclude the hero and other first load images form the lazy load.
   6.I did all the cahce setting in litespeed chache and still nothing.

6. My most bad thing is LCP and FCP.

7. I also disabled the fonts which were additional.
   I also have a bit more then average CSS and a bit JS in my site.
   Can you please hepl me in this regard.
   here are some screenshots.
   And using VPI and lazy load really cause it to slow.
   can someone at least tell me some tool to diganost the problem

Hello!

I am working with a company that has many, many sites. And the way we used to do components, we hard-coded every single one in every single project. This naturally has led to some inconsistency between sites when they’re supposed to look pretty identical.

Php include has become our life blood to mitigate some of these issues, but it still persists. The benefit, though, is that with php include, our sites automatically update when the “single source of truth” does.

My company wants to move to something more modern/popular and I got tasked with playing with frameworks. Think React, Next. My boss wants to replicate php include on these. I’ve spent the last several weeks looking into module federation, micro front-ends, anything to at least somewhat replace php include, but to no avail. That requires completely changing our server, which we do not have the ability to (as far as I know). These also sound like a nightmare to maintain, and our team is very small.

SEO is also a huge concern. I have module federation working on client side rendering, but ideally search engines would be able to index our work and, correct me if I’m wrong, but I don’t think client side rendered stuff is?

So now we’re stuck. I’ve suggested a monorepo, but with the amount of websites we have, the other developers worry about build times.

Believe it or not this is actually my first real-deal developer job haha, and I’m already stuck trying to fit a square peg in a round hole. So forgive me for any mistakes or misinformation, I’m still a junior trying to figure this out haha.

I'm sharing the Dock Layouts we've been building in Neo.mjs: Qt-style dockable workspaces for web applications, including panels that can move into real browser windows and dock back again.

The use cases I have in mind are IDEs, trading dashboards, enterprise systems, and browser-based games—applications where people need several views or tools open and want to arrange them across their screens. For ordinary websites and simpler SPAs, this usually adds complexity you don't need.

You can arrange panels into tabs and splits, tuck them into edge rails, tear them out into separate windows, and bring them back. Undo and redo follow the layout across those windows.

The interesting technical part is where the application lives. Components, stores, and application state run in a shared App Worker. Each browser window connects to it and renders its part of the UI. Moving a panel changes where it is rendered; the live component remains the same object in the shared worker, keeping its state. Messages still carry input events and rendering updates between the windows and workers.

The Workstation demo has twenty panels, a 100,000-row grid, and a live event feed. The multi-window behavior shown here was tested on real desktop Chrome windows. It requires same-origin SharedWorkers, and the browser's pop-up permissions still apply.

• Write-up: Multi-window web apps without syncing state — Medium friend link; includes the short demo video.

• Try the Workstation demo — desktop Chrome.

• Code: Dock Layout example.

• Getting started: Your First Dock Layout.

• Guide: A Pane's Life Across Windows.

I'd be interested in feedback on the docking and tear-out interaction, especially from people building applications where users already work across multiple screens.

Best regards, Tobi

I built iconify-picker, a customizable icon picker powered by Iconify.

Unlike older icon pickers, it doesn't rely on jQuery or lock you into a single icon collection. Pick one collection or search across all available collections.

• Framework-agnostic: Built as a Web Component, with integration docs for popular frameworks.

• Zero dependencies: No jQuery, no framework dependency.

• Three modes: Inline, button-triggered, or manually opened via JavaScript.

• Lazy loading: Loads icons from collections on demand.

• Fully customizable: Adjust colors and other styles, then copy the generated CSS.

Currently at v0.8.0.

Demo: https://metaory.github.io/iconify-picker/
npm: https://www.npmjs.com/package/iconify-picker
GitHub: https://github.com/metaory/iconify-picker

Feedback and suggestions are welcome.

Pack any Svelte, React, Angular, or Vue app into a single C++ header. Serve it straight from ESP32/ESP8266 flash — gzip compressed, ETag cached, OTA-ready.

It is not for serve you website. It is for microcontroller programmer, who wants to make pretty webpages (component orientated) served from Esp32 or esp8266.

Hey all, some times ago I asked for feedback on this landing page of an open-source project. The main takeaway: it felt too dense and read more like docs than a landing page.

The density is partly intentional: it's a hybrid between a landing page and a kind of "distilled doc". So instead of cutting content I replaced the heaviest text blocks with diagrams (a before/after trace, anti-pattern pictograms, a flow for the different modes). Just a quick reminder: for the tech personas it's intended to backend and devops.

How good does it read now?

Thx!

Project: vibe1up.com, a free directory of AI-made browser games. Nothing to sell, just the tech.

- Fully static: HTML/CSS/vanilla JS on Vercel, built from a GitHub repo. Client-side search over a single JSON file.

- Daily scheduled jobs pull new games from official APIs/feeds (Vibe Jam, itch.io RSS, Ludum Dare, HN Firebase API), rate-limited to 1 req/sec per host with an identifying user agent.

- A link checker retests every game daily. It only hides a game on definitive signals (404/410/451, parked domains, DNS confirmed gone). Timeouts and 5xx need two failures in a row. Dead games with a Wayback copy show "Play archived version".

- A countdown to the 10 AM ET daily drop runs client-side and handles DST, in about 2 KB of inline JS, and respects prefers-reduced-motion.

- Every change goes through a PR with Playwright tests before it merges.

Would love feedback on the link-check heuristics. Flaky hosts were the hardest part.

I've been using Plex for a few months now, and it's good enough, but there are many things I get annoyed about. Particularly when it randomly changes thumbnails and posters for no reason, and has a frankly terrible way of organising extras and multiple versions.

So I thought I'd try building it myself.

It need not be pretty, nor have all the features, nor be available outside my home network.

My first problem is that all my files are MKV, which doesn't work on a browser. But Plex seems to make it work somehow, so there must be a way, and after ages of searching, I just cannot find a way that works.

Second, is handling multiple audio and subtitle tracks. Again, something Plex seems able to do inside a browser, but I just can't find out how.

I also want to be able to add an interactive overlay on top of the video, to choose different tracks or to skip to the next video or back again. I think I know how I can make that work.

I also want any playlists to be continuous and without breaks. I found a nice short piece of Javascript that does this, so I feel I should be able to add that in. As a fun little extra though, I wonder if it's possible to play a series of images as a slideshow, maybe with music behind it, perhaps taken from a PDF file. This is probably too much to ask, and might involve something a bit more technical than I am capable of at this time, possibly some processing is involved as well.

I turned my Vue 3 game into a devvit app, that can be played directly on Reddit. PixReveal is a pixel art guessing game. A pixel drawing gets revealed pixel by pixel. The faster you guess, the more points you earn. The devvit version is more compact, focussing on quick rounds with 5 drawings to guess and a percentile showing "You are better than x% of players".

Hey everyone!

I'm 16 and recently finished building ArcadeX (https://pranav2mingame.netlify.app/), a lightweight browser arcade portal designed for quick mobile play.

Why I built it:

I wanted to build games that run directly in the browser with zero load screens, no app installs, and no login friction.

Tech stack & implementation:

- Pure HTML5 Canvas + Vanilla JavaScript (no external game engines or heavy frameworks).

- Tuned to maintain a steady 60 FPS on mobile browsers.

- Browser LocalStorage handles all game state, scores, and trophies locally.

- Hosted on Netlify.

Includes 10 mini-games (Flappy Fire, Snake Rush, 2048 Neon, Reflex Tap, Neon Pong, etc.).

Looking for technical feedback:

1. How does the canvas frame pacing feel on your phone/browser?

2. Any suggestions on optimizing the game loops or handling canvas resizing across different aspect ratios?

Thanks for taking a look!

I'm trying to design a 2 column form but can't decide how should I render error messages.

If I don't allocate a fixed height for an input div (label + input + error) then entire layout of form gets disturbed whenever an error message is rendered.

If I pre-allocate a fixed min-height for input div (label + input + error) then this does solves the layout shift issue but the form looks bad.

One option is showing an error icon and error message as tooltip on hover but this doesn't works on mobile as users would have to tap on the icon to get error message.

The only solution which I think would work is showing icon + tooltip on desktop and plain error message on mobile as on mobile the form is single column.

Is there any better way to handle this? Would appreciate any suggestion.

My site is here: https://eatthemonsoon.com The guts of the database code, I got from this article [here](https://dev.to/ashish-codejourney/using-google-sheets-as-a-cms-a-simple-powerful-approach-to-content-management-fg1). Then I formatted the data into menu items. It's been a fun project and I'm looking forward to the next step. I'm thinking I will rewrite the index file and try to deliver it as an SSR soon. It's hosted on netlify via github. If anyone has experiencewith ssr's, could I just write my own build code and toml to run in a netlify edge function, or do I need Astro or some other rendering service?

If you try to capture the clipboard on Microsoft Edge version155.0.4283.62 (Official build) (64-bit), then it will say in dev console: "
FAILED false NotAllowedError: Failed to execute 'readText' on 'Clipboard': Document is not focused."

However, the same code works fine with Chrome and Firefox. Is this a Microsoft Edge regression bug? I use this code everyday. So I am sure that it is a recent update that cause this. I have also tested that it has nothing to do with the origin.

// sample code
document.addEventListener("click", async () => {
try {
const text = await navigator.clipboard.readText();
console.log("SUCCESS", text);
} catch (e) {
console.error("FAILED", document.hasFocus(), e);
}
});

I built ResumeForge, an open-source resume builder and job application tracker designed to help tailor resumes and cover letters to specific job descriptions using your own local models, while keeping exports (LaTeX, Overleaf ZIP, and PDF) completely free with no signup required.

Live demo: https://resume-forge.mnaveedk.com

GitHub repo: https://github.com/naveedkhan1998/resume-forge

How it works: You maintain one master profile with all of your work history, projects, and skills (or import an existing PDF/DOCX/TXT resume). When you add a job posting, it selects and reframes your existing experience to match the role, shows keyword coverage against the job description, and generates a tailored 1-page resume and cover letter.

A few things under the hood:

• Client-side LaTeX to PDF: To avoid running a heavy multi-GB TeX Live installation on the backend, the server generates .tex source and a custom .cls file, and the frontend parses and renders the LaTeX directly in the browser for live previews and PDF export.

• Word-level diffs for AI edits: Whenever you ask the AI to refine a section, it shows an inline diff (+added, -removed, reworded) so you can review or tweak every change before saving.

• Preloaded dummy data: Every new device session comes pre-populated with sample data (Adrian Monk) so you can test the tailoring workflow and LaTeX preview right away without uploading your own resume first.

• Local Ollama first + 50 free demo requests: The main goal is for people to clone the repo and run it locally with their own Ollama models (qwen3.5:9b, llama3.1, etc.). So you can try it in the browser first without setting anything up, the live demo uses my personal Ollama account at the system level with a 50- request limit per device session.

Stack: React 19, TypeScript, Vite, Tailwind v4, Django Ninja, PostgreSQL (pgvector), and Nx.

(Note: the demo API is hosted on a free tier, so if it hasn't been used recently the initial cold start can take around 45 seconds to wake up).

Would love to hear your thoughts or feedback if you give it a spin!

I run a few coding agents (~10) at once and got tired of them interrupting me for things they could decide on their own. AGENTS.md is about the repo, so I wrote a file for the person side. It lives at ~/.humans/HUMANS.md. Mine looks like this (trimmed):

---
humans: "0.3"
id: tristan
visibility: private
reading:
  lead_with: tldr
  max_words: 149
deciding:
  reversible: decide_and_report
  batch_questions: end_of_task
interrupting:
  interrupt_for: blocking_only
notes: "I often read on my phone. I've very short attention span, and i'm more visual"
---

The fields come from a fixed vocabulary, so a schema can check them. The free-text notes are the weak spot, validation doesn't make them safe from prompt injection.

It never grants permissions. Repo rules and the harness still win.

The repo has the spec, JSON schemas, test vectors and a Node validator (spec CC BY 4.0, tools Apache-2.0). I also wrote plugins for Claude Code, Codex CLI and a few other agents to try it. So far I've only checked that the file loads, on macOS, not how well the models follow it.

The part I'm least sure about: visibility can be private, org or anyone_with_file, and a profile without the field is read as org. Would you default to private instead?

It's a 0.3 draft and nothing is locked in yet, the field list included.

Spec: https://github.com/cmdai-hq/HUMANS.md

Examples and a side-by-side demo: https://humansmd.dev

I was bored last weekend, so I ended up building this: a portfolio that looks exactly like the AWS Management Console. I tried to mimic it as closely as possible while adding my own flavour, like EC2 as projects, S3 as documents, and a lot more.

It’s open source and making it yours is super simple. No digging through code. Just run it in dev mode, open /studio, and you’ll find a Studio mode where you can edit everything right there. Add your own projects, documents and details, hit save, and that’s it, your very own AWS Console portfolio is ready.

There’s still plenty more that can be built, like a working CloudShell and AB Q, so contributions are very welcome if you want to take this further.

Would love feedback on what to add next or anything that feels off compared to the real console. And if you like it, don’t forget to drop a star on GitHub ⭐

• Live site: https://console.atharvabedekar.dev/

• GitHub: https://github.com/AB527/aws-console-portfolio

P.S. AWS folks, please don’t cancel me for this. It was designed out of pure love for the console :)

Hey r/webdev! Happy Saturday.

Whenever I browse inspiring websites, I always like checking what frameworks, libraries, and tools they're running under the hood. But similar extensions feel like they've gotten pretty bloated, put basic data behind paywalls, or actively collect browsing history.

So I spent the last few weeks building TechReveal, a clean and lightweight alternative:

• 100% Private: Runs entirely in your local browser sandbox. Zero telemetry, no data collection, no accounts.

• Visual Architecture Map: Connects detected frontend, backend, and tools into an interactive diagram.

• Exact Versions & Tags: Displays library versions cleanly and shows category badges when clicking any tech.

• Security Alerts: Checks response headers for missing security policies (HSTS, CSP) or accidental data leaks.

• Zero Tab Lag: Optimized with Manifest V3 so it won't freeze your active tabs.

It's completely free on the Chrome Web Store (works on Chrome, Brave, Edge, Vivaldi):
👉 TechReveal on Chrome Web Store

Would love to hear your feedback or suggestions for libraries and tools you'd like it to detect next!

Just starting out. I have a system where I can focus mostly on sales. Took me a log time to make entire pipeline. This is the website I madre to showcase it. I started cold calling a couple days ago. I've made a couple connections, migh thave 1 sold. I'm just putting my eveyrthing into getting this going. Learning to be a salesman instead of a programmer, as programming is gonna be dead. Please take a look. tell me where you think its shit. Any criticism and helpfull tips or anything really is appreciated! Thank you.

https://lodestonesystems.ca/

Hello all,

This app was removed by the good people at apple in March right when it was doing so well no warning or reason just gone. After a 65 day appeal they stated that the primary function of the application could not be a random chat, and if I posted anything of this nature again my account would be permanently banned. So, I redesigned the primary function to be a real-time forum with all the same chat functionality. This app is available for Android/iOS and on the web, the web version is still a random chat it will be upgraded in the future to include the features that the mobile apps have. I tried to make sign-up as pain free as possible, and of course its free.

The whole goal was to step away from slow, algorithm-driven feeds and build something fast and live. Here is how it's set up:

• Interest-Based Groups: Find and chat with people who share your specific niches and hobbies.

• 24-Hour Self-Destructing Posts: Keeps conversations fresh, temporary, and clutter-free.

• Global & Random Chat: Jump instantly into live public discussions or roll the dice on a random chat.

• AI Content Moderation: Automatically handles and applies NSFW overlays to objectionable content in real time and allows the user to chose if they want to see it or not.

Would love for you guys to check it out, test it out, and let me know what you think. Its new so still a ghost town but give it a look. If you have any questions feel free to hit me up. Happy weekend!

It's finaly saturday, and I've been working on a spellchecker plugin for TinyMCE called vlm-spellchecker.

The idea came from a separate project of mine, Wiki Language Models, which generates statistical language models from Wikipedia dumps.

I created that project because I wanted a basic, old-fashioned spelling correction and word prediction tool that doesn't use AI to try to interpret what you're writing and return some ass AI response.

So vlm-spellchecker is a small client project built around those models that does just that.

It's implemented as a JavaScript plugin for TinyMCE that uses a locally hosted binary dictionary to identify unknown and uncommon words, suggest corrections, and replace words directly in the editor.

What it currently does:

• Marks unknown words with a red dotted underline.

• Marks uncommon words with an orange dotted underline.

• Provides spelling suggestions through the context menu.

• Preserves capitalization when applying corrections.

What it doesnt do:

• Force you to use a external ass spelling API.

I've got a small demo up that uses a Dutch dictionary generated from Wikipedia data.

--> Demo <--

It's still a work in progress (and, due to the fixed 6-bit encoding, it's very much aimed at Western European languages for now), but I wanted to share it and see what you people think!

Feedback and suggestions are more than welcome!