Skip to content

Runtime and browser

Use this guide to decide how to load @beblurt/dblurt in Node.js, browser bundles and direct browser experiments.

Runtime support is owned by package.json and validated by CI. This page explains how to use the documented surfaces without turning package metadata into a second compatibility table.

Runtime requirements

Check the canonical metadata first:

  • package.json engines.node owns the Node.js baseline;
  • package.json types and typings own declaration entrypoints;
  • package.json browser owns browser bundler remapping;
  • package.json browserslist owns browser feature expectations.

For the current support model, use Compatibility.

Node.js usage

Install from npm:

bash
npm install @beblurt/dblurt

Use TypeScript + ESM-style imports in new examples and modern app code:

ts
import { Client } from '@beblurt/dblurt';

const client = new Client(['https://rpc.blurt.blog']);
const props = await client.condenser.getDynamicGlobalProperties();

console.log(props.head_block_number);

CommonJS remains a compatibility surface. Use Package exports when you need runtime entrypoint details.

Browser usage through a bundler

For browser applications built with modern bundlers, install from npm and import normally:

ts
import { Client } from '@beblurt/dblurt';

const client = new Client(['https://rpc.blurt.blog']);
const version = await client.call('database_api', 'get_version', []);

console.log(version.blockchain_version);

The package browser mapping points browser-oriented builds away from the Node entrypoint. Your bundler is still responsible for dependency resolution, minification and security controls.

Direct browser experiments

For quick experiments, the browser bundle is available from UNPKG:

html
<script src="https://unpkg.com/@beblurt/dblurt@latest/dist/dblurt.js"></script>
<script>
const client = new dblurt.Client(['https://rpc.blurt.blog']);
client.condenser.getDynamicGlobalProperties()
    .then((props) => console.log(props.head_block_number))
    .catch(console.error);
</script>

Use @latest only for experiments and demos. Pin an exact package version in production CDN usage.

For a complete browser file, see examples/browser/unpkg.html.

Self-hosting the browser bundle

Production browser applications should consider self-hosting the bundle or using Subresource Integrity with a pinned CDN asset. The generated runtime bundle is intended to be usable under a strict Content Security Policy without unsafe-eval; maintainers verify this with the CSP runtime check before release.

After installing the package, serve:

text
node_modules/@beblurt/dblurt/dist/dblurt.js
node_modules/@beblurt/dblurt/dist/dblurt.d.ts

Example:

html
<script src="/vendor/dblurt.js"></script>

Required browser features

Browser targets are defined by package metadata. The current browser expectation includes:

  • fetch;
  • AbortController.

Do not infer support for every browser or browser-like runtime. React Native, unusual WebViews and constrained embedded browsers need explicit validation before they are documented as supported.

Browser security model

Browser apps are exposed to XSS, malicious dependencies, compromised CDN assets and user-device risks. A strict CSP is recommended, but it does not replace normal key-custody and dependency controls.

For blockchain query screens, a browser flow can be straightforward: create a client, query public RPC endpoints and render the result.

For signing or broadcast workflows, browser code becomes security-sensitive:

  • do not hard-code private keys;
  • do not store high-privilege keys in local storage;
  • prefer wallet/user-controlled signing flows;
  • protect against XSS before handling secrets;
  • make the operation payload visible before signing;
  • avoid active/owner authority unless the operation requires it.

Read Broadcast safely and Accounts and authorities before adding browser signing.

RPC endpoint considerations

Browsers can only call endpoints that permit the request through CORS and network policy. Provide an ordered endpoint list when reliability matters:

ts
const client = new Client([
    'https://rpc.blurt.blog',
    'https://rpc.beblurt.com',
    'https://blurt-rpc.saboin.com'
], {
    timeout: 15_000,
    failoverThreshold: 3
});

Do not accept arbitrary user-provided RPC URLs in production browser or backend services without a threat model. See RPC endpoints and failover.

API details

Use the API reference for exact constructor options and runtime-facing types: