Introducing Clerk Core 2 Beta

We've been working extremely hard to deliver (to you and your users) an improved overall experience with Clerk. In service of that, we've done some tidying up and are also rolling out some of our most highly requested SDK features.

Refreshed UI Components

Clerk SDKs included in the Core 2 release ship with improved design and UX on all of our UI components. Our new designs are the right starting point for any app. We continually strive to deliver a best-in-class collection of drop-in UI components that you can trust will get the job done for your users, so you can focus on building.

As always, if your app has custom needs, you can leverage our appearance prop, or use our hooks to fully customize your app's authentication experience.

New default middleware for Next.js

We've heard your feedback, and we've re-implemented our middleware helpers for Next.js. In Core 2, our middleware now defaults to not protecting any routes (previously it was the opposite). Going forward, you specify which routes you'd like to protect. You felt it made more sense to selectively configure your route protection, and we agree.

Additionally, the middleware bundle generated during build is now just 38kb instead of 150kb. This significantly reduces bundle size for better performance.

The new middleware is called clerkMiddleware, and you can read all about it in the docs and upgrade guide. Here's an example of how you'd protect all routes under /dashboard:

// middleware.ts
import {
  clerkMiddleware,
  createRouteMatcher
} from "@clerk/nextjs/server"

const isProtectedRoute = createRouteMatcher(["/dashboard(.*)"])

export default clerkMiddleware((auth, request) => {
  if (isProtectedRoute(request)) auth().protect()
})

export const config = {
  matcher: ["/((?!.+\\.[\\w]+$|_next).*)", "/", "/(api|trpc)(.*)"],
}

No more white flash for your users

Previously, we went to great lengths behind the scenes to synchronize your app's auth state client-side. This approach (unaffectionately called Interstitial internally at Clerk) often led to a sub-optimal experience where end users were shown a brief white flash while we sorted through the exchange.

Over the last few months, we've fully re-imagined our underlying session syncing logic (now affectionately called 🤝 Handshake internally) to no longer require client-side Javascript. The end result? 2x-5x faster execution (depending on the environment, your device, and the network) and lower latency for your end-users.

No more 401s. No more white flash. No more infinite redirects. A considerably snappier experience.

A whole lot of house cleaning

As Clerk has matured, so have our SDKs – and leading into v4 we were carrying around a considerable amount of technical debt. This release, Core 2, drops quite a bit of that debt, by way of simplifying internal logic and dropping previously deprecated functionality.

As an example, SDKs included in Core 2 will require you to use at least Node.js 18.17.0, React 18, and Next.js 13.0.4 or later. This allowed us to remove polyfills, compatibility layers, and complex logic that made it easier to introduce bugs.

Read the Core 2 migration guide to get all the details.

A CLI tool to help you upgrade

We know dealing with any major release for a piece of your underlying infrastructure, like auth, can be challenging. You just want to get back to building the core functionality of your app – we get it.

To aid you in this upgrade, we've built a CLI tool called @clerk/upgrade that scans your codebase and guides you step-by-step in upgrading to Core 2. No upgrade is ever perfect, but we're committed to getting you on to the latest and greatest, and back to shipping 🚀

Get started with Core 2 Beta

Want to get started with your upgrade process? Head over to our Core 2 migration guide, or you can start fresh with one of our quickstart guides. If you need help, please contact support or join the Clerk Community on Discord.

This release is still a beta and we do not recommend deploying it to production, but we do expect a stable release soon. Your feedback during the beta phase is enormously valuable for ensuring a smooth, stable rollout.

Happy coding ✌️