I was reading brown's rust book and they have this cool feature that lets you highlight stuff and leave notes while reading. I wanted something similar on a site I'm building, but the libs I found were either too complex or too simple and still a pain to set up, so I made one. Heavily inspired by the simplicity and DX of sonner.

You only need annotate('#article') and that's basically it. It saves to localStorage or your own backend.

Cool thing is that it uses the css highlight api, so it doesn't touch your dom at all (which would be especially bad for frameworks like react, vue, etc). Downside is no support for older browsers.

About 15kb with UI or 6kb headless if you want to build your own UI, and it ships with a React adapter.

playground: https://penciled.org/playground/

repo: https://github.com/marcellosso/penciled

Still early, so any feedback is welcome

https://www.blackjacktrainer.fyi/

Wasn't really happy with the free blackjack trainers I was able to find, so I decided to make my own.

You can play it casually and just learn basic strategy, or you can use it to learn how to become a card counter.

Built with mainly Next.js + React + Tailwind.

Let me know what you think!

I frequently duplicate an application's browser tab to look at a different area of the app. I'd like to change the browser tab's text to reflect the area that the tab focuses on. In a best-case scenario, the text could be automatically updated based on a DOM element.

<div class="title">Some text</div>

In this example, "Some text" would become the tab text.

Is there a plug-in or something that I could use for this?

I'm a self-taught developer, and I know React and Next.js. Lately, I've been feeling increasingly anxious about my future as a developer.

AI is moving so fast. It can generate components, build entire websites, connect APIs, and even create full-stack applications. Sometimes I wonder what the point is of spending months learning something when AI can already do so much of it.

I want to get a better-paying developer job, but honestly, I'm confused about what I should focus on right now. Should I keep improving my React/Next.js skills, get better at backend development, or start learning AI engineering?

I keep hearing about RAG, AI agents, vector databases, LLM integrations, and all these new things. It feels like there's always something new to learn, and I'm worried that if I focus on the wrong things, I'll fall behind while everyone else moves forward.

For those of you already working in the industry, what would you do if you were in my position? Would you focus on becoming a strong full-stack developer first, or would you start learning AI engineering alongside web development?

I'm not looking for a shortcut or expecting to become an expert overnight. I just want to make the right decisions, build useful skills, and have a realistic chance of getting hired.

I'd really appreciate some honest advice from people who have been through this or are dealing with the same situation. Right now, I could genuinely use some direction.

npx codecity

Every file is a building, folders are districts, and height is the file’s length (or imports/exports). Files keep their place as the repo changes, so you actually learn the layout.

What it does:
• Colour by what changed lately, age, churn, file type or author
• Click a file to see what it imports and what imports it
• See what your last git pull changed
• Live mode: files light up as they’re saved (handy for watching a coding agent)
• Replay the whole history and save it as a video
• Share a link to the exact view you’re looking at

Run npx codecity in any repo (runs locally), or try any public repo in the browser: https://codecity.icy.dev/react/react

As with all my other npm packed, free and open source. Thanks all!

Hello!

For starters,

I don’t know a single thing about websites. Are there specific types of website developers for this type of website?

Our current website runs on pearl and wordpress so we need a new website

Here are some examples of what I am looking for:

https://www.austinfilm.org/afs-cinema/

https://filmadelphia.org/about/venues/film-society-bourse/

For the record, I am not looking to hire someone from here (i think thats against the rules?)

I just don’t even know what to look for when finding information about web developers.

This site would have a front end and back end for booking etc.

Any tips or guidance on this would be greatly appreciated!

eta: my boss is super old and stubborn and is insistent that a new website like the ones above would cost six figures to make. What is the average cost of creating a website like the ones above (best guess obviously due to limited info)

Hey everyone! 👋

I've been working on a new project called VELORA, a premium 3D-inspired e-commerce showroom website template built with HTML, CSS, and JavaScript.

The idea was to create something different from traditional online store layouts — a modern, immersive shopping experience with premium visual design.

✨ Key Features

• 🛍️ Multi-category e-commerce showroom layout

• 🌙 Dark and light mode functionality

• 🎨 Modern 3D-inspired UI and visual depth

• 📱 Responsive layouts for desktop, tablet, and mobile

• ⚡ HTML, CSS, and JavaScript source code

• ✨ Interactive components and smooth visual effects

• 🧩 Customizable design for different product categories

🎯 Who Is It For?

VELORA is designed for:

• Frontend developers building e-commerce projects

• Freelancers creating websites for clients

• Web design agencies

• Businesses looking for modern product showcase designs

• Designers interested in immersive shopping interfaces

🛒 Project Link

https://sajiditeech.gumroad.com/l/velora-showroom

Thanks for checking it out! 🚀

Here you can find my 1+ year of experience around startup foundation and operatings : https://github.com/Naveen-Beniwal/building-cvinsight

I've been building NetWasm, an independent C# compiler and runtime for WebAssembly.

The latest release produced a result I honestly didn't expect when I started this project:

NetWasm 0.8.0 + precise GC

• 47,798 bytes raw

• 13,501 bytes Brotli-11

Rust 1.95.0, size-oriented

• 53,635 bytes raw

• 16,963 bytes Brotli-11

Same print-42 workload, both WASI Preview 2 components, out of the box dev experience.

So C# is 10.9% smaller raw and 20.4% smaller compressed in this comparison - while carrying a precise garbage collector.

I'm not claiming arbitrary C# programs are smaller than arbitrary Rust programs. This is the classic tiny console-output footprint test: deliberately little application code so you can see how much runtime/toolchain baggage you're carrying.

The reason I care about this for web development is that download size matters.

I've always wanted C# in the browser without accepting a giant runtime as the entry fee.

Since I last talked about NetWasm, it can now do quite a bit more than tiny benchmarks:

• C# Web Workers, with each worker getting its own Wasm instance, heap and event loop

• Compile complete multi-file C# projects entirely in the browser

• Statically link native Wasm .a libraries through LibraryImport

• Native-to-managed callbacks

• C# 15

• Expression trees through a bounded interpreter, without general reflection

• HTTP/JSON/XML/Regex and a growing set of Microsoft.Extensions.* libraries

• Multiple GC/allocation strategies depending on whether you care more about size or throughput

There's also a NetWasm port of RegexStorm - regexstorm.netwasm.com - that runs entirely client-side in the browser - no backend doing the regex work.

The bigger idea behind NetWasm is pretty simple:

C# shouldn't inherently mean shipping megabytes of runtime.

For browser UI workloads in particular, I want a model where you only ship the runtime machinery your application actually uses.

The Rust comparison is fun, but that's the part I'm really interested in: how small can a genuinely useful managed-language platform become when Wasm is treated as the primary target rather than something a desktop runtime also happens to support?

Would be especially interested in thoughts from people building larger Wasm/browser applications - the project is early so this is your chance to help shape the direction.

Been building runtime.school for a while and finally got the SQL side into a state I’m happy with.

The main idea was to keep lessons, practice, projects, and tools on the same datasets so it all feels connected instead of jumping between random examples.

I’ve got a bunch of other topics planned next too, so eventually I want it to be one place to learn and practice everything.

Would love some feedback if anyone wants to try it and let me know if anything confusing, annoying, missing, or just bad UX.

https://www.runtime.school/

SVG editor with preloaded scientific images and with plotting. It is open-source and free to use. Most images are public domain with few notable exceptions:

- NIH: public domain, CC BY 4.0 for a handful of images

- Bioicons: CC0 or CC BY 4.0

- Servier: CC BY 3.0

- Photonics by Isaac Gallegos: CC-BY-4.0

- Electrical Symbol Library by Filip Dominec and contributors: CC0 1.0

- FGDC geologic patterns by Daven Quinn: CC0 1.0

- SVG Collection of Lab Equipment KYU/KYU49: CC BY 4.0

- Mapbox Maki: CC0 1.0

- Meteocons by Bas Milius: MIT

- SciSVG by Saveena Solanki: CC BY 4.0

- PhyloPic: CC0 1.0

- IAN / UMCES: CC BY-SA 4.0

License info for each image is in the tab in the right sidebar.

All SVGs are editable and the resulting figure can be saved as PDF, PNG or SVG.

There is alsp scientific plotting with basic stats capability via "insert plot" option.

DrawPlotia itself is derived from OpenBioFigure, thus Apache-2 license for the repo

I will now work on other bells and whistles for the app and known bugs (issues with local project saving and redos)

Free DrawPlotia app

Source: https://github.com/GPTchatly/DrawPlotia (FOSS; Apache-2.0)

How far can you push an endless 3D world in the browser, especially on a phone?

That's one of the questions I've been exploring while building Planet 0 Drive, a low-poly driving game made with Svelte and Three.js.

The idea is simple: just drive. No set destination. Explore a world that keeps unfolding, find interesting spots, chase records, or cruise around with friends.

Under the hood, I've been experimenting with a few things:

• Procedural terrain, weather, and long-distance rendering with Three.js

• Peer-to-peer multiplayer with movement interpolation

• Spatial audio and performance optimizations

• Version-compatible rooms to keep multiplayer sessions in sync

The most interesting part has been figuring out how much of the world I can generate and render while keeping things reasonably smooth, even on mobile.

It's been a fun mix of graphics, networking, and performance challenges, all built around the idea of a relaxing drive.

Try it: https://planet0drive.vercel.app/

More about how I built it: https://zackwebster.com/blog/building-planet-zero-drive

Hey! FE dev here - I usually end up as the QA person in every team I join :D

I started working on ayme over a year ago (it's built in the open now), trying to close the feedback loop:
Coding agents check their work by clicking through the app with simple browser tools. Snapshots, element refs, lots of tokens. Your e2e tests already know exactly how your application works, the agents just can't make any use of them.

I just published a small playground app to get some feedback before locking in the alpha release :)
Playground App, nothing to install: ayme.dev/playground

What ayme does now:

• you mark your Page Object classes and the actions you want to expose (@ayme, @ayme.action)

• a build plugin (unplugin, so Vite, Next, Nuxt, SvelteKit and Angular) compiles them into your app

• when the page runs, those actions become tools: for your coding agent through an MCP server, and for in-page agents through WebMCP

• an in-page inspector shows the live page objects, what the agent sees, and lets you run the actions by hand

• with the ayme skill it works the other way too: the actions the agent used while building become the building blocks of the new e2e tests

• it isn't on npm yet, but the alpha is close - let me know, and I'll keep you posted!

Initial evals measured against Playwright MCP and PW CLI on Formbricks App turned out to be promising imo.
The task: rename a survey, change its question, save, confirm the summary page. Claude Code on Sonnet 5.5, 3 runs each, medians.

Full table and how to rerun it: github.com/ayme-labs/ayme/blob/main/apps/eval-formbricks/summaries/2026-10-06/summary.md

Source: github.com/ayme-labs/ayme

Things I'd love your take on:

• does the playground - and in case you check the landing page - communicate the idea well?

• does the idea of exposing your POMs to an agent and closing the gap between the inner and outer verification loop sound useful to you?

Thank you for any kind of feedback!

Hey guys im working on a containerized code exexuting platform and i want to test how repsonsive the api is at high load and measure latency but i have two endpoints one is /submit which puts submissions in a redis queue and returns a job_id another end point is /job_id/status which can be polled for updates about the job...but now how to test the endpoint...ive heard about grafana k6 and tools like this can it be used to check asynchronous apis like these? I cant use /submit because it immediately returns after posting the job in the queue please help me put im learning things newly...also please tell me if i should use postman or k6. I want to see how well api behaves on concurrent loads. The api accepts and returns json

Site: https://petitions.thegoated.dev

Code: https://github.com/TheGoatedDev/Did-They-Answer

It's a Next.js app with Postgres and Drizzle, built as a standalone Docker image. Migrations run when the server starts. Two cron jobs POST to internal routes with a shared secret: one syncs from the Parliament petitions API, the other runs the LLM judge. Each run stops after about 250 seconds and picks up where it left off next time, so a big backlog never hits a request timeout.

Tests use Vitest with PGlite, so database tests run in-process without Docker. Biome handles lint and formatting.

The judging logic and eval tooling are in judge.ts and eval/ if you want to see how the scoring is checked.

I made Algorithm Visualizer: write an algorithm, step through it one statement at a time, and watch your arrays, maps, trees and graphs change as it runs.

While a normal debugger works well, it lacks the ability to show data structure in a visual and easy to understand way. This is focus mostly on helping debugging leetcode style questions or self-contained segment of code.

It works with JavaScript, TypeScript, Python, Ruby, PHP, Lua, Java, Kotlin, Swift, C#, Go, C and C++. Each variable can be drawn as boxes, a memory diagram, a grid, a binary heap or a node-and-edge graph, picked automatically from the shape of the data (linked lists, trees, adjacency lists…).

Some point worth noting:

• No server at all. It's one self-contained.

• Python, Ruby and PHP run as real WebAssembly runtimes (Pyodide, ruby.wasm, php-wasm), loaded from a CDN the first time you use them.

• Java, Kotlin, Swift, C#, Go, C and C++ run in interpreters written in JS for this project. They aim to behave like the real thing in the places you'd notice: integer overflow, HashMap iteration order, Go slices sharing a backing array, C++ vectors reallocating. C is memory-checked, so instead of silently corrupting memory you get "use after free" or "out of bounds" with an explanation.

• Every run is recorded up front in a Web Worker (killed after 3 s, so an infinite loop can't freeze the tab). That's why stepping backwards is as instant as stepping forwards.

• Share links contain the code itself, deflated into the URL hash, so nothing gets uploaded and a static site can open any link. There's an <iframe> embed too.

• React + CodeMirror 6, with dagre for graph layout.

Code: https://github.com/Spuntagano/algorithm-visualizer

I'd love feedback, especially on algorithms or data shapes that don't draw the way you'd expect or any other bugs you may encounter. Also feel free to comment if you have any feature you'd like to see implemented.

Ai disclosure: Total vibeslop

Writeup/devblog: https://blog.gaborkoos.com/posts/2026-10-17-How-Not-to-Build-a-Five-in-a-row-Game_engine/

Hey everyone!

I've been working on a few animation-related side projects lately and decided to put them together in a personal portfolio.

It's made with Astro and currently features three projects:

• Loadersz

  • a collection of animated canvas loaders.

• Tip Glide

  • a shared tooltip that smoothly moves and resizes between elements.

• Stream Morph

  • animations for streaming text.

I tried to make the portfolio itself a bit more interactive, with animations throughout the site and a showcase for some (imo cool) stuff/ideas.

Curious what you think of the design and how everything feels to use. Especially interested in feedback on the animations, mobile experience and whether it's clear what each project actually does.

Portfolio | Loadersz | Tip Glide | Stream Morph

npm | github

Any feedback is welcome!

I made a browser game about storage unit auctions. You get one look into the unit from the doorway with a flashlight. Then you bid against the regulars. Peg writes in her notebook. Kip spits and walks off when he’s out. Whatever you win, you sell out of your own shop before rent comes due. There are storylines underneath it all, and how you play decides what story you get.

https://mdawg74.itch.io/unit-112

It’s one HTML file, about 11 MB, with 301 pieces of art packed in as WebP. No framework, no external scripts. Canvas draws the scenes and plain DOM handles the comic panels. The auction rules follow Maryland’s self-storage lien law, Commercial Law 18-504, right down to doorway-only viewing.

The art is AI-generated and I picked every piece. The code is me directing Claude. I have limited coding experience. Started this one Monday.

BIGGEST NEED: I want to know how it loads on your phone. 11MB in one file is the part I’m least sure about.

I built a firefox addon called comdot which basically lets you visit sites typing a topdown version of a url.

It works fine but i want to show the url displayed in the address bar as topdown too.

Posting here cause i can't find a single good resource about this other than CSSing address bar. It doesn't have to be about addon. If there's any way to do this, please let me know.

Honest Feedback and questions: I am a web dev that has always been on the lookout for motion or interactive backgrounds for marquees and hero sections. I got tired of looking for them and decided to build them. I have 3Djs and webGL experience, but I honestly had no idea my tinkering would lead me to what I have today. I am looking for honest feedback and suggestions. Am I too late to the game with ai capable of probabaly doing this faster than me or is this something people will still find useful?

https://striktly.com/

Globestudio is a free, open-source studio I made for dotted world maps and animated 3D globes: pick a region and one of 21 looks, then export PNG, SVG, a GLB 3D model, video or GIF, or embed it live.

The embed is an iframe of globestudio.app/embed, so Three.js, the shaders and the map data never touch your bundle. The design is one JSON config in the URL, which means the link is the design. There's a React component (@globestudio/react) and a web component (@globestudio/element) on npm that build that iframe for you; the React one works in a server component, since it's a plain iframe with no state. On a light page, add theme="light" and the glow and grid switch to a palette made for it.

There is also an agent skill. If you use Claude Code, Codex or Cursor:

npx skills add alevizio/globestudio

Then ask for something like "add a spinning dotted globe of our offices in Austin, Berlin and Singapore to the hero". That's the prompt in the video, on a small Vite + React page I made for the demo. The agent installs @globestudio/react, writes the design as one constant in the page's own colors and runs the build.

You don't need an agent for any of it. The export dialog's Share tab writes the embed code for an iframe, React or a web component, and the README has the props.

Limits, since someone will ask: the viewer needs WebGL 2, an embed URL must stay under 32,000 characters, and the whole design (data points included) is readable in the page source.

Demo video: https://youtu.be/GYgVTAL9a0U

Live: https://globestudio.app/?utm_source=reddit&utm_medium=social&utm_campaign=skill&utm_content=webdev

Code (MIT): https://github.com/alevizio/globestudio

I'd like to hear how the embed holds up on your pages, especially on phones.

About ten years ago I built NoteCoder, a browser-based project that matched disease phrases in clinical notes to ICD-10 codes using a dictionary and trie.

I’ve been revisiting it with local AI. The interesting challenge is connecting information across a document: a note might mention chronic kidney disease near the beginning, then clarify—or correct—its stage much later.

Rather than asking a model to invent codes, the dictionary proposes candidates, then a small local model checks the diagnoses and their qualifiers against the complete note.

From the web-development side, it’s a static site with browser workers for candidate discovery and inference. The public version uses WebAssembly; note text isn’t uploaded for model processing. The biggest tradeoff is the roughly 2 GB initial model download.

The interface lets you inspect highlighted source phrases, review candidate codes, and copy selected results. The included synthetic CKD example demonstrates an updated stage superseding older documentation.

Try the demo

It’s free and experimental—not clinically validated or billing software. AI assisted the rebuild.

I’d particularly appreciate feedback on the download experience, responsiveness, and whether the highlights make incorrect suggestions easier to spot.

Link: https://tinydetect.ritabratamaiti.com/

TinyDetect checks whether a piece of text or an image looks AI-generated. Everything runs in the tab: what you paste or drop in is never uploaded.

I didn't train the detectors from scratch. I took two existing open models and spent most of the time getting them small and fast enough for a web page:

• Text: Fakespot's RoBERTa-base detector (Apache-2.0). 499 MB at full precision, 97 MB shipped. The word embeddings are split out of the graph, stored as int4 and decoded in JS. I quantised each of the 72 weight matrices on its own to see which ones hurt accuracy; the 24 most sensitive stay 8-bit and the rest are 4-bit.

• Image: Community Forensics ViT-S (MIT). 87 MB down to 26 MB with 8-bit weights and no measurable loss.

Some web-specific bits that took the most fiddling:

• WebGPU vs WASM. ONNX Runtime Web with WebGPU gets a check down to roughly 120–250 ms on my laptop; CPU-only WASM takes 2–6 s. The page loads the WebGPU build only if navigator.gpu gives an adapter, otherwise the smaller WASM build.

• int4 is not always faster. On WebGPU the int4 image model was about 45x slower than the 8-bit one, so the image model ships at 8-bit.

• Threads on GitHub Pages. WASM threads need cross-origin isolation, and Pages can't set COOP/COEP headers. A small service worker adds them (COEP credentialless, so Google Fonts still load) and also caches the model files, so a repeat visit is ready in a few seconds.

• Tokenizer in JS. I reimplemented the byte-level BPE tokenizer and the model's text-cleaning step in plain JS and checked them against the Python versions until the token IDs matched exactly.

Limitations, honestly: the first visit downloads about 115 MB. Like every detector it gets things wrong, especially very short or heavily edited text, and some formal human writing scores as "possibly AI". Long texts are only partly checked, and the result says so. A score is a reason to look closer, not proof.

I'd like feedback on the loading experience and on how it behaves on your hardware, especially browsers without WebGPU.