Why is `bufferutil` and `ws` needed on my Next.js application?

Hello, a noob here, I have Next.js with Drizzle ORM. Based on Drizzle's documentation and Neon’s Next.js documentation, all I had to install as a dependency is @neondatabase/serverless (setting aside Drizzle ORM's set of dependencies). Then, when I ran the development server and made a query, I got a log message saying "WebSocket is not supported" (I am not sure, but it was along those lines). So I installed the package ws based on a post I saw here (or was it on Reddit?). Then, when I ran it again, it said bufferutil.Mask is missing. So, I went ahead and installed it too, and then it finally worked. So the question is, why are both packages needed and why is it not documented? Was my experience a special case? Here is my code for context:

import { neonConfig, Pool } from "@neondatabase/serverless";
import { config } from "dotenv";
import { drizzle } from "drizzle-orm/neon-serverless";
import ws from "ws";

import * as schema from "./schema";

config({ path: ".env" });

neonConfig.webSocketConstructor = ws;

const pool = new Pool({ connectionString: process.env.NEON_DATABASE_URL });

export const db = drizzle(pool, { schema });
export const conn = pool;

import { neonConfig, Pool } from "@neondatabase/serverless";
import { config } from "dotenv";
import { drizzle } from "drizzle-orm/neon-serverless";
import ws from "ws";

import * as schema from "./schema";

config({ path: ".env" });

neonConfig.webSocketConstructor = ws;

const pool = new Pool({ connectionString: process.env.NEON_DATABASE_URL });

export const db = drizzle(pool, { schema });
export const conn = pool;

References: - https://orm.drizzle.team/docs/get-started-postgresql - https://neon.tech/docs/guides/nextjs

Drizzle ORM - PostgreSQL

Drizzle ORM is a lightweight and performant TypeScript ORM with developer experience in mind.

Neon

Connect a Next.js application to Neon - Neon Docs

Next.js by Vercel is an open source web development framework that enables React based web applications. This topic describes how to create a Neon project and access it from a Next.js application. To ...

11 Replies

generous-apricot•2y ago

This (https://neon.tech/docs/guides/nextjs) document uses the HTTP driver. You don't need ws or bufferutil The Drizzle docs need an update though! I'll make a PR

Neon

Connect a Next.js application to Neon - Neon Docs

generous-apricot•2y ago

So the question is, why are both packages needed and why is it not documented? Was my experience a special case?

Oh, and the reason the ws package is needed is because not all environments have a WebSocket implementation available. In those environments you need to install it. IIRC bufferutils package is used by ws for handling masking/unmasking frames sent over the websocket

generous-apricot•2y ago

How does this look?

wise-whiteOP•2y ago

Looks great! Does this mean HTTP driver is preferred over WebSocket driver for Next.js?

generous-apricot•2y ago

The WebSocket driver is best if you need interactive transactions. HTTP mode is generally fine otherwise.

wise-whiteOP•2y ago

What are some examples of interactive transactions? Sorry, I am kind of new to this.

generous-apricot•2y ago

@karuro all good 🙂 basically anything like this: https://orm.drizzle.team/docs/transactions In plain PostgreSQL: https://www.postgresql.org/docs/current/tutorial-transactions.html

Drizzle ORM - Transactions

Drizzle ORM is a lightweight and performant TypeScript ORM with developer experience in mind.

PostgreSQL Documentation

3.4. Transactions

3.4. Transactions # Transactions are a fundamental concept of all database systems. The essential point of a transaction is that it …

generous-apricot•2y ago

You use it when you need to execute a series of operations, and if they fail part way through you can rollback.

wise-whiteOP•2y ago

Ohhhh, thank you! Last question (I promise): can I have multiple clients? Like a websocket client and an http client in my codebase?

generous-apricot•2y ago

Yep, pretty sure that's fine.

wise-whiteOP•2y ago

Nice! Thank you very much!

Gaming

Programming

Why is `bufferutil` and `ws` needed on my Next.js application?

Did you find this page helpful?