Web Development Recap 2025

December 30, 2025

What Happened in Web Dev 2025

Alright, let’s discuss what happened in web development this year. It’s been exciting—from React finally releasing their compiler to browsers integrating AI. Here are the key points that matter if you’re shipping JavaScript.

React 19 and Next.js 15 Are Here

React 19 is finally stable, and the React Compiler is impressive. Remember the hours spent adding useMemo everywhere? That’s a thing of the past. Your components run faster now, eliminating callback hell and memo wrapper chaos.

Next.js 15 is incredibly fast—stupid fast. Turbopack is now stable for development, boasting a 76% faster startup and a 96% faster hot reload. However, be aware that they changed the caching mechanism. Nothing is cached by default anymore, which I believe is an improvement. You can now choose what to cache.

The New Hooks That Actually Matter

`use()` - Async Data Without the Pain

Forget useEffect for data fetching. The use() hook just… works with promises.

// Create the promise outside the component
const fetchUser = (id) =>
  fetch(`/api/user/${id}`).then((res) => {
    if (!res.ok) throw new Error("Failed to fetch user")
    return res.json()
  })

// The component that uses the promise
function UserProfile({userId}) {
  // Create the promise during render
  const userPromise = fetchUser(userId)
  const user = use(userPromise)

  return (
    <div>
      <h2>{user.name}</h2>
      <p>{user.email}</p>
      <p>Joined: {new Date(user.createdAt).toLocaleDateString()}</p>
    </div>
  )
}

// Wrap with Suspense and ErrorBoundary for loading/error states
function UserPage({userId}) {
  return (
    <ErrorBoundary fallback={<div>Failed to load user</div>}>
      <Suspense fallback={<div>Loading user...</div>}>
        <UserProfile userId={userId} />
      </Suspense>
    </ErrorBoundary>
  )
}

You can even do conditional fetching without the mess:

function ProductPage({id, showReviews}) {
  const product = use(fetchProduct(id))
  const reviews = showReviews ? use(fetchReviews(id)) : null

  return (
    <>
      <h1>{product.name}</h1>
      {reviews && <ReviewList reviews={reviews} />}
    </>
  )
}

`useActionState` - Forms That Don’t Suck

This replaces useFormState and makes forms way easier. No more managing loading states manually:

async function submitForm(prevState, formData) {
  try {
    await fetch("/api/contact", {
      method: "POST",
      body: formData,
    })
    return {success: true}
  } catch (e) {
    return {error: "Failed"}
  }
}

function ContactForm() {
  const [state, formAction, isPending] = useActionState(submitForm, {
    success: false,
  })

  return (
    <form action={formAction}>
      <input name="email" disabled={isPending} />
      <button>{isPending ? "Sending..." : "Send"}</button>
      {state.error && <p>{state.error}</p>}
    </form>
  )
}

`useOptimistic` - Make Your App Feel Instant

This is huge for UX. Update the UI immediately, sync with the server later:

function TodoList({todos}) {
  const [optimisticTodos, addOptimistic] = useOptimistic(
    todos,
    (state, newTodo) => [...state, newTodo]
  )

  async function addTodo(text) {
    addOptimistic({id: Date.now(), text, pending: true})
    await createTodo(text) // Server sync happens in background
  }

  return optimisticTodos.map((todo) => (
    <li style={{opacity: todo.pending ? 0.5 : 1}}>{todo.text}</li>
  ))
}

Container Queries Work Everywhere

This is it—container queries have reached 95% browser support. We can finally build components that respond to their container rather than the viewport. This is a game changer for responsive design.

<div class="card-container">
  <div class="card">
    <img src="avatar.jpg" alt="Avatar" />
    <div class="content">
      <h2>Card Title</h2>
      <p>Some description text here.</p>
    </div>
  </div>
</div>

.card-container {
  container-type: inline-size;
}

@container (min-width: 400px) {
  .card {
    display: grid;
    grid-template-columns: 150px 1fr;
  }
}

The same card component functions in both a sidebar (stacked vertically) and main content area (displayed side by side). It requires no JavaScript and no parent-specific classes. It simply works.

The new container units (cqw, cqh) are also essential for truly responsive typography that scales with the container rather than the viewport.

.heading {
  font-size: 5cqw; /* 5% of the container's width */
}

.paragraph {
  font-size: 3cqw; /* 3% of the container's width */
}

AI Browsers Are Real Now

We’ve got three major AI browsers fighting it out:

Perplexity Comet ($200/month) - The AI actually browses for you. Tell it to research something and it’ll navigate sites, read content, and synthesize findings. Basically a research assistant that lives in your browser.

Dia (from Browser Company) - Built from scratch for AI. Looks like Chrome but the AI sees everything you’re doing and can help across tabs. Mac only for now.

OpenAI Atlas - ChatGPT in a browser with “agent mode” that can complete tasks for you. Free tier exists but the good stuff needs ChatGPT Plus.

Why should you care? Because users are starting to expect AI-first experiences. Your site needs to work when an AI is browsing it, not just humans.

Vite 6: The Environment API Changes Everything

Vite 6 dropped the Environment API and it’s a game changer for full-stack frameworks.

Here’s the deal: Vite used to only understand “browser” and “server”. Now it gets that your code might run in:

Browser
Node server
Edge workers
Service workers
Whatever weird runtime comes next

You can develop your Cloudflare Worker code with full HMR and it actually works like it will in production. No more “works on my machine” because dev wasn’t using the edge runtime.

TanStack Start already ditched their adapter system because Vite handles it now. Remix might finally get Server Components. This is huge for the ecosystem.

Oh, and Rolldown (Rust-powered Rollup replacement) is coming in Vite 7. One bundler for dev and prod, all fast as hell.

Web Components: Still Meh…

Look, browser support is great (95%+). The tech works. Big companies use them. But…

The DX still can’t compete with React,Vue or Svelte. You need libraries for basic stuff like reactivity and state management. SSR is painful. The ecosystem is fragmented.

They’re good for:

Design systems that need to work everywhere
Widgets that drop into any framework
Long-term projects where you can’t afford framework churn

For everything else? Just use React, as for now at least if the industry does not choose a different path.

WebGPU Is Actually Happening

WebGPU hit stable in Chrome and Safari. This isn’t WebGL 2.0 - it’s a modern GPU API that’s:

3x faster rendering
10-100x faster compute
Actually understands modern GPUs

TensorFlow.js runs 10-30x faster with WebGPU. Figma and Canva are already using it. If you’re doing anything with graphics, ML, or heavy computation in the browser, start learning this now.

The Temporal API (Finally)

JavaScript dates suck. We all know it. Temporal is the new way of working with dates in JavaScript:

// Old way using Date
const date = new Date(2025, 0, 15) // Is this Jan or Dec?
date.setMonth(date.getMonth() + 1) // Mutates!

// Temporal (use the polyfill for now)
import {Temporal} from "@js-temporal/polyfill"

const date = Temporal.PlainDate.from("2025-01-15")
const nextMonth = date.add({months: 1}) // Immutable!

It’s in Stage 3, so the API won’t change. However, polyfills are still recommended for use. I hope it will be ready in 2026.

Quick Hits

PWAs are mainstream - 54,000+ sites, costs 3-8x less than native apps

Edge computing is default - 75% of enterprise data processing happens at the edge

Security got serious - React had a CVSS 10.0 vulnerability (patched). DevSecOps is standard now.

Core Web Vitals - Clients literally ask for LCP and INP scores by name now

Voice search - 27% of mobile searches. Your site better work with natural language queries.

What You Should Actually Do

Upgrade to React 19/Next.js 15 - The performance gains are real
Learn container queries - Your responsive game will level up
Try an AI browser - See how your sites work when AI browses them
Use Vite 6 if you’re building anything full-stack
Start using Temporal in new projects (with the polyfill)
Check WebGPU if you do anything graphics/compute heavy
Make your sites fast - Core Web Vitals aren’t optional anymore

As we step into the year 2025, we find ourselves surrounded by an array of remarkable advancements. The tools available to us have significantly improved, offering enhanced functionalities that streamline our processes. Additionally, web browsers have evolved to become more intelligent, enabling us to navigate the digital landscape with greater efficiency and effectiveness. This evolution in technology allows us to create and develop projects at an unprecedented speed. So, rather than just consuming information, take this moment to shift your focus. Thank you for this year and look forward to what 2026 has to bring!