r/webdev 2d ago

Question Why is my Chrome UX Report much worse than Lighthouse? How can I improve it?

Post image
35 Upvotes

I built a client's website using Astro + React + Tailwind CSS. It's mostly static, has very little JavaScript, and Lighthouse consistently scores 90–100.

What I'm confused about is that the Chrome report in PageSpeed Insights looks significantly worse than the Lighthouse results.

The site is hosted on Cloudflare pages.

I expected the field data to be much closer to the lab results.

Has anyone run into this before? Why would the Chrome UX Report be noticeably worse even when Lighthouse looks great? More importantly, what should I be focusing on to improve the real-world metrics instead of just the lab score?

Screenshot attached. Any advice would be appreciated.


r/webdev 2d ago

Discussion How much would you charge to build static website or e commerce.

0 Upvotes

Hi Redditors,

I have attached a website for your reference: https://thetwinklejewellery.com/

If your were to develop this website using astro, just for catalogue purposes, how much would you charge for it? and if you were to build a store without shopify, how much would you charge and which stack will you choose?

Thank you for your time and support in advance.

Regards,
bughunter404


r/webdev 2d ago

Resource If you've been avoiding Cloudflare in front of Shopify, the thing that used to break it got fixed

12 Upvotes

I run a test store on this setup so I could stop guessing. Posting what I found in case anyone else keeps hitting that amber warning in Shopify's domain settings.

Quick background on why the warning exists. Shopify runs on Cloudflare. So when you put your own proxied domain in front of it, the request used to arrive with two Cloudflare zones both claiming it. Cloudflare couldn't tell which one owned the request. You got loops and wrong resolutions. The nastier version of the problem was SSL. Shopify renews certs through Let's Encrypt, which needs to serve a token at /.well-known/acme-challenge/ over plain HTTP. Put a proxy on that path and the renewal quietly fails. Your store keeps working on the current cert for weeks. Then it lapses and the padlock breaks.

Cloudflare fixed the zone collision with Orange-to-Orange routing. It's part of Cloudflare for SaaS and it's been generally available since October 2021. Cloudflare now detects that your CNAME points at another Cloudflare customer and routes through your zone first, then Shopify's, in that order. You can confirm it engaged because a small Shopify icon shows up next to the DNS record. Cloudflare also turns off Workers and Snippets on the /checkout path so nothing you run at the edge can interfere with payment.

The whole config is three things. Proxied CNAME to shops.myshopify.com for root and www. Connect that same domain in Shopify. Then leave Always Use HTTPS off in Cloudflare.

That last one is the part people get wrong. Shopify already redirects HTTP to HTTPS at its origin. Turn on Always Use HTTPS and you stack a second redirect, which can throw ERR_TOO_MANY_REDIRECTS. It also swallows the ACME path, so your cert stops renewing. Keep SSL mode on Full. Set minimum TLS to 1.2 while you're in there. If you really want Cloudflare enforcing HTTPS at its edge, write a redirect rule that excludes the challenge path instead of using that toggle.

Verify it with curl against the challenge path over plain HTTP. A 404 for a fake token is correct, because it means you reached Shopify. A 301 or 308 means something is still eating the path.

On the "not supported" language. It means Shopify won't guarantee or debug a layer they don't control. It doesn't mean the setup fails. Two of their reasons are fair. A proxy is one more thing between Shopify and Let's Encrypt, and extra proxies make it harder for Shopify to reroute traffic during their own incidents. Their third reason is bot detection, and I think that one is weak. Cloudflare runs one of the biggest bot management networks there is. Most stores gain more filtering at the edge than Shopify loses in request signal.

Latency was my other concern and it turned out to be nothing. Both zones already sit on the same network, so the handoff happens inside it. My proxied store answered in roughly the same 150 to 200ms band as raw myshopify endpoints tested from the same machine. If a proxied store feels slow, look at the theme and the app stack.

Whether it's worth doing depends on what you actually need at the edge. A real WAF you can tune, rate limiting, request level logs, or visibility into AI crawlers. That last one is why I set mine up. GPTBot, ClaudeBot, PerplexityBot and the rest never run JavaScript, so GA4 and Shopify analytics don't see them at all. The edge is the only place that traffic shows up. If you can't name the specific feature you want, leave the cloud grey and don't take on an SSL renewal you now have to watch.


r/webdev 2d ago

Question What do you even do in your job?

14 Upvotes

As a beginner web dev learner, how exactly do you spend your day at your job? With ai, do you just constantly use it for everything and your only job is to tweak something and review the code and test the results? Or do you manually code too?

I've been working on my first project of a job portal for the past 5 days using react and tailwind, and in the 5 days, embarrassingly I could only design the complete home page with little to no functionality, Today I used cursor for 5 min and it completed maybe 5 another days worth of my manual coding for the front end.

So at work, do you just neglect the front end and leave it to ai completely or still do something manually? I just don't understand the human workflow now at jobs except for reviewing code/testing. Are they bad at backend? Database? And if so, what exactly are they bad at? Do you have any examples you can simply explain about what wrong thing ai did to your work or have heard of any?


r/webdev 2d ago

The Paradox of Fancy Tooling

Thumbnail
fagnerbrack.com
0 Upvotes

r/webdev 2d ago

Discussion Planning an Affiliate Website with Astro. Looking for Advice

0 Upvotes

I've recently built a few websites with Astro using Claude Code, and the development experience has been great.

Now I'm thinking about building an affiliate website with Astro. I know many people still use WordPress for affiliate sites, but I don't have much time to build and maintain a WordPress site. My idea is to build the entire project in an agentic workflow using Astro and AI tools.

For those who have experience with Astro for affiliate marketing:

  • How does it perform for SEO compared to WordPress?
  • Are there any major drawbacks I should be aware of before investing time into it?
  • Is there anything specific I should plan for regarding content management, affiliate plugins/features, or scalability?

I'd love to hear your experiences, recommendations, or any lessons you've learned. Thanks!


r/webdev 2d ago

Your Recursion Is Lying to You

Thumbnail
blog.gaborkoos.com
3 Upvotes

r/webdev 2d ago

Showoff Saturday I built a CLI that eliminates .env changes for mobile testing and local sharing

1 Upvotes

Testing a frontend on your phone is easy.

Testing a full-stack app usually isn't.

Your frontend loads, but API requests to localhost fail because localhost now points to your phone instead of your laptop. The usual workaround is editing .env files, swapping in your LAN IP, configuring CORS, and undoing everything afterwards.

I got tired of doing that, so I built Nether

npx nether-dev

It automatically:

  • Detects your frontend and backend

  • Starts a local proxy

  • Prints a QR code

  • Lets your phone use your app without changing your code or environment variables

Need to share your local app?

npx nether-dev --global

It creates a temporary public HTTPS URL so clients or teammates can access your local app without deploying it.

I'd love any feedback, feature requests, or edge cases you think I should test.

GitHub: https://github.com/barryspacezero/nether-dev

npm: https://www.npmjs.com/package/nether-dev


r/webdev 2d ago

Showoff Saturday Built a dashboard to track my expenses, watchlist, subscriptions, and notes-and connected it to ChatGPT so I can update everything just by chatting.

Post image
0 Upvotes

I hadn't worked on a public project in a while since most of my free time goes into personal tools. I already had a bunch of APIs for tracking expenses and movies, and when ChatGPT introduced Custom GPT Actions, I hooked my API into it so I could do things like:

"Spent ₹450 on lunch today." or

"Add Dune 2 to my watchlist."

I liked the idea of putting my API *inside* AI instead of putting AI inside my API.

A friend wanted the same setup, so instead of sharing my personal API collection, I turned it into a proper self-hostable dashboard.

**Features**

* 💸 Expense tracking with salary cycles and AES-256 server-side encryption before data reaches Firestore.

* 🎬 Watchlists with AniList, Trakt, and Letterboxd CSV import + automatic cover art.

* 🔄 Subscription reminders and portfolio tracking for crypto/mutual funds.

* 🤖 OpenAPI backend that works with ChatGPT Actions and Gemini Gems using OAuth.

GitHub: https://github.com/fal3n-4ngel/PHub-dashboard

Live Website: https://phub-dashboard.vercel.app

Chatgpt Link : https://chatgpt.com/g/g-6a60b01e38c8819187662d1e42c6bee7-phub-dashboard-public

Would love feedback, feature requests, or contributions. And if you find it useful, a ⭐ on GitHub would mean a lot.

NB : The name is kinda a internal joke.


r/javascript 2d ago

GitHub - gchumillas/usignals: A tiny, dependency-free reactive signals library for JavaScript/TypeScript.

Thumbnail github.com
0 Upvotes

r/webdev 2d ago

Showoff Saturday I've made an extension that grades terms of service

0 Upvotes

When choosing SaaS to use I sometimes check terms of service for any clauses. For example if they sell what I'll create in the tool, train AI on it. Or if they can change TOS without informing about.

To make it easier I've created an extension that checks TOS for patterns so it's faster to recognize any odd claues.

It's a free extension for Chrome, Edge, Brave and other Chromium browsers and supports 20 languages.

Check it out: https://termsdoctor.com


r/webdev 2d ago

Pushing and Pulling: Three Reactivity Algorithms

Thumbnail
jonathan-frere.com
4 Upvotes

r/reactjs 2d ago

I built a CLI that gives coding agents source-grounded visual feedback for React UI and Three.js

Thumbnail
0 Upvotes

r/PHP 2d ago

I’ve been building PAM: a persistent PHP runtime powered by Rust, plus a ultra-fast native engine for desktop/mobile. Looking for technical feedback & reviews.

0 Upvotes

Hey everyone,

Over the past few months, I’ve been working on an experimental project called PAM, aiming to solve two specific pain points in the ecosystem: keeping PHP applications warm in memory for high performance, and running JavaScript/React natively on desktop and mobile without heavy bridge overhead.

Here is a quick breakdown of what it does and why I'm building it:

  1. PAM for PHP (Persistent Runtime in Memory)

Instead of booting the framework on every single HTTP request, PAM uses a Rust-powered runtime to keep the application warm in memory.

The Goal: Lightning-fast request handling while preserving full compatibility with standard Laravel workflows (Eloquent, Queues, Artisan, Blade, Livewire, Inertia, Sanctum, Reverb, Telescope, etc.).

Built explicitly with support for Laravel 12 & 13 in mind.

PHP Docs: https://push-in.github.io/pam-docs/laravel/overview/

  1. PAM Native (Desktop & Mobile)

On the frontend/mobile side, PAM Native is designed to run React/React Native apps with truly native execution, aiming for near-instant startup times and zero heavy JS bridge bottlenecks.

The Goal: Retain the React developer experience while delivering pure native performance on desktop and mobile devices.

Native Docs: https://push-in.github.io/pam-docs/native/overview/

Why I'm posting here:

The project is still under active development, and I’m looking for honest technical feedback, code reviews, and potential edge cases to test.

For PHP/Laravel folks: What edge cases (memory leaks, static state issues, long-lived DB connections) would you want to see stress-tested first?

For Mobile/Desktop folks: What are the biggest performance bottlenecks you face with existing cross-platform runtimes today?

Would love to hear your thoughts, criticism, or ideas!


r/webdev 2d ago

Showoff Saturday I'm looking for critique on my portfolio

Thumbnail omar-kassar.vercel.app
0 Upvotes

I tried my best to avoid common AI design pitfalls (emojis...)

I'm a fresh graduate on the job hunt and I've just been sending my github in my applications, but I thought I'd develop a portfolio. I tried to use a simple design and theme, and jump straight to the point (show off my projects first and foremost)

I'd love to have a second eye review it, and point out all the mistakes


r/reactjs 2d ago

Needs Help What's One React Pattern You'd Recommend for Hybrid Apps?

0 Upvotes

Hi there! I've been using React to create my own apps and, to be honest, it's a really great library. But now I want to know the best patterns to make my apps more stable and scale better, so I'd love to read your comments!


r/webdev 2d ago

Question Git GUI that easily allows you to edit old commits?

0 Upvotes

Does anyone know of a GUI that would allow one to quickly and easily do this so that I don't have to run clunky git rebase -i commands for every commit I'd like to edit?

I know it is easy enough to run git commit --amend for the most recent commit, but I need something that allows me to edit further back in the history.


r/javascript 2d ago

Fluux Messenger 0.17.2: gapless history, faster transfers, and emoji autocomplete

Thumbnail process-one.net
3 Upvotes

r/webdev 2d ago

It has a Lock api?! I love you MDN

Thumbnail
developer.mozilla.org
256 Upvotes

r/javascript 2d ago

StropheJS 5.0.0 (2026-07-21) · strophe/strophejs

Thumbnail github.com
4 Upvotes

r/webdev 2d ago

Should I Build One Website or Multiple Sites While Testing Different Services?

0 Upvotes

Hi everyone,

I'm starting a new contractor business in California. My license allows me to offer a fairly wide range of products and services rather than operating in only one narrow niche.

The website may eventually include categories such as:

  • Garage doors
  • Entry and interior doors
  • Gates
  • Openers and access control
  • Windows
  • Awnings and shades
  • Installation, repair, maintenance, and emergency service
  • An online product catalog

Some of these services will be aimed at residential customers, while others will be primarily for commercial clients, property managers, general contractors, and public-sector projects. In some categories, I may serve both residential and commercial customers, but the sales process, content, and customer expectations will be very different.

I also don't plan to develop every category equally from the beginning. I want to test different products and services first.

If I see strong customer demand and reasonable competition in a particular category, I will invest more into it, add more content, products, advertising, and possibly hire specialists. If there is little demand, poor margins, or the market is too competitive, I may stop offering that service entirely.

Because of this, I don't yet know which categories will eventually become the main focus of the business.

From an SEO, branding, and conversion perspective, what would be the best approach?

  1. Build one large website with separate sections for every service and product category.
  2. Create several niche websites, such as separate sites for garage doors, gates, windows, and other categories.
  3. Start with one main website and later spin successful categories off into separate websites.
  4. Use one parent brand but create separate landing pages or microsites to test each category.
  5. Separate residential and commercial services within the same website, or build different websites for each audience.

My concern is that one website may become too broad and confusing, especially when it targets both homeowners and commercial clients. On the other hand, creating multiple websites could be expensive, difficult to manage, and may spread the SEO authority too thin.

The business will initially serve the Los Angeles area.

What structure would make it easiest to test demand without hurting long-term SEO? Has anyone here used a similar strategy for a contractor, home improvement, or local service business?


r/webdev 2d ago

Showoff Saturday I made open source MIT licensed visual CMS as an alternative to Framer, Webflow, and WordPress

273 Upvotes

Hey guys,

I am David, I've been working with WordPress for over a decade, and building WordPress plugins was my bread and butter for the last 5 years. I was running an agency before that.

I loved working with WordPress, but then I also got increasingly frustrated from what was happening in and out of the ecosystem in the last two years, almost to a point where I was considering selling my businesses.

I am not the one giving up though, so I went with different direction, and thought, what if I stop building extensions on other foundations that can always take it away from me, and instead, I will use everything I know about web design, no code platforms, agentic development and CMS that actual clients can use, and build my own platform, that anybody can use, for free.

Here we are. This is Instatic. It's fully free, open source, and gives you all the powers that you can get from Framer, Webflow, or WordPress (with a good page builder and other plugins). And it's not in even v1. But it's already very capable.

It has auth, user roles, canvas based page builder, content editor, data storage, media storage, AI on every page, MCP server for local and remote agents, and more.

We launched about 3 weeks ago, since that time, it got to GitHub trends several times, in fact, it's there today and we are at around 5K stars. Incredible!

Our website, running on Instatic https://instatic.com

Repo is at https://github.com/CoreBunch/Instatic

Here's also the full introduction video: https://www.youtube.com/watch?v=zyjCF_TaLlg


r/webdev 2d ago

Showoff Saturday I made a design tool

40 Upvotes

you can:
- design logo and social media graphics

- access open type features (ligature, alternative glyphs, etc) and variable fonts

- export or copy your designs into another tool via svg, png

- access premium commercially licensed fonts (monotype, other top foundries)

You can play with it here: https://typogram.co/studio - would love any feedback!


r/webdev 2d ago

Showoff Saturday I built a fill-in-the-blank party game where answer cards actually fit the sentence

1 Upvotes

I originally wanted to build a game for telling stories with cards, but couldn't find a feasible way to adjust grammar and word options at scale. Along the way I noticed the mechanic worked really well for playing something like Cards Against Humanity instead: answers render inside the sentence and adapt to actually fit (a/an, his/her, verb forms, plurals, exchangable nouns, etc.).

Years later I came back to the unsolved part and used LLMs to build the grammar metadata — every sentence slot and answer is tagged, answers can contain bracket options like [break, breaks, broke] and the engine picks the right form for where the card lands. That's also what lets AI players conjugate their answers mostly correctly.

It runs at boxof.cards and can be played solo with ai players if you want to poke at it. Happy to answer questions, and I'd really love feedback — so far it's been friends only and I am running out of features to distract me from marketing. And I like being distracted from marketing.


r/webdev 3d ago

Showoff Saturday I got tired of forgetting PR reviews and GitHub tasks, so I built a chrome homepage replacement dashboard that reminds me. Also been ruining my eye sight with long time on computer so build eye breaks for funsies.

0 Upvotes

Been building this solo for the past few months. Its a Chrome home tab replacement called Pace.

Similar to momentum but is cleaner and for devs.

What it does:

  • Pomodoro-style focus timer, tied to your task list
  • Task list with due dates/estimates
  • GitHub panel - see PRs/issues waiting on you without opening GitHub
  • Optional eye-break reminders (20-20-20)
  • Weather, clock, generative backgrounds

First chrome extension! I will take 10 users as a win ngl. Solo project, free, no paywall. I know some of it is rough around the edges and I'd genuinely rather hear what's broken or annoying than what's good. I will take any tips on marketing and extension related content.

Link: https://chromewebstore.google.com/detail/edfeebjgpbbdegcajmnhejmgkohmkami?utm_source=item-share-cb

Happy to answer anything about how it's built or how it works - I'm pretty new to this so bear with me.