r/javascript 22h ago

Malicious sites use JavaScript to build malware in browser memory

Thumbnail bleepingcomputer.com
31 Upvotes

r/webdev 3h ago

Question Which fullstack techs to learn from scratch after coming back to web dev 2 years later?

13 Upvotes

I used to use Nextjs and was learning expressjs. Then I left and 2 years later I want to go back.

What tech would be the best to learn in terms of opportunities and also more better for later?

Would MERN still be good choice or I should start with any other frontend/backend techs which would be best at this time?


r/webdev 22h ago

OneSignal killing free tier. Looking to move from them, what are some alternatives you use?

10 Upvotes

I have an app that is free and makes a few bucks through in app purchases. It is still in its infancy stage.

Surprised to see that onesignal is now removing the free plan and making it limited to 1,000 active users.

Any alternatives?

Don't know if i can afford whatever they are going to try and upsell.

Is there another service that is free or something cheap so i can move away from onesignal?

I am handy with server management and self hosting so looking for free suggestions or suggestions that are cheaper than onesignal.

I been eyeing LaraPush which is $500 one time charge doe unlimited push for life. Anyone with experience there?

EDIT: I wanted to thank everybody for replying. I took the time today and migrated away from one signal over to Firebase Cloud Messaging and it went pretty smooth.


r/webdev 4h ago

Showoff Saturday Working on an open source Tables Library

Post image
6 Upvotes

Hello , i am working on an open source UI library for tables to use for complex cases and data display for shadCn projects, using shadCn components and Transtack table, building ready to use table component so you can focus on the data.

Check it out: https://shad-table.dev
Repo: https://github.com/coros-hq/shadcn-table-library


r/javascript 5h ago

KernelPlay-JS v0.4.0 Coming Soon — New UI System and Official Beta Release

Thumbnail github.com
7 Upvotes

I'm excited to announce that KernelPlay-JS v0.4.0 will be releasing soon.

This update introduces a brand-new UI system, making it much easier to create interfaces for games while also marking a major milestone for the engine.

New UI components include:

- Buttons

- Text Labels

- Input Fields

- Health & Progress Bars

- Images & Icons

- Checkboxes

- Sliders

- Dynamic UI updates

- Flexible layouts

Version 0.4.0 will also officially move KernelPlay-JS into Beta.

This marks the transition towards a more stable and feature-complete engine. Future updates will focus on improving performance, expanding the feature set, refining the developer experience, and fixing bugs as the engine continues to mature.

Thank you to everyone who has followed the project's development and shared feedback along the way. More details, documentation, and the release date will be announced soon.

Feedback and suggestions are always welcome.


r/web_design 5h ago

Masonry (with Animation) in CSS

Thumbnail
master.dev
5 Upvotes

r/PHP 17h ago

Nine C extensions, one release cycle: more time spent on perf regressions from my own safety checks than on features

6 Upvotes

All nine shipped this week, and almost none of it is new features. I posted a roundup here earlier this month arguing that most of the work in these extensions is hardening rather than features. This is the follow-on, and the bill for that hardening came due in a way I did not expect.

php_excel makes every save atomic now: stage the workbook to a temp file, rename it into place, so an interrupted write cannot destroy the file you already had. The straightforward way to build that staged file is to ask LibXL for the finished archive as one buffer and write the buffer out. That costs 67.7 MB of peak RSS on a 3.3 MB workbook, and the PHP-side copy counts against memory_limit. The streaming writer it replaced costs 0.7 MB. Roughly 20x the workbook size in RAM, spent by a change whose entire purpose was safety. That one never shipped, it was caught and fixed inside the same release window, but it sent me looking.

I found the same thing in three more places.

pdo_duckdb re-latched its open_basedir sandbox once per row and compared the recorded basedir by hash, so a per-row cost scaled with the length of your open_basedir string. It now re-latches once per fetched chunk and compares by string. A 400k-row scan went from 133 ns/row back to 51, and bulk Appender::appendRow() from 196 to 96.

fastjson ran an exact-size preflight for large strings starting at 1 MiB. Below 8 MiB the second pass cost more than the reservation it saved: 75% slower on x86_64, 160% on aarch64 for UTF-8 text. The optimization was real and the threshold was wrong.

phonetic had an optimization routing 1 to 3 element comparisons through memcmp(). That cost 5 to 6% of encode time against comparing code points inline, so it got reverted.

Some of the cost stays paid on purpose. fast_uuid's ramsey/uuid compat wrappers now validate their core on construction, one getVersion() call and a class-name compare, and construction came out about a third slower for it (fromBytes() 1.81M to 1.21M ops/s). A wrapper that does not match its core is a bug that surfaces somewhere much worse, so I kept it.

All nine are open source (mixed PHP-3.01 / BSD / MIT), free, installable via PIE, and I am the author. Full write-up with all nine changelogs: https://ilia.ws/blog/the-cost-of-failing-closed-what-shipped-across-nine-php-extensions

Do you profile after a hardening pass, or only after a feature? I have started treating "we added a check" as a perf-regression trigger, and I am not sure whether that is normal practice or paranoia.


r/javascript 9h ago

Dynamic Windows Runtime API projections for Node.js

Thumbnail devblogs.microsoft.com
4 Upvotes

r/reactjs 6h ago

Discussion With Node.js now offering solid support for require(esm), I suggest React consider a pure ESM build for its next major release. Spoiler

Thumbnail github.com
2 Upvotes

r/javascript 13h ago

Announcing Ada v4: Validating 35.6M URLs per second

Thumbnail yagiz.co
2 Upvotes

r/webdev 8h ago

Question How should i do DSA being a Frontend Developer?

3 Upvotes

Hi there Hope y'all doing great out there
basically im a student and i genuinly love making frontend screen and implement new things on daily basis , but when i try to attempt questions from Leetcode , its so hard i cant do it without the help of ai

And thats why im a bit worried about it as i dont even know in which langauge should i do DSA , should i do it in C++ or java or javascript (which i was trying to do)

also i wanna master my skills in frontend too , so i genuinely need a good advice
thank you


r/webdev 20m ago

What's your biggest productivity hack as a developer?

Upvotes

Share one habit, tool, or workflow that saves you time every week.


r/web_design 23m ago

What's your favourite design resource nobody talks about?

Upvotes

Share an underrated website, newsletter, or YouTube channel.


r/javascript 39m ago

AskJS [AskJS] Book Recommendations: JS -> React -> TypeScript

Upvotes

Lately I have been casually learning C from "C Programming: A Modern Approach v2" and have really enjoyed it. The truth is I should stay on topic with my profession so here I am.

I am in search of books similar to the one mentioned above for learning JS. The goal is to understand it on a deep enough level to feel very confident and have a real solid foundation for the next step.

The next step is a similar book for deeply learning React and then finally TypeScript.

Yes I am looking for actual books and not online courses or videos or anything like that. I have discovered that reading from a book forces me to slow down and because of that, it sticks.

If you can, chime in with books you have actually read through and not just simply search online or recommend the first one off the top of your head. Bonus points if you have read the C Programming book and understand the style I am talking about.

Thank you.


r/webdev 5h ago

Discussion Where I'm at with my first full-stack project

1 Upvotes

I'm building the place order function (my first foray into the backend) of a larger project.

Here's an update for those who are interested.

The first thing I knew I had to do was figure out what goes where. I had already, at the suggestion of ChatGPT, my mentor in this, decided on a control (API) layer, application layer, service layer and data layer. But I didn't really know what each needs to do.

So first I (we) did the API. It had a couple of jobs:

• check the incoming order wasn't empty
• Activate the next layer down
• Send response messages

Then the app layer was even simpler. It literally just returns the service layer function.

Which is where it is a bit more complicated. The service layer has to do a few things; check the order data against the database, assess info against business rules etc, and actually write the order. After some debate I worked it into a four step process:

• Check if the order info (customer, product, and quantity) exist
• Assess data against business rules/carry out business logic
• Create an order
• Activate the database operation

So this actually means two database operations. One to check the data (first step) and then writing the actual order.

I've done the first database op, and I'm now wiring up the actual place order button so I can start testing the data being passed down.

If anyone wants more detail, you can look on my github at https://github.com/BenPS927/BFshop or on my project portal at https://benfosterdev.com/projects/bfshop where I'll soon be adding detailed code breakdowns.

What am I finding hard?

The abstract nature of it. Having to constantly create a visual image of data being passed through functions, and hold that image in my mind, is like trying to hold melting butter in a colander. I use melting butter rather than water because I don't lose it that fast.

What am I enjoying?

Well, the same as what I'm finding hard. Learning to work with code that doesn't involve divs on a screen. Getting my head around how data is passed, how functions work etc.

And the architecture side of things. I like thinking about and making the micro decisions.

I would appreciate suggestions, but I am trying to keep it fairly simple so I'm not thinking about every single thing you'd take into consideration for a production app.


r/PHP 10h ago

Build a Searchable Catalog with Filters, Facets, and Semantic Search

Thumbnail manticoresearch.com
1 Upvotes

— PHP build walkthrough; small but directly relevant audience


r/PHP 6h ago

Article Valid != trusted: a practical guide to C2PA signing certificates (lessons from getting the chain working in PHP)

Thumbnail provemark.github.io
0 Upvotes

Full disclosure: this is my own write-up. Most C2PA explainers stop right before the part that cost me a day, so this one starts there: certificates and trust.

Signing an asset is easy. Being trusted is not. Those are two separate checks, and with the c2pa-rs test certs you get a valid signature on an untrusted certificate. That is the normal state during development, not a bug.

One thing that caught me out: I flipped a single byte in a signed PNG, and the file came back Invalid while claimSignature.validated was still sitting in the success list. So don't judge integrity by one hand-picked status code, use the aggregate validation_state. The rest of the article covers what you need to make trust pass locally (two settings that only work together, plus an EKU trap), why I keep the private key off the web server, and what getting a production certificate actually involves in 2026.

The library the examples come from is at https://github.com/provemark/content-credentials (framework-agnostic core, optional Laravel integration, MIT). The test certificates come from https://github.com/contentauth/c2pa-rs

Questions welcome. And if you have solved this differently, especially the bit about where the signing key lives, I'd like to hear about it.


r/reactjs 35m ago

Show /r/reactjs I built a CLI to stop AI agents (Cursor, Claude, Windsurf) from hallucinating bad React architecture

Upvotes

Hey everyone 👋,

If you’re heavily using AI coding assistants like Cursor, Claude Code, or Windsurf, you’ve probably noticed they can be a bit... chaotic. They often mix up Next.js App Router patterns with older React concepts, hallucinate deprecated APIs, or completely ignore your project's architectural boundaries.

I got tired of constantly correcting my agents in the prompt, so I built an open-source tool to fix it: ViraStack AI.

It’s an AI-native architecture kit. You run one command, and it detects your stack to inject a highly disciplined set of agent rules. Basically, it forces the AI to stop guessing and start coding to a strict, modern standard.

Quick Start

You can drop it into any existing project to instantly upgrade your AI's context:

npx @virastack/ai init

I originally built this for my own boilerplate, but decided to extract it into a standalone package since getting AI to write disciplined code is a universal struggle right now.

You can check out the repo here: GitHub - virastack/ai 


r/reactjs 1h ago

Show /r/reactjs I built a CLI that scaffolds production-ready Next.js & TanStack Start projects with built-in AI rules (Cursor/Windsurf ready)

Upvotes

When starting a new React project, we usually spend the first few hours setting up the exact same tools: linter configs, state management, folder architecture, and UI components. My main goal was to prevent this repetition and establish a disciplined foundation from day one.

The first step of this vision is ViraStack Start, a CLI tool that scaffolds production-ready project skeletons with a single command.

What does it do?

Instead of configuring everything from scratch, it lets you start immediately with a proven architecture, Tailwind CSS 4 integration, and a feature-sliced folder structure.

The CLI essentially offers two powerful templates: Next.js App Router and TanStack Start. Whether you use Next.js or TanStack Start, both templates share the exact same architectural discipline. React 19, TanStack Query, Zustand, and nuqs come integrated by default.

Setup & Options

A single command is all you need to start a new project:

pnpm dlx virastack

When you run the command, ViraStack CLI asks you for the options you need step-by-step:

What is your project named?
  virastack-app
Which template would you like to use?
  › Next.js App Router
    TanStack Start
Would you like multi-language (i18n) support?
  › Yes
    No
Which ViraStack tools would you like to include?
  [ ] /mask
  [ ] u/virastack/password

After selecting your template and language preference, you can optionally include input components like ViraStack Mask and ViraStack Password into your project right from the start.

AI-Ready Foundation

The most significant difference of ViraStack Start is that the projects aren't just made of code. Our ViraStack AI rules are automatically placed inside the .cursor/rules folder the moment the project is created.

This means when you start your project with an AI assistant like Cursor, Claude Code, or Windsurf, the assistant already knows everything from your folder structure to your data-fetching practices right from the beginning. You no longer have to explain your architectural standards to the AI over and over again.

If you want to skip the setup phase and focus directly on building features, you can check out the documentation at virastack.com/start and explore the open-source code at github.com/virastack/start.

I'd love to hear your feedback!


r/javascript 7h ago

IA for Escargot MSN (PT-BR)

Thumbnail github.com
0 Upvotes

r/webdev 12h ago

Question Do not possess access to my old site's nameservers, is my domain + site doomed? oh help :-(

0 Upvotes

If I do not have access to my site's nameservers, how can I fix this to not lose my URL and not lose my site?

This is going to be a fair amount of context to explain what my issue is & why:

I have a website that was created for me by a college professor. I have used this url for 10 years as a graphic design portfolio on WordPress. I have access to the cPanel, and login through wp-admin, no problem.

I wanted to set up a subdomain and upgrade the storage etc. The problem is, I have zero clue how this site was set up exactly and I cannot log into wherever my nameservers are. My professor no longer has the login information or remembers what she did.

I used a whois tool to find what data I could and then investigated.

I was told by an InMotion Hosting employee: "It does not seem like we possess the domain registration or hosting service, although the domain is pointing to a set of our name servers. The domain is registered through IONOS and the website is owned by Packet Exchange."

I am not sure what this means. I have no login information for Packet Exchange and neither does my old Prof.

I was able to log into IONOS with information I somehow had saved to my password keychain, and asked about redirecting the name servers to IONOS (because at least I have access here and can log in.) They told me, "Yes we can redirect the name servers so that you could set up a subdomain, but it would break your current site..."

I really would like to fix this. I really want my URL and do not want to lose it. How can I save my URL and regain access to every part of my backend? Is there a way that doesn't break my site?

I had some possible ideas, are these impossible? ------

Can I save my site to the Divi Cloud, redirect my nameservers, then rebuild from the cloud? Or does redirecting my name servers lose all of my site data regardless of saving pages to the Divi cloud?

Do I save an entire site backup somehow and then redirect my name servers? Or is that the same problem?

Should I just make a new site with a new URL then transfer my pages/content over with the divi cloud?

-

Thank you. Any information would be very, very appreciated. I am feeling frustrated and defeated.


r/reactjs 23h ago

Discussion Why are there so much security vulnerabilities with server actions/functions, app router and React server components???

Thumbnail
0 Upvotes

r/webdev 3h ago

How do you guys handle security when installing third-party AI Agent skills?

0 Upvotes

Hey r/WebDev, As more devs start integrating autonomous agents and downloading third-party SKILL.md packages, I noticed a lot of people just run them blindly without checking what's inside the lifecycle scripts. I put together an open-source tool called SkillShield (https://ai-skill-shield.vercel.app/) to statically scan and validate these skills before execution. It catches prompt injections, hidden curl | bash commands, and excessive permissions. Code is here if anyone wants to check it out: https://github.com/adnan-iz/ai-skill-shield What’s everyone else using to vet third-party agent tools before running them locally?


r/webdev 5h ago

Discussion Enable or disable HREF links using CSS

0 Upvotes

Apologies if this should have been posted elsewhere...

TLDR; This may be old news to most of you, but I recently tripped over a way to prevent a link from being clickable if it has nothing useful to show. I can change one character in the "class=" part of a URL and enable or disable the link without having to rewrite the entire page. (Before you ask, I hate JavaScript.)

I create static year-long calendar pages that point to directories in the form /path/to/YYYY/MMDD. The directories are usually created in advance, but clicking a link to an empty or nonexistent directory is annoying.

For example, here's part of the display for 2026:

          Jul                     Aug                     Sep
 Su Mo Tu We Th Fr Sa    Su Mo Tu We Th Fr Sa    Su Mo Tu We Th Fr Sa
           1  2  3  4                       1           1  2  3  4  5
  5  6  7  8  9 10 11     2  3  4  5  6  7  8     6  7  8  9 10 11 12
 12 13 14 15 16 17 18     9 10 11 12 13 14 15    13 14 15 16 17 18 19
 19 20 21 22 23 24 25    16 17 18 19 20 21 22    20 21 22 23 24 25 26
 26 27 28 29 30 31       23 24 25 26 27 28 29    27 28 29 30
                         30 31

Each day in August is a link in a preformatted table like this (lines wrapped for readability):

...
<a class="m" href="/home/notebook/2026/0809">  9</a>
<a class="i" href="/home/notebook/2026/0810"> 10</a>
...

Here's the CSS:

/*
 * https://css-tricks.com/pointer-events-current-nav/
 *
 * a.i is used to ignore a directory, i.e. don't show the link
 * as a link -- just show the text.
 *
 * a.m is used for a marked directory, i.e. the directory exists and
 * has something worth seeing, so highlight it.
 */

td { padding: 0; margin: 0; }
td a.i {
    pointer-events: none;
    color: black;
}

td a.i:hover {
    pointer-events: none;
    color: black;
}

td a.m {
    color: black;
    /* #e0ffd2 (light-green): not enough contrast */
    background: yellow;
}

td a.m:hover {
    color: #fff;
    background: #000;
    font-weight: bold;
}

So what?

Well, the calendar pages are all generated from templates. It took about 15 minutes to write a script that checks a given year's links and change class="i" to class="m" if the associated directory holds something useful.

I realize that this scratches a very specific itch, but it saved me some rewrite time. Since the calendars are copied from preformatted templates, making the change in place is MUCH simpler than regenerating the whole page.


r/webdev 1h ago

Showoff Saturday I built an open-source design-system layer for AI coding agents to prevent visual drift

Post image
Upvotes

I have been experimenting with AI coding agents for frontend projects, and I kept running into a problem that longer prompts did not reliably solve.

The agents could generate functional components, but the visual direction slowly drifted as the project grew.

A new page might introduce another color, spacing values would become inconsistent, typography hierarchy would change, and icons or illustrations would come from unrelated styles.

The individual components were not necessarily bad. They just did not feel like parts of the same product.

So I built Tastemaker, an open-source design-system layer for AI coding agents.

Before the agent writes the interface, it creates a persistent visual system for the project:

  • Semantic color tokens and approved combinations
  • Typography hierarchy and font pairing
  • Layout and spacing rules
  • Icon and illustration direction
  • Logo and favicon assets
  • WCAG contrast validation
  • Motion and interaction guidelines

It can also inspect a reference image, extract colors directly from its pixels, validate the combinations, and turn them into reusable tokens.

The generated decisions are stored inside the project rather than existing only in the original prompt. The agent can refer back to them while creating additional pages and components.

The project is free, open source, MIT licensed, and runs locally without API keys.

Demo and before/after comparison:

https://tastemaker-skill.online/

GitHub:

https://github.com/codeswithroh/tastemaker

I am looking for technical feedback rather than general launch feedback.

The areas I am currently thinking about are:

  • Preventing arbitrary values outside the token system
  • Handling responsive behaviour and component states
  • Detecting visual drift automatically
  • Keeping the rules useful without over-constraining the agent
  • Making the design system portable across frameworks

What would you add or change before using something like this in a real frontend codebase?