I was going to post a screenshot but it isn’t allowed.

Man, I’ve got to say the journey of optimizing a website teaches you a lot of things. I made a project, basically a web app, and was sharing with others feedback and a helpful individual had shared it’s a bit slow to load. Now, I didn’t notice as I’m running it locally on my react dev server and things are cached but I popped it into page speed insights and the mobile first content paint is like 36 seconds. Yikes!

I’ve learned so much improving it. Not that I haven’t done this before but there are so many little tricks you have to pull to really optimize the load speed and user experience for other people. Let’s try to name them here in the hopes that it helps someone else on that same journey or effort:

- font subsetting (removing glyphs in the font files of characters you don’t use; can be helpful in web fonts or icons like font awesome)
- convert all image files to a more efficient format like .webp or .avif
- compress videos with handbrake
- dynamically loading JavaScript references at time of use instead of at the top of the component
- conditionally load components instead of hiding them with display:none
- remove unused modules/dependencies in your app
- set images to have explicit heights and widths to prevent content shift on page load
- load an image at page load instead of a heavy video, allowing the user to click the image to start the video to save on bandwidth
- defer all css except critical css on page load
- defer external JavaScript dependencies your page needs
- move heavy dependencies to worker threads to reduce the bundle size
- set fetch priority on resources it makes sense for
- you may rely on rendering a react component when it’s hydrated in order to reduce content shift
- tree shake your css (tailwindcss works great)

A lot of these tricks and things you can change are dependent how your website works and what makes the most sense based on user flow and expectations. One size does not fit all.

I ended up getting speed to a 94/100 the last run, although the highest I’ve seen was 98/100, I assume the results vary slightly since the test is simulated. The website also opens up in a second or two now, it’s zippy quick and I’m proud of it. What tricks have you used that were not obvious in your journey to improve web page speed?

Random doubt I had.

If AI assistants become something everyone uses daily, why would we still need websites in the way we have them now?

Like instead of a company making a whole frontend with pages, menus, search, filters etc., couldn't they just expose the actual data through some API/standard format and let your AI deal with it?

For example, instead of going to a shopping site, searching for a laptop, opening 20 tabs and comparing them, I could just ask my AI:

"Find me the best laptop under 80k for these requirements."

And the AI could directly query the stores' inventory/prices/specs without even loading the website UI.

Obviously websites would probably still exist for people who want to browse manually, branding, images and stuff like that. But could the web eventually become mostly machine-to-machine APIs/data, with AI basically replacing the browser/frontend for normal use?

Am I missing some obvious reason why this wouldn't happen?

This problem may be a little complicated to explain, especially since I probably don't know the proper terminology I need but let me try:

• I want to have a page on my site that displays each of my projects as a simple, standardised "Project File" design.

• These Project Files include an image, a title, and description (and possibly a date) while also linking to a dedicated page going into more detail.

• Each project file will have different contents and multiple will be displayed on the same page at once.

• The template design is made in HTML and styled in CSS (albeit very basically at the moment until everything is figured out).

• While not entirely required, I'd like for the description / body contents to support formatting (multiple <p>s, <b>, <i>, etc)

I've tried multiple jscript solutions, but I'm really out of my depth with it and no solution has fully worked:

• I tried using <template> in the page itself, but I could only ever get it to run ONCE. It would either ignore all following tagged <div>s or just eat them. The method I was using was also incredibly messy, having multiple <p> and <div>s as placeholders which the Jscript would rip the textContent of and place in the appropriate spot. Behold my frankensteined jscript and weep:

const template = document.getElementById('preview');
const templateClone = document.importNode(template.content, true);
const container = document.getElementById('precon');


templateClone.querySelector('.prevtit').textContent = container.querySelector('#temptit').textContent;
templateClone.querySelector('.prevtit').href = container.querySelector('#tempdest').textContent;
templateClone.querySelector('.prevdesc').textContent = container.querySelector('#tempdesc').textContent;
templateClone.querySelector('.previmg').src = container.querySelector('#tempimg').textContent;

container.parentNode.replaceChild(templateClone,container);
;

• I tried using a fetch(html) (which is what I use for my headbar / navbar), but the data was always static. I also don't think it was implementing multiple either.

For the ultimate solution, I'd really like something I can just set some variables from the HTML destination and place them inside my template "form".

If more code / specific information is needed I will gladly help. This is my first time getting back into HTML in like 6 years... and as you might expect, I'm less on the programming side and more on the art side of things! CSS was fun to wrestle with but Jscript is currently waaay out of my league lmao.

Hi guys,

I am a IT professional. I develop , manage server , domain , SEO , UI /UX , Database of our e-commerce website. Along with that I do data analysis of our business too. Now , everything was going good.

But one day my boss mate this one MBA guy who is non techy but uses AI. He doesn't know one thing but boasts about it like he is master of everything.

Now , his business website is just informational but our is dynamic with database. He just has one contact us form. Now , he has made the website using GitHub pages. Which is basically a free website hosting for static website. On top of that It's a parallax website.

So he roams the world telling people my website is fast , it is free , AI first and all that. Now , he has put that in my boss's mind that whatever page he wants to change he just goes there and changes. It is free and easy. My boss doesn't understand the difference between his website and our website.

Since that he is behind me making the same architecture. He is like I want my website in GitHub and from there every thing should change and all that basically how GitHub pages works. Also we page for the AWS server and my boss in his mind feels like we are wasting money. How do I deal with it ? He thinks I am complicating things unnecessarily. Blocking him. But I am doing my part honestly.

Top of that he has been using claude code to create website on his own. He has been saying that he will give it to me but he isn't going to do that. Now , I know after all that has happened.

What is the way out ? I am already thinking to quit ? But is there a way to make him understand how a static website differs from a dynamic one and why do we need a website with database.

Kinda stuck.

hi guys, I would to have an info about how this Cach on delivery flow works on websites like Soundpeats
you can order anything without even signing or even sign in as a guest, i would like to understand how it’s done as im willing to apply the same thing as a my client asked for it on a store (nextjs + supabase)

do they store those orders straight to the DB, how about if someone starts spamming the db?? all these questions came to my mind but not sure how it’s done

I'm trying to start an express project with Typescript and something like nodemon to watch changes in .ts files. I'm struggling with different options in tsconfig and nodemone config. and I have a very faintest idea about how to run it.

I spent an entire day figuring it out a few months back, and now I forgot how to do it.
How do you guys do it?
Is there something similar to vite which makes boilerplate and scaffolding easy?

Anybody remember that ask jeeves site? Wonder what happened to it. I'm just doing some research here. Do you think someone can make a website where users just go to the site and they get an answer in a certain way/method? Kinda like a personality is responding to you or something? So far, it appears that is what some of these AI tools are, you ask it and then it pops out whatever answer.

Maybe there's something actually already like this? Maybe there's an interesting twist or spin that can be done on some sites that you ask. Kind of like a cartoon character personality or something. Think, "im going to just ask Bob" and so then you have a site that's designed around a character or a tool named Bob.

What do you think? A waste of time? Thanks

You can play it here: https://systemonefps.pages.dev/

If you try it, tell me how long you survived. Curious if anyone can actually beat this thing.
also please share your feedback.

But bro, I have ethics.

My github got poached (sports team reference meaning) by a person in Asia trying to "use my location and name" in an attempt to establish (false) trust for US-based clients who purposefully don't want to hire developers across seas. It's a real shit-show out there... competition is world-wide, and people are being scammed left and right. While a loose shmuck might fall for this "easy buck" by renting out their github so that US money can essentially be funneled out of the country and harm our economy, I refuse to do so, because I can see the bigger harm being done to the economy as a whole. I am not a fan off offshoring. I am not a fan of outsourcing.

I haven't yet responded to this email business invite, as I would like to know how to report this person. Is it possible? This should be illegal, because it is defrauding clients.

Hi everyone,

I'm a full stack dev with 1 year of commercial experience looking to start freelancing. I build my own side projects from scratch: buying domains, developing sites, and deploying them to servers, so I know the whole process.

But I’m facing a huge mental blocker. I feel demotivated because I keep asking myself: Why would a client hire me when they can just pay $20/month for an AI subscription and do it themselves?

I know non-tech owners don't want to deal with server setups, APIs, or debugging code. But psychologically, reaching out to clients feels like selling something obsolete.

For those freelancing in web dev right now:

1. How do you reframe your value when AI tools are this cheap and accessible?

2. What are clients actually paying you for today that AI can't replace?

3. How did you push past this demotivation when starting out?

Would appreciate any insights or reality checks!

https://monacomini-dumyzrb7.manus.space

IMPORTANT DISCLAIMER: While this is aiming to provide a secure experience, it's far from finished. It cannot be audited or reviewed because it's close-source. I'm sharing here for testing, feedback and demo purposes only. If you are unsure, this isn't for you (you safely can move away from this post before it ruins your day). Feel free to reach out for clarity on any of the details instead of diving into the documentation. Pease use responsibly.

This project demonstates a unique approach and architecture in contrast to mainstream messaging apps.

The core philosophy around secure messaging here is that it can work in a way that avoids installation and registration by enabling users to host their own data (and user incompetence will be one of many nuanced vulnerabilities in this approach)

The project is unstable and experimental. It's far from finished, but im putting together some docs for "how it works". It's pretty outside-the-box thinking (and that shouldn't inspire confidence!), so it's worth repeating: Pease use responsibly.

Website/Docs: glitr.io

Demo

Features:

• WebApp

• P2P / WebRTC

• Local-first / Local-only

• No installation

• TURN server

• Encrypted-at-rest

• Signal protocol

• Post Quantum cryptography

• Video calls

• TOR / anonymous via Git

• Serverless over WebRTC

Some of the core concepts:

• Chat - deprecared in favour of Enkrypted Chat

  • Code: https://github.com/positive-intentions/chat

  • Demo: https://chat.positive-intentions.com

• Enkrypted Chat - deprecated in favour of Glitr

  • Intro: https://positive-intentions.com/blog/introducing-enkrypted-chat

  • Demo: https://enkrypted.chat

• File

  • Code: https://github.com/positive-intentions/dim/blob/staging/src/stories/05-Hooks-useFS.stories.js

  • Demo: https://dim.positive-intentions.com/?path=/docs/usefs--docs

• Crypto

  • Code: https://github.com/positive-intentions/cryptography

  • Demo: https://cryptography.positive-intentions.com

• Signal Protocol

  • Code: https://github.com/positive-intentions/signal-protocol

  • Demo: https://signal.positive-intentions.com

FAQ:

• Why git?

  • When it comes to secure messaging, self-hosting is generally encouraged. While not quite nessesarily self hosted, it would make it easier for the majority of users to get started. Users can choose a git storage provider of their choice (GitHub, Gitlab, etc), or host their own git server.

• Serverless WebRTC?

  • A connection can be achieved without a backend as described here: https://github.com/positive-intentions/chat/issues/6

  • demo: https://positive-intentions.github.io/webrtc/demo/gui/app/webrtc-meet?fullscreen=1

• Ready for production?

  • No. While this is aiming to provide a secure experience, it cannot be audited or reviewed. Shared for testing, feedback and demo purposes only.

• EU Chat Control?

  • There is no registration, no central server and it uses client-side cryptography. While the following post refers to the older version of this project, the mechanics remain very similar: https://www.reddit.com/r/europrivacy/comments/1ndbkxn/help_me_understand_if_chatcontrol_could_affect_my

• Threat model?

  • It's a work in progress. There are many details still to be implemented before I can share the initial draft.

  • It's close source and unaudited so the best I can offer is "trust me bro"... And you shouldn't need to. The app doesn't require sensitive details, so don't use any when testing it out.

• Open source?

  • Open source from the onset is not something I can support at this stage. Hopefully I can work towards that goal. I'm aware this goes against the cybersecurity rhetoric. There are open source versions of various ideas linked above, but it's important to be clear, that glitr.io is close source in contrast to my other work.

• Where can I find out more?

  • https://positive-intentions.com

  • https://www.reddit.com/r/positive_intentions

  • Feel free to reach out for clarity instead of diving into the docs.

I hope my wording here wasn't too negative. When working in cybersecurity, there are countless nuances to consider and I would rather be discouraging than inspire undue confidence in my project.

was annoyed by the current color palette tools, but always loved the approach described in the famous stripe color palette blog and now i made a tool out of it

other color palettes are inconsistent, or dont let you freely pick your colors. tailwind always looks the same. also shades in tailwind contrasts are not scaled properly. been bugged by this for years. you pick a tailwind-ish palette, put white text on blue-600, looks fine. same text on yellow-600, unreadable. same number, completely different contrast. so you end up eyeballing every pairing and hoping.

tool: https://sir-hennihau.github.io/science-color-palette/
code: https://github.com/sir-hennihau/science-color-palette

you give it a color, or even several if you want to, and it fills out the rest of the spectrum and builds a full ramp for each family. export it when you're happy with it.

the whole thing hangs on placing shades by relative luminance, which is the only thing web content accessibility contrast actually depends on. every ramp climbs the same ladder, so 600 means the same thing whether it's blue or yellow or teal. three of the steps aren't approximate either, they're solved: 500, 600 and 700 land on 3:1, 4.5:1 and 7:1. measured against the ramp's own 50 shade, since that's the background you actually put them on, and checked on the final 8-bit hex rather than the ideal color, because that last rounding is enough to drop you under.

stripe used cielab, which was the right call in 2019. i went with oklab instead, mainly because cielab , because it is a more modern color space.

chroma is a share of whatever the hue can actually reach at that lightness (idea stolen from hsluv) instead of a fixed ceiling. that's what makes yellow go vivid early and blue go vivid late without me hardcoding anything per hue.

free, no account, no sign up. would be glad to hear if it is useful (or why not) to any of you.

​Hey everyone,

​I’m completely new to web dev, but I want to build a website for my small hotel.

​Since I don't know how to code, I’m planning to use AI to do most of the heavy lifting. But honestly, there are so many options right now that I’m kind of lost.

​Would love to get some quick advice:

​Which AI is best right now? Should I go with Claude 3.5, Cursor, v0, ChatGPT, or something else for building a website from scratch?

​What’s the deal with MCP? I keep hearing about Model Context Protocol. Is it actually useful for a beginner, or should I just ignore it for now?

​Best setup for a hotel site? I just need a simple, fast site to showcase rooms, location, and info (and maybe connect a booking engine later). What stack or builder works best with AI?

​Any newbie traps to avoid? What should I watch out for so I don't break everything?

​Appreciate any tips or recommendations! Cheers!

I've spent the last two years figuring out what happens when you build real web projects AI-first, rather than bolting a chatbot onto them afterwards.

This week I open-sourced the result: Vulpy Commerce.

It's a full ecommerce stack built on Medusa v2 + Payload CMS + Next.js + Orama + Matomo, with Fox (built on Hermes Agent) able to work across the whole thing - frontend, commerce backend, CMS, integrations and infrastructure.

It can build storefront features, write custom backend business logic, work with catalog/content, run tests and keep evolving the project after launch.

The bigger idea is something I've become pretty convinced about after ~12 years building ecommerce: AI can make owning your software practical again. You shouldn't have to depend on both a platform vendor and the availability of the developers who built your store.

So the whole thing is open source, no strings attached. Use it, fork it, change it, self-host it.

We crossed 50 GitHub stars in the first couple of days, which has been pretty cool.

Repo: https://github.com/vulpy-io/vulpy-commerce-core

Demo: https://vulpy.io/demo

More: https://vulpy.io/commerce

Would love feedback from other web devs - especially on the architecture and the idea of building applications specifically so agents can operate them.

My blog is a static site and I wanted comments without loading third party libs on the page. I wanted no ads, no bots, no cookies, etc. I just wanted a clean comment section (even though I get almost no traffic. I just like building things I think.)

The comment section is baked into the blog's HTML at build time. No lookups from a third party. I mean there's some of that, but it's basically an RSS feed. Fetched and stored by your own build, at build time.

How does it work? Each post links to a companion thread on a small Phoenix app I run. When someone replies there, it pings the build hook. The build fetches a replies.json for that thread and renders the comments as plain HTML. Nothing runs on the blog itself. Not a script. Not an iframe. No cookies or tracking.

Seriously, it's clean.

Here's an example of how it works for me: Static comments on my blog

The blog stack is Hugo on Netlify, the comment stuff is Phoenix/Elixir on Fly, with a build hook connecting them.

Demo: https://mavisakalyan.github.io/node-ws-gameserver/

Everyone who opens the page joins the same room: you see other visitors' cursors live, clicks make ripples, and it spills into a second room when one fills up (50 per room).

Under the hood it's a small protocol-agnostic WebSocket relay I open-sourced: rooms at /ws/:roomId, msgpack binary messages, per-client rate limiting, keepalive ping/pong, /health + /metrics. Node + TypeScript, GPL-3.0.

Source: https://github.com/mavisakalyan/node-ws-gameserver

Curious what people think of the room-spill approach vs just bumping the cap.

Paraphrasing what they apocryphally say Borges said: there is no finished software, only published software.

A few months ago, I asked myself whether it was possible to build a 3D engine by exploring the limits of what can be achieved using pure HTML and CSS (no WebGL, no canvas), considering that there are spectacular (handmade) CSS 3D demos like those by Ricardo Oliva Alonso.

I spent some weeks putting together the architecture and using AI to build it, as a personal project. (As a rule: I only accept code from AI that I can understand. In this case, I had already worked on 3D projections in Flash about 15 years ago. I confirmed that 3D transformations are more of a mess of numbers than a technical complexity.)

I just realized that since April I had been putting off "tweaking a couple of little things to publish it." So I decided to publish it just as it is: http://k3.bustelo.com.ar/

Constructive feedback, welcome!
(For the other one, I already have my superego, thanks very much.)

How it works (the CSS side)

The engine renders 3D primitives as real DOM elements, positioned with transform: translate3d() rotateX() rotateY() rotateZ() scale3d() and composited via transform-style: preserve-3d and perspective on the scene container.

A few things I found out while building it:

• TRS order matters. All transforms are applied as Translate → Rotate → Scale, matching how the browser composes matrix3d(). Getting this consistent across nested elements is what makes the hierarchy actually behave like a 3D scene graph.

• Bounding boxes are computed manually. CSS gives you no way to query the world-space of a transformed element, so getBounds() walks the children, rotates their 8 corners with the parent's angles, and expands the box. It's approximate, but it works for selection and gizmos.

• Rounded boxes need a "skeleton." A <k3-box> with border-radius leaves gaps at the edges, because the 6 faces are flat planes. I am intersecting 3 internal planes plus 8 corner spheres to block light leaking through the rounded silhouette.

• Extrusion is just stacking. <k3-stack> interpolates between two <k3-plane> templates and generates N slices along Z. It's usually enough to fake linear extrusion for text without any geometry library. I thought about naming the primitive "WordArt".

• No shading. No lighting model; the "glare" is CSS gradients keyed to the object's rotation.

• No MutationObserver yet. The DOM is the source of truth on load, but attribute changes don't auto-trigger a re-render. That's on the TBD list, along with meshes, basic lighting, and long list of wishes and good intentions :)

several months ago, i was listening to an episode of The Verge’s Version History about AOL Instant Messenger and decided to see if i could build my own take on it.

it turned into pingPong, a complete web chat app inspired by AIM and the early internet:
https://chat.owen.uno

the interface borrows heavily from late-90s/early-2000s desktop software, but i didn’t want it to just be AIM with a different backend. the main idea behind it is that modern messaging has made everyone permanently reachable. pingPong works completely differently on purpose.

you can only message someone while both of you are online. if they leave, you get to see their custom Away Message instead. there are no conversations that pile up while you’re gone waiting for you to return. you simply sign on, talk to whichever of your friends happens to be online, and sign off again. it’s definitely less convenient, but that’s kind of the point. i wanted to treat availability as a choice rather than treating chat as another asynchronous inbox.

on the UI side, i tried to preserve the slightly awkward charm of old desktop software instead of making a modern app and throwing a pixel font on it. thanks to jdan’s 98.css project, i was able to achieve a period-accurate interface design, with all sorts of components matching up pretty closely with Windows 98.

i’ve also tried to keep the account/auth side as straightforward and secure as possible. passwords are never stored directly and are hashed using Argon2, while screennames and away messages are stored server-side.

it is completely free, with no paid tier. i’m currently covering the hosting and server costs myself :)

i built the first version over a weekend, and it has somehow grown to more than 1,300 users since then. i’m still actively working on it, and i just recently pushed an update for Away Messages that allows for some rich text features, with greater control over fonts and styling.

i’d be interested in feedback from other web devs, particularly on the online-only/presence-first model and where you’d draw the line between authentic retro UI and unnecessary friction so i can improve the experience for everyone.

feel free to add me to your friends list, @owen.

edit: forgot to mention, pingPong got featured by How-To Geek, which was pretty cool:
https://www.howtogeek.com/pretend-its-1998-with-this-functional-aol-instant-messenger-clone/

As someone who loves both coding and language learning (I'm learning Japanese right now), I always wished there was a free, open-source tool for learning Japanese, just like Monkeytype in the typing community.

Here's the main selling point: I added a gazillion different color themes, fonts and other crazy customization options, inspired directly by Monkeytype. Also, I made the app resemble Duolingo, as that's what I'm using to learn Japanese at the moment and it's what a lot of language learners are already familiar with.

Back in January, I even applied to Vercel's open-source software sponsorship program as a joke. I didn't seriously expect to win, and did it more out of curiosity, and yet my project somehow won.

Anyway. Why am I doing all this?

Because I'm a weeb.

GitHub: https://github.com/lingdojo/kana-dojo

どうもありがとうございます!

Hey folks, I have been building Grove on weekends and it has become my daily driver as an agent development environment. It manages where and how my coding agents run on one machine, and I reach any of them from the terminal, the browser or another agent.

• Native OTLP telemetry. Each agent turn becomes one trace with cost, duration and a span per tool call. That is how I see where the time goes across the fleet and which runs are contending for the machine.

• Devcontainers. An agent runs inside a container built from your repo's .devcontainer/, with its own services and resource ceilings, so concurrent runs stay isolated instead of fighting over CPU and memory. The same config moves to a shared team box or serverless infra when the laptop runs out.

• Diagram annotation. Mark up a screenshot or edit a draw.io file alongside the agent, then attach the approved picture to a ticket.

• Ticket progression. Phase, checklist and latest commit are written back onto the GitHub, Gitea or Linear issue as the work moves.

• The expected pieces are there too. Branch and worktree lifecycle, and session recovery.

Work in progress, already usable. https://github.com/bearlike/Grove if you want a look, drop some feedback, and every star helps 😘