Supabase Realtime Feature Flag Management —

Supabase Feature Flag

Supabase Realtime Feature Flag PostgreSQL WebSocket RLS Gradual Rollout A/B Testing Kill Switch Toggle User Targeting

Database Schema

=== Supabase Feature Flag Schema ===

-- Feature Flags Table

CREATE TABLE feature_flags (

id UUID PRIMARY KEY DEFAULT gen_random_uuid(),

name TEXT UNIQUE NOT NULL,

description TEXT,

enabled BOOLEAN DEFAULT false,

percentage INTEGER DEFAULT 100 CHECK(percentage BETWEEN 0 AND 100),

target_rules JSONB DEFAULT '{}',

flag_type TEXT DEFAULT 'boolean' CHECK(flag_type IN ('boolean','percentage','targeted','ab_test')),

created_at TIMESTAMPTZ DEFAULT now(),

updated_at TIMESTAMPTZ DEFAULT now(),

created_by UUID REFERENCES auth.users(id)

);

-- Flag Overrides (per-user)

CREATE TABLE flag_overrides (

id UUID PRIMARY KEY DEFAULT gen_random_uuid(),

flag_id UUID REFERENCES feature_flags(id) ON DELETE CASCADE,

user_id UUID REFERENCES auth.users(id),

enabled BOOLEAN NOT NULL,

reason TEXT,

created_at TIMESTAMPTZ DEFAULT now(),

UNIQUE(flag_id, user_id)

);

-- Audit Log

CREATE TABLE flag_events (

id UUID PRIMARY KEY DEFAULT gen_random_uuid(),

flag_id UUID REFERENCES feature_flags(id),

เนื้อหาเกี่ยวข้อง — แนะนำให้อ่าน responsive design figma

action TEXT NOT NULL,

old_value JSONB,

new_value JSONB,

changed_by UUID REFERENCES auth.users(id),

changed_at TIMESTAMPTZ DEFAULT now()

);

-- RLS Policies

ALTER TABLE feature_flags ENABLE ROW LEVEL SECURITY;

แนะนำเพิ่มเติม — ระบบเทรดของ iCafeForex

CREATE POLICY "Anyone can read flags" ON feature_flags FOR SELECT USING (true);

CREATE POLICY "Admins can modify flags" ON feature_flags FOR ALL

USING (auth.jwt() ->> 'role' = 'admin');

-- Enable Realtime

ALTER PUBLICATION supabase_realtime ADD TABLE feature_flags;

from dataclasses import dataclass, field

@dataclass

class FeatureFlag:

name: str

flag_type: str

enabled: bool

percentage: int

target_rules: dict

description: str

flags = [

FeatureFlag("new_checkout_flow", "percentage", True, 25,

{"exclude_countries": ["CN"]},

"New checkout UI - gradual rollout 25%"),

FeatureFlag("dark_mode", "boolean", True, 100,

{},

"Dark mode toggle - fully rolled out"),

เนื้อหาเกี่ยวข้อง — ดูเพิ่มเติมเรื่อง aws direct connect คือ

FeatureFlag("ai_recommendations", "targeted", True, 100,

{"plans": ["premium", "enterprise"]},

"AI product recommendations - premium only"),

FeatureFlag("button_color_test", "ab_test", True, 100,

{"variants": {"A": "blue", "B": "green"}, "split": 50},

"A/B test button color"),

FeatureFlag("legacy_api", "boolean", False, 0,

{},

"Kill switch for legacy API - disabled"),

]

status = "ON" if f.enabled else "OFF"

แนะนำเพิ่มเติม — XM Signal

Realtime Client

=== Supabase Realtime Feature Flag Client ===

JavaScript Client

import { createClient } from '@supabase/supabase-js';

const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY);

Cache flags locally

let flagCache = {};

Load initial flags

async function loadFlags() {

const { data } = await supabase

.from('feature_flags')

.select('*')

.eq('enabled', true);

data.forEach(flag => flagCache[flag.name] = flag);

เนื้อหาเกี่ยวข้อง — แนะนำให้อ่าน GCP Vertex AI Container Orchestration

}

Subscribe to realtime changes

supabase

.channel('feature-flags')

.on('postgres_changes',

{ event: '*', schema: 'public', table: 'feature_flags' },

(payload) => {

if (payload.eventType === 'UPDATE' || payload.eventType === 'INSERT') {

flagCache[payload.new.name] = payload.new;

} else if (payload.eventType === 'DELETE') {

delete flagCache[payload.old.name];

}

console.log('Flag updated:', payload.new?.name);

}

)

.subscribe();

Check flag

function isEnabled(flagName, userId, userContext) {

const flag = flagCache[flagName];

if (!flag || !flag.enabled) return false;

if (flag.flag_type === 'boolean') return true;

if (flag.flag_type === 'percentage') {

return hashUser(userId) % 100 < flag.percentage;

}

if (flag.flag_type === 'targeted') {

return matchRules(flag.target_rules, userContext);

}

return false;

เนื้อหาเกี่ยวข้อง — อ่านต่อ: Libvirt KVM DNS Management

}

@dataclass

class RealtimeEvent:

event_type: str

flag_name: str

old_value: str

new_value: str

latency: str

events = [

RealtimeEvent("UPDATE", "new_checkout_flow",

"percentage: 25", "percentage: 50",

"< 500ms to all clients"),

RealtimeEvent("UPDATE", "ai_recommendations",

"plans: [premium]", "plans: [premium, pro]",

"< 500ms"),

RealtimeEvent("UPDATE", "legacy_api",

"enabled: true", "enabled: false (Kill Switch!)",

"< 200ms (urgent)"),

RealtimeEvent("INSERT", "holiday_banner",

"-", "enabled: true, percentage: 100",

"< 500ms"),

]

เคล็ดลับ

• Cache: Cache Flag ที่ Client ลด Latency ใช้ Realtime อัพเดท
• RLS: ใช้ Row Level Security ป้องกัน Unauthorized Flag Change
• Cleanup: ลบ Flag เก่าที่ Rollout 100% แล้ว ลด Technical Debt
• Audit: บันทึกทุกการเปลี่ยนแปลง Flag ใน flag_events
• Kill Switch: ทุก External Dependency ต้องมี Kill Switch Flag

Supabase คืออะไร

Open Source BaaS PostgreSQL Realtime WebSocket Authentication Storage Edge Functions RLS Firebase Alternative JavaScript Python Dart

อ่านเพิ่ม: Supabase คืออะไร? ทางเลือก Firebase แบบ Open Source สำหรับ F · อ่านเพิ่ม: Feature Flags คืออะไร? สอน Progressive Delivery และ Feature · อ่านเพิ่ม: MySQL และ MariaDB คืออะไร? สอน Database Administration สำหรั