Web SDK - Remote Config

Read remote config values with the FunnelMob Web SDK.

Remote Config lets you change values in your app without shipping a new build. Define keys in the FunnelMob dashboard (under Feature Management → Remote Config), and read them from the SDK at runtime to flip features on or off, tune values, or roll out experiments.

The SDK fetches config automatically during initialize(), caches the result for 5 minutes in localStorage, and exposes synchronous getters that work even before the network call completes (using cached or default values).

Reading values

import { FunnelMob } from '@funnelmob/sdk';
 
// With a default — returns the default if the key is missing
const message = FunnelMob.shared.getConfig<string>('welcome_message', 'Welcome!');
const maxRetries = FunnelMob.shared.getConfig<number>('max_retry_attempts', 3);
const darkMode = FunnelMob.shared.getConfig<boolean>('dark_mode_default', false);
 
// Without a default — returns undefined if the key is missing
const maybeFlag = FunnelMob.shared.getConfig<boolean>('experimental_feature');
 
// Get everything at once
const all = FunnelMob.shared.getAllConfig();

The generic type parameter is for ergonomics — the value comes back as unknown at runtime and is asserted to your type. Always provide a default when reading values you depend on.

Reacting when config loads

If you need to react the first time config arrives (for example, to render a paywall whose copy is configured remotely), register a callback:

FunnelMob.shared.onConfigLoaded((config) => {
  // config: Record<string, unknown> — full snapshot
  const theme = FunnelMob.shared.getConfig<string>('theme', 'light');
  applyTheme(theme);
});

The callback fires immediately if config is already loaded (e.g. from cache), so you don't need to special-case the "already loaded" path.

Caching behavior

On first call to initialize(), the SDK loads the cached snapshot synchronously, then fetches the latest in the background. Dashboard edits invalidate the server-side cache instantly, but browsers may take up to 5 minutes to pick up changes because of the local cache.

If localStorage is unavailable (private mode, disabled by user policy), the SDK degrades gracefully — config still works, just without persistence between page loads.

Supported value types

Set values in the dashboard as one of: string, number, boolean, or json. The SDK preserves these types — read them back as string, number, boolean, or an object/array respectively.

interface FeatureFlags {
  new_dashboard: boolean;
  beta_analytics: boolean;
  ai_insights: boolean;
}
 
const flags = FunnelMob.shared.getConfig<FeatureFlags>('feature_flags', {
  new_dashboard: false,
  beta_analytics: false,
  ai_insights: false,
});
 
if (flags.ai_insights) {
  showAIPanel();
}

Common patterns

Feature flags

if (FunnelMob.shared.getConfig<boolean>('new_checkout_enabled', false)) {
  renderNewCheckout();
} else {
  renderLegacyCheckout();
}

Tuning values without a release

const timeoutMs = FunnelMob.shared.getConfig<number>('api_timeout_ms', 30_000);
fetch(url, { signal: AbortSignal.timeout(timeoutMs) });

Server-driven copy

welcomeEl.textContent = FunnelMob.shared.getConfig<string>(
  'welcome_message',
  'Welcome!',
);