Explore Featurevisor integration with PartyKit

[Fahad Heylaal]

Quick summary of how Featurevisor works

• Manage feature flags via a git repo
• Merging PR to main/master branch triggers CI/CD pipeline
• CI/CD pipeline generates datafiles (JSON files with features config) and uploads them to CDN
• Clients use Featurevisor SDKs to fetch datafiles from CDN and evaluate flags

See quickstart guide: https://featurevisor.com/docs/quick-start/

See example with GitHub Actions and Cloudflare here for deployment here: https://featurevisor.com/docs/integrations/cloudflare-pages/

Refreshing datafile

Featurevisor SDKs can refresh datafile by fetching it again without reloading/restarting the whole application: https://featurevisor.com/docs/sdks/#refreshing-datafile

This can happen either:

• manually refreshing when application wants to, or
• setting an interval to refresh every X seconds

Challenge

Given the whole operation is based on static files in a CDN, there's no way to notify already running applications that there are new changes in features configuration, and they should refresh to pull in latest changes.

PartyKit

PartyKit is an SDK designed for creating real-time collaborative applications.

It leverages WebSockets, which can be a way for notifying applications for triggering a new refresh.

What to explore

• Create a new PartyKit server
• From a Featurevisor project's CI/CD pipeline, see if we can emit a new event like refresh
• From clients, listen the refresh event, and call featurevisorInstance.refresh()

API directions

In client apps, the solution may look like this:

import PartySocket from "partysocket";
import { createInstance } from "@featurevisor/sdk";

const socket = new PartySocket({
  host: "localhost:1999", // for local development
  // host: "my-party.username.partykit.dev", // for production
  room: "my-room",
});

const f = createInstance({
  datafileUrl: "https://cdn.mysite.com/datafile.json",

  onReady: () => "Featurevisor SDK has initialized and is ready for use",
  onRefresh: () => "Featurevisor SDK has fetched datafile again",
  onUpdate: () => "Featurevisor SDK has fetched datafile again, and it has new config changes",
});

socket.addEventListener("message", (message) => {
  // trigger a new refresh in Featurevisor SDK
  f.refresh();
});

cc @threepointone

[Fahad Heylaal]

Published: https://featurevisor.com/docs/integrations/partykit/

Done via #125