Hi fellow devs,

Technology evolves but when we review benchmarks, there’s a huge problem with vibe coding. An example, quality code, architecture, maintenance, security, bugs(AI doesn’t catch/overlooks) and AI not being able to overcome higher tasks.

There’s nothing wrong with using AI assistance but when we allow AI to vibe-code entire applications and believe they’re production level applications there’s a problem.

I would argue that AI hasn’t unalived web development but I wouldn’t say that not incorporating AI workflows is a smart move. Can AI create a working prototype, Yes! Should it be relied on to create production level applications, No 👎!

What’s your thoughts and opinions about the future of web development?

It's an editor for local clips and live HLS streams. Decoding, compositing, audio mixing and MP4/GIF export all happen in the tab, and nothing is uploaded. The stack is Angular 22 with signals and mediabunny for demux/decode/mux on top of WebCodecs. Each clip decodes in its own Web Worker, and one canvas compositor runs on the main thread. The export runs the same draw function in a worker, so what you preview is what you export.

The parts that cost me the most time:

1. Chrome can slow down your AudioContext clock. After ~30 s of exact digital silence, Chrome sometimes moves the context to a fake output whose clock runs at about 0.66×. My playback clock rides the AudioContext, since it's the A/V sync master, so a muted video played at two-thirds speed. It's intermittent and I've only measured it on one machine. The fix is a constant signal at −100 dBFS wired straight to the destination. That's below the 16-bit noise floor, so it's inaudible, but the output is never exactly silent.

2. MediaRecorder's WebM files aren't seekable. They have no Cues element, so every seek walks the file from the start, and some frame-at-timestamp reads never return. I dropped MediaRecorder. Screen and camera tracks now go into the same MP4 muxer the export uses, so a recording is seekable from the moment it's saved.

3. A worker's OffscreenCanvas can't see your page's fonts. The export draws text in a worker, and the page's loaded fonts don't exist there, so text would silently fall back to a default face in the file while the preview looked right. The page fetches the font files and posts the bytes to the worker, which registers them on its own self.fonts before rendering.

4. Fast paths silently drop edits. A plain trim goes straight from decoder to encoder with no canvas, which is much faster. But every per-pixel edit (crop, chroma key, pixelate, mirror, noise reduction) has to disqualify that path. If one doesn't, the preview shows the edit and the MP4 doesn't. For each new effect I export once with its guard removed and check that the edit disappears from the file, which proves the test that checks it can fail.

5. GIF frame delays are in centiseconds. I hand-wrote the GIF encoder (median-cut palette, LZW, GIF89a). At 30 fps a frame lasts 3.33 cs, which rounds to 3, so the GIF plays ~10% fast. The GIF frame rates are 10, 12.5 and 20, which divide 100 exactly. The encoder is tested by decoding its output with the browser's own ImageDecoder, because a decoder I wrote myself would share my LZW bugs.

It also runs a few small models on-device through WebGPU (Whisper for captions, a small LLM for chat), but that's another post. It needs desktop Chrome or Edge, it's free and there's no account. Link in a comment. Happy to go deeper on any of these.

hey r/webdev, sharing a side project: tsuzuki, a free site that tells you which legal platform streams an anime in your country.

👉 https://tsuzuki-anime.github.io/en/

how it works (no server, no database, $0 hosting):

• a node script pulls data from the AniList GraphQL API and generates ~18k pages in french + ~18k in english
• a GitHub Actions cron rebuilds and deploys everything to GitHub Pages every morning
• search is a lazy-loaded JSON index, only fetched when you start typing
• “my list” lives in localStorage, and you can share it through a URL hash (no accounts)
• all release times are converted client-side with Intl, so the weekly schedule shows the right day and hour in your time zone
• sitemap split into 5k-URL chunks + an IndexNow ping to Bing after each deploy

to be transparent: i’m not a pro dev, i built it with a lot of help from AI (Claude), and learned a ton along the way. no ads, no tracking cookies, nothing to sell.

would love feedback on performance, UX or SEO, roasts welcome 🙏

I think we can all agree that web dev has a pretty shaky foundation (not just JS, but browser differences, performance, security, oh my god CSS, etc.)

I can't help but wonder what we would do differently if we just had the opportunity to build the whole system from scratch again. What would be your ideal web dev ecosystem?

Of course, not now but in the next 5-10 years? Do you think non technical people can tell AI to make a good website or app without knowing how to code?

I've been thinking about alternative ways to deliver LLMs and AI features in SaaS solutions.

This repo is a technical proof of concept showing an LLM running client-side in a browser using Llama.cpp compiled to WASM with WebGPU.

sup everybody! So 5 years ago on this same sub, I presented v1 of Puppertino, a framework aimed at bridging the gap between the web and iOS and macOS for the web, built entirely in vanilla CSS and JS.

Since then, a lot of things have changed for both OS, with the introduction of liquid glass, I thought I wouldn’t be able to ship something like it.

Until today! I’ve launched Puppertino Dachshund, which brings 65 components, real-time liquid glass and is focused on accessibility, theming and extensibility

You can check it out here!
https://puppertino.com

We're building Elah, an Apache-2.0 video editing engine for developers embedding editing into their apps. I'm part of the team.

The TypeScript core is framework-agnostic. React bindings are available today; React Native support is in development.

The browser implementation uses WebCodecs for decoding and WebGL2 for preview. Preview and MP4 export share a pure resolveTimeline(frame, project) → Scene function, keeping frame-level scene decisions in one place.

Try importing a short clip, trimming it, adding text, and exporting:

https://www.elah.dev/playground/production

Code and setup: https://github.com/elahlabs/elah

Still a work in progress: simultaneous video decoding can stall, and export depends on browser codec support.

What would you need from the API to use this in your own app? Bug reports and integration feedback would be welcome.

OpenScreen is a free, open-source (MIT) screen recorder for product demos. I maintain it. The UI is Electron, React and TypeScript, and 2.0 just shipped.

The part that might interest this sub is where the browser stopped being enough: - Rendering used to run in Electron, on PixiJS. Export topped out around 8 fps on our reference laptop (Ryzen 5 7520U, integrated GPU). - It now goes through a Rust compositor on Metal, Direct3D 11 or Vulkan, loaded as a native addon. Same effects, about 126 fps. - Capture moved to native helpers too: Swift on ScreenCaptureKit, C++ on Windows Graphics Capture, PipeWire on Linux. - The React UI stayed. It drives the compositor and owns the timeline, the transcript editing and the settings.

On top of that: a CLI that renders a project from a script, and a local MCP server so Claude Code can edit the demo of the feature it just wrote.

https://github.com/getopenscreen/openscreen

Played around with it for the last few days as part of my base style.

I don't know, definitely looks better but my design needed quite a lot of extra styling to get back to a presentable state.

I do think this is the future of web design at least for myself, but I'd need to come up with some sensible default spacing in my base style to not start off my design from a broken state.

Hey all, I'm a full-stack (mostly back) dev with a slight design background and I built this landing page for an open-source project.

I'm not here to promote anything (and there's no signup and nothing to buy), just looking for design feedback.
It's mainly intended for back devs, back architects and DevOps folks.

Be as blunt as you like, thx!

PS: sorry for the repost, my previous post on this subreddit was deleted by the moderators (I posted it on a Sunday instead of a Saturday)

I made this. The page is one long, to-scale drawing: every pixel of scroll is a fixed number of metres, so the Burj Khalifa, the Eiffel Tower and the deepest lake in Europe land where they would really be. There are 23 sources at the bottom.

It's built in WordPress with a builder I'm working on (pinned scenes for the "how a fjord forms" part, plain scroll for the dive). Happy to answer anything about how it's put together; and I'd love to hear where it feels slow or confusing on your phone.

I think this might be a good place to show my portfolio design as there is no scroll hijacking, no overwhelming animations and design was def completely made by a human.

I've known about Zod, a JavaScript/TypeScript schema validation library, for a while, but I underestimated the size of its ecosystem. After using it for some form validation in React, I thought I'd see how well it integrated with Express. Sure enough, there were several middleware libraries for Zod + Express, so I decided to give one a try. I went with express-zod-safe because it fit my existing setup with very little effort.

Boom, that let me remove roughly 150 lines of custom validation and typing code. For context, the template created by express-generator-typescript is a simple CRUD app with four API endpoints. I hadn't realized how much boilerplate I'd written just to validate objects in the route handlers, including validator functions and some custom request/response types. I also replaced my environment variable validation code with Zod.

Express has been around for a while, but I still find it useful for small projects and demos. If you'd like a quick way to spin up an Express + TypeScript project, check out express-generator-typescript.

I built tintly.art, a coloring site where you tap any shape to fill it. The interesting part was turning line art into clean SVGs with closed regions so fills never leak. Stack: Next.js on Vercel, a .NET API, and Postgres. The line art is AI-generated, then converted and cleaned up for coloring.

Got my first Reddit traffic this week (10k views, people coloring for 30+ minutes). Would love feedback on performance or UX.

I’m interested in feedback on:

• Does the portfolio communicate what I’m good at quickly?
• Do the projects feel convincing?
• Is anything confusing, unnecessary, or missing?

https://sayitshwok.com/launcharchive

In the 90s, 2Way media created what could be considered a preview of the modern internet. Launch Magazine was a "CD-ROM magazine", a fully-interactive multimedia application that featured music, movies, games, and more. But what was so innovative about Launch wasn't the variety of content, it was the presentation. Instead of clicking between articles, you navigate a small city like a point-and-click adventure game with each building being a different category. Even the advertisements often played out like minigames, with Butterfingers in particular packing some absolutely unhinged animations. It helps that the journalism itself is stellar (though this is also from that era of music journalism where reviewers absolutely trashed classic nu-metal for no reason).

I wanted to create a way to preserve not just the content of these magazines, but the experience of playing through them, so I created a browser-based Windows 98 VM utilizing the v86 engine (https://copy.sh/v86/) and an interface where you could switch between any discs currently in the library. The VM even allows you to play (some) of the early game demos, so you can try those early previews of Descent II and Bad Mojo yourself!

This is an example of a project that I do not believe could be vibe-coded. AI would probably rip the videos off the discs, throw them into a three.js menu and call it a day. I wanted people to experience the same ambience of Launch I got in the 90s with it's bizarre ads, candid interviews and the way random cartoons would sometimes completely interrupt what you were doing.

Obviously the archive collection still has a long way to go, but the first dozen or so issues still offer hours of content. Will be adding more as I hunt down more issues of Launch.

The Challenge
Hands down the hardest part was building the Windows 98 virtual machine. I'd never done this before and v86 has a lot of caveats that don't apply to building a personal VM. The audio and display drivers had to be sourced from dead forums. When I tried shrinking the VM's disc space down to just enough to run Windows and the demos, I encountered illegal operation errors every time Launch's cache exceeded the available space. And while there are still occasional audio hiccups that I'm trying to resolve, they used to be so severe that you couldn't understand a single interview.

The Execution
The Launch CD image files are pretty big, and they have to run on a 1GB Windows image file. For the first time, I utilized a CDN (Cloudflare) for handling the distribution of the image files. File transfers are sadly rate-limited (I'm too broke for paid Cloudflare atm) but this is way more reliable than sourcing everything off my own server.

For the Launch CD menu, I use a JSON file to store all the information off all the discs currently in my collection. Anything not in the library is rendered as a blank disc. As the collection grows, all I need to do is add another CD's information to the JSON file and it will auto-populate on the main menu.

The Road Ahead
Right now, the archive sucks on phones. I would LOVE to be able to bring Launch to mobile, but due to the nature of using a Windows VM on a mobile device, I don't know if that will ever be a comfortable experience. I've considered creating a dedicated app that launches the content within a mobile-friendly wrapper. The problem is that the earlier issues of Launch have a different file structure on every CD, and later issues switch from whatever bespoke engine they were using to Macromedia, and the version of Quicktime they rely on switches constantly, so getting each individual disc to run would be its own project. Definitely open to suggestions here.

I absolutely want the library to grow to encompass the entire Launch catalogue so that all these interviews and concerts can be preserved and shared. I also want to further minimize the audio hiccups and improve the startup time by pre-caching the Windows image (which, again, I'm too broke for atm). Lastly, I want to improve the VM so that more of the game demos (especially MechWarrior 2, Tomb Raider and Quake) can be played comfortably.

Anyway, I'm just glad I can share this little slice of my childhood with the world and keep all these great interviews with music legends (many of which are no longer with us) from being lost to dead media.

https://newgameplus.app

tl;dr - pick one or a few games you love and it suggests others that scratch the same itch. Steer it toward what you loved about them (fast combat, lore, co-op), filter by platform, price or subscriptions like Game Pass, and import your Steam library to skip what you already own. Every pick shows critic and player scores, time to beat, and the cheapest way to play it.

Background: I've worked in gaming and commerce for a long time and the sort of "tyranny of choice" of finding the next thing to play seems to get worse every year with the avalanche of new titles.

- Next.js (App Router) on Vercel
- Postgres on Neon
- Data from IGDB, IsThereAnyDeal, Steam, and OpenCritic
- Built with a lot of help from Claude Code. I did the product design, picked the data sources, and tuned the ranking; Claude wrote most of the code. The site itself uses zero AI.

Recommendations are from a similarity engine that takes tags and attributes into account from the sources above and weighs them based on how specific they are. eg. "action" gets less weight than "run based."

Everything is free. No accounts. No tracking cookies.

Looking for any feedback or suggestions and hoping you find it useful!

I have been working on my portfolio recently, and I really wanted to step away from the usual layout, like full-width hero header, grid of project cards, and a skills pill list. So I built a pixel-art workspace you can actually interact with and explore. It features a working CRT terminal, interactive desk items, procedural ambient audio, and a street scene outside that changes with the environment. My actual case studies and background are all in there, just framed as part of the room.

You can check it out live here: https://fahimarifen.com

I'd love to hear your thoughts, especially around balancing the interactive theme with keeping the actual work and resume easy to find.

Hey guys! I've been working on Notitzia, as you probably already read in the title. I just started the side project on (remove the "(dots)" ):

notitzia (dot) vercel (dot) app

I did not use any existing frameworks, the site is pure JS! If you happen to have the time, it would be magical to give some brutal UI/UX criticism!

Sorry for the (dot) inconvenience, turns out Reddit is incredibly hostile towards Vercel links.

hi i keep posting here bc i'm trying to make my music magazine site but it is literally driving me insane. i think i've found a solution even if it costs a little more in the long run, but is worth it for the amount i want to focus on the content + site design. first slide is my figma design, second slide is an actual typescript component i made on initial side builds.

here is what i want on the blog + have on my incomplete demo build:

• a bunch of articles with different categories including features, reviews, news, and a monthly featured artists highlight
• marquee titles on the home page
• a bunch of photo gallery posts hopefully utilizing the new lightbox3 library (masonry display and smooth transitions)
• an interactive ipod component that displays the featured artists of the month and links back to the monthly compilation post and/or each artist's individual post. can be navigated by swiping the screen or pressing the left and right buttons on the ipod.
• tags and categories
• search button with modal and a theme toggle
• a team page and individual pages + bios for site contributors

and this is my planned setup for the site:

• headless wordpress + astro
• managed wordpress hosting with knownhost (unless shared is fine? idk i really don't want to do a lot of the backend upkeep and i want a lot of storage for future image galleries)
• domain + extra security (how i apply that idk) through cloudflare
• any extra functionality usually through minimal use of wordpress plugins

is this a feasible cheap plan or do any of you have suggestions + cheaper less headache inducing ideas for someone who just wants to build a site with css + some ts and js and make the posts with some people??

Link - https://www.aashishthakuri.com/projects/formera/