Escolha o SDK certo da rollfuse para o seu caso

A rollfuse tem três pacotes JavaScript, e o certo para cada trecho de código depende de onde ele roda e qual tipo de credential ele pode guardar, não de qual funcionalidade você quer usar, já que os três avaliam flags da mesma forma.

@rollfuse/sdk-js: servidor Node.js, Service Credential

Use este pacote em qualquer processo Node.js (uma API, um worker em background, um Server Component do Next.js) que possa guardar uma Service Credential sem expô-la a um client.

import { RollfuseClient } from "@rollfuse/sdk-js";

const client = new RollfuseClient({
  baseUrl: "https://api.rollfuse.com",
  credential: process.env.ROLLFUSE_CREDENTIAL!, // set before running
});

await client.start();

const result = client.evaluate("user-42", "checkout-redesign", { fallback: false });

Uma Service Credential pode ler a Configuration completa e enviar exposure events diretamente. Ela nunca deve chegar a um browser: veja Emita e revogue credenciais de ambiente para entender como ela é emitida e rotacionada.

@rollfuse/sdk-browser: client-side, Public Credential

Use este pacote quando a avaliação precisa acontecer diretamente no browser, por exemplo um widget totalmente client-side sem etapa de renderização no servidor. Ele recebe um publicCredential, um token emitido a partir de uma Credential criada em modo Public com apenas config:read, nunca uma Service Credential normal.

npm install @rollfuse/sdk-browser

import { RollfusePublicClient } from "@rollfuse/sdk-browser";

const client = new RollfusePublicClient({
  baseUrl: "https://api.rollfuse.com",
  publicCredential: (window as any).__ROLLFUSE_PUBLIC_CREDENTIAL__, // injected by your own server-rendered template
});

await client.start();

const unsubscribe = client.subscribe(() => {
  // Configuration atualizou: reavalie e re-renderize
});

const result = client.evaluate("user-42", "checkout-redesign", { fallback: false });

Uma Public Credential só consegue ler a Configuration, então se ela aparecer na aba de rede do browser isso não expõe acesso de escrita nem dados de outros ambientes, como aconteceria com uma Service Credential.

@rollfuse/sdk-react: a camada de consumo para React e Next.js

O @rollfuse/sdk-react não fala com a plataforma sozinho. Ele envolve um dos dois clients acima por trás de RollfuseProvider, useFlag e useFlags, e suporta dois modos.

npm install @rollfuse/sdk-react

Modo 1: props avaliadas no servidor. Um Server Component do Next.js roda client.evaluateAll(subjectKey) do sdk-js, e depois passa o evaluations resultante como props normais:

import { RollfuseProvider, useFlag } from "@rollfuse/sdk-react";

// Server Component
const evaluations = client.evaluateAll(subjectKey, { attributes: { plan: "pro" } });

function Page() {
  return (
    <RollfuseProvider evaluations={evaluations}>
      <Checkout />
    </RollfuseProvider>
  );
}

// Client Component
function Checkout() {
  const flag = useFlag<boolean>("checkout-redesign", { fallback: false });
  return flag.value ? <NewCheckout /> : <LegacyCheckout />;
}

Nesse modo, a Service Credential fica inteiramente no servidor: o browser só recebe valores já resolvidos, nunca a credential em si.

Modo 2: client-driven. O RollfuseProvider recebe diretamente um RollfusePublicClient do sdk-browser, junto com o subjectKey e os attributes a avaliar:

import { RollfuseProvider, useFlag, reportExposure } from "@rollfuse/sdk-react";

function App({ publicClient, subjectKey, attributes }) {
  return (
    <RollfuseProvider client={publicClient} subjectKey={subjectKey} attributes={attributes}>
      <Checkout />
    </RollfuseProvider>
  );
}

function Checkout() {
  const flag = useFlag<boolean>("checkout-redesign", { fallback: false });

  if (flag.value) {
    reportExposure("/api/rollfuse-exposure", {
      flagKey: "checkout-redesign",
      subjectKey: "user-42",
      variationKey: flag.variation_key,
      reason: flag.reason,
      configVersion: flag.config_version,
    });
  }

  return flag.value ? <NewCheckout /> : <LegacyCheckout />;
}

O reportExposure envia a chamada para um endpoint da sua própria aplicação, nunca direto para a API de exposure da plataforma: é a sua rota /api/rollfuse-exposure que repassa isso no servidor com uma Service Credential de verdade.

Na prática, qual escolher

• Servidor pode guardar uma Service Credential e você quer que o browser veja só valores já resolvidos: sdk-js mais sdk-react no modo de props avaliadas no servidor.
• Sem etapa de renderização no servidor, ou a avaliação realmente precisa acontecer no browser: sdk-browser, sozinho ou envolvido pelo sdk-react no modo client-driven.
• Serviço Node.js simples, sem React envolvido: sdk-js sozinho, como visto em Avalie sua primeira flag com o sdk-js.