Scale your Next.js application with Drizzle ORM and Neon Postgres Read Replicas
Learn how to scale Next.js applications with Drizzle ORM's withReplicas() function and Neon Postgres Read Replicas
Neon read replicas are independent read-only compute instances that can significantly enhance database performance and scalability. By distributing read operations across these replicas, you can reduce latency and improve overall system responsiveness, especially for read-heavy applications.
A key advantage of Neon's architecture is that adding a read replica doesn't require additional storage, making it a highly efficient scaling solution. This cost-effective approach is ideal for businesses of all sizes that need to improve database performance without increasing storage costs.
This guide demonstrates how to leverage Neon read replicas to efficiently scale Next.js applications using Drizzle ORM. You'll learn how to configure your Drizzle database client to work with read replicas, enabling you to optimize your database operations and improve overall application performance.
Prerequisites
- A Neon account and a Project. If you don't have one, you can sign up for a Neon account and create a project by following the Getting Started guide.
- Basic knowledge of Next.js and TypeScript
- Node.js and npm installed on your local machine
Build the Polling app
To demonstrate how to use Neon read replicas with Drizzle in Next.js, we'll build a simple Polling application that uses a Neon database. We'll then update the application to use a read replica for read operations, improving the application's performance and scalability.
Part 1: Build the initial Polling app with a single database
Set up the project
Create a new Next.js project with all the default options:
Install required packages
Install Drizzle ORM and the PostgreSQL driver:
Create the database schema
Create a new file db/schema.ts
:
This code defines the schema for our votes
table. It has an auto-incrementing id
, an option
field for the vote choice, and an ipAddress
field to track unique voters.
Set up the Drizzle client
Create a new file db/drizzle.ts
:
This code sets up the Drizzle ORM client. It creates a connection pool using the DATABASE_URL
from our environment variables and initializes Drizzle with this pool.
.env
Update Add the Neon database connection string:
This environment variable stores the connection string for your Neon database.
Set up migrations and create tables
Add the following scripts to your package.json
:
These scripts allow you to generate and run database migrations using Drizzle Kit.
Create a new file drizzle.config.ts
in the root of your project:
This configuration file tells Drizzle Kit where to find your schema, where to output migrations, and which database to connect to.
To generate your first migration based on your schema, run:
To apply the migration and create the table in your Neon database, run:
Create the API routes
Create a new file app/api/vote/route.ts
:
This file defines two API routes:
- The POST route handles new votes, checking for existing votes from the same IP and inserting new votes.
- The GET route retrieves the current vote counts for each option.
Create the frontend
Add shadcn-ui to the project for styling:
Update app/page.tsx
:
This component creates a user interface for the polling app. It includes:
- State management for votes and loading status
- An effect hook to fetch initial poll results
- A function to handle new votes
- A UI with buttons for voting and progress bars to show results
Run the application
Visit http://localhost:3000
to test the polling app.
Part 2: Use a read replica for read-only operations
Create a read replica on Neon
To create a read replica:
- In the Neon Console, select Branches.
- Select the branch where your database resides.
- Click Add Read Replica.
- On the Add new compute dialog, select Read replica as the Compute type.
- Specify the Compute size settings options. You can configure a Fixed Size compute with a specific amount of vCPU and RAM (the default) or enable autoscaling by configuring a minimum and maximum compute size. You can also configure the Suspend compute after inactivity setting, which is the amount of idle time after which your read replica compute is automatically suspended. The default setting is 5 minutes.
note
The compute size configuration determines the processing power of your database. More vCPU and memory means more processing power but also higher compute costs. For information about compute costs, see Billing metrics.
- When you finish making selections, click Create.
Your read replica compute is provisioned and appears on the Computes tab of the Branches page.
Navigate to the Dashboard page, select the branch where the read replica compute was provisioned, and set the compute option to Replica to obtain the read replica connection string:
Update the Drizzle client
Modify db/drizzle.ts
:
This setup uses Drizzle's withReplicas
function to create a single database client that can handle both primary and read replica connections. It automatically routes read queries to the read replica and write queries to the primary database.
.env
Update Add the read replica connection string:
These environment variables store the connection strings for both your primary database and the read replica.
note
You can also pass an array of read replica connection strings if you want to use multiple read replicas. Neon supports adding multiple read replicas to a database branch.
If you want to read from the primary compute and bypass read replicas, you can use the $primary()
key:
You can find the source code for the application described in this guide on GitHub.
Conclusion
By leveraging Neon's read replicas with Drizzle in your Next.js application, you can significantly improve your application's performance and scalability. Drizzle makes it easy to set up and use read replicas without having to manually manage multiple database connections in your application code.
This setup allows you to distribute your read load across one or more read replicas while ensuring that all write operations are performed on the primary database. Monitor your application's performance and adjust the number of read replicas as needed to handle your specific load requirements.
Need help?
Join our Discord Server to ask questions or see what others are doing with Neon. Users on paid plans can open a support ticket from the console. For more detail, see Getting Support.