Skip to content

Conversation

@mandarini
Copy link
Contributor

@mandarini mandarini commented Aug 12, 2025

What kind of change does this PR introduce?

Bug fix / Compatibility improvement - Updates @supabase/realtime-js to 2.16.0 which eliminates bundler warnings and runtime failures caused by dynamic imports.

What is the current behavior?

Widespread bundler and runtime issues affecting users:

  • Bundler warnings: Critical dependency: the request of a dependency is an expression in Webpack builds
  • Runtime failures: Applications crashing in Vercel Edge Runtime, Cloudflare Workers, and other deployment environments
  • Production breakage: Realtime subscriptions failing to connect or receive updates
  • Development friction: Console spam and build warnings affecting developer experience

Related Issues:

  • #1437 - 54+ comments from users experiencing production failures
  • Multiple reports across Next.js, SvelteKit, Solid-Start, and other frameworks
  • Affects official Supabase templates and starter projects
  • Users forced to downgrade to older versions (2.49.8) to avoid issues

Current problematic behavior from realtime-js:

// Dynamic imports causing bundler warnings and runtime failures const ws = this.dynamicRequire('ws') // Webpack: "Critical dependency"

What is the new behavior?

Universal compatibility with clean, explicit WebSocket configuration:

  • Zero bundler warnings across all bundlers and build tools
  • Universal deployment compatibility - works in all runtime environments
  • Predictable behavior - no magic detection that fails in edge cases
  • Enhanced error messages with clear migration guidance

For Most Users: No Changes Required

  • Browser environments: Continue working exactly as before
  • Node.js 22+: Native WebSocket support, no changes needed
  • Edge runtimes: Now work correctly (were previously broken)

For Node.js < 22 Users: Simple One-Time Migration

Before (caused issues):

import { createClient } from '@supabase/supabase-js' const supabase = createClient(url, key)

After (universal compatibility):

import { createClient } from '@supabase/supabase-js' import ws from 'ws' const supabase = createClient(url, key, { realtime: { transport: ws } })

Implementation Details

This PR updates the dependency and demonstrates the new usage pattern in the integration tests:

// Auto-detect environment and provide WebSocket when needed let wsTransport = undefined if (typeof WebSocket === 'undefined' && typeof process !== 'undefined' && process.versions?.node) { try { wsTransport = require('ws') } catch (error) { console.warn('WebSocket not available, Realtime features may not work') } } const supabase = createClient(SUPABASE_URL, ANON_KEY, { realtime: { heartbeatIntervalMs: 500, ...(wsTransport && { transport: wsTransport }), }, })

Additional context

Why This Is Not a Breaking Change

Current behavior is already broken for many users:

  1. Production failures documented in Issue 2.49.9 breaks application code on Vercel (error 500) #1437:

    • Vercel deployments returning 500 errors
    • Cloudflare Workers unable to deploy
    • Edge runtime crashes with WebSocket detection
    • Realtime subscriptions completely non-functional
  2. This PR fixes broken functionality rather than breaking working functionality

  3. Provides clear migration path with enhanced error messages and documentation

The Journey to This Solution

  1. Original Problem: isows dependency issues
  2. First Fix: Removed isows but reintroduced bundler warnings via dynamic imports
  3. Attempted Solution: Dual export patterns - rejected due to complexity
  4. Final Solution: realtime-js#514 - Remove dynamic imports entirely

Ecosystem Impact Analysis

Environment Current Status After This PR Migration Required
Browser ✅ Works ✅ Works None
Node.js 22+ ✅ Works ✅ Works None
Vercel Edge Broken Fixed None
Next.js Build ⚠️ Warnings ✅ Clean None
Node.js < 22 ⚠️ Fragile ✅ Reliable Explicit config

Long-term Benefits

  • Future-proof: Aligns with Node.js native WebSocket roadmap
  • Maintainable: Eliminates complex environment detection code
  • Secure: No dynamic imports that could be exploited or blocked by CSP
  • Performance: Removes runtime detection overhead
  • Developer Experience: Clean builds without warnings

Related PR: supabase/realtime-js#514 - The underlying fix that eliminates dynamic imports

@coveralls
Copy link

coveralls commented Aug 12, 2025

Pull Request Test Coverage Report for Build 16904258256

Details

  • 0 of 0 changed or added relevant lines in 0 files are covered.
  • No unchanged relevant lines lost coverage.
  • Overall coverage remained the same at 74.8%

Totals Coverage Status
Change from base Build 16805913259: 0.0%
Covered Lines: 122
Relevant Lines: 146

💛 - Coveralls
@mandarini mandarini self-assigned this Aug 12, 2025
@mandarini mandarini linked an issue Aug 12, 2025 that may be closed by this pull request
@mandarini mandarini force-pushed the feat/update-realtime-next branch from 5ac9926 to 18fbf68 Compare August 12, 2025 09:06
@mandarini mandarini changed the title feat: bump realtime js feat: bump realtime-js to 2.15.1 Aug 12, 2025
@mandarini mandarini marked this pull request as ready for review August 12, 2025 09:06
@mandarini mandarini merged commit 445dad3 into supabase:master Aug 12, 2025
13 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

3 participants