Skip to main content

Production Deployment

Deploy the exact customer SDK build and release values confirmed in the license model. TradeScript renders directly inside your application rather than through an iframe, so your application controls its JavaScript bundle, styles, worker assets, network access, Content Security Policy, and release checks.

The production build must use the exact package and lockfile installed through Package access. Package download access and runtime lease authorization are separate: npm retrieves the signed code, while your backend credential obtains short-lived browser leases for approved origins.

1. Bundle the SDK and styles​

Import the styles once from your application root:

import '@tradescript/pro/style.css';
import '@tradescript/pro/tailwind.css';

Pin the TradeScript package version in your lockfile and build the application with the same version that your deployment lease permits.

Verify: the production page renders chart toolbars, panels, text, and icons with no missing stylesheet requests.

2. Serve worker assets or opt out explicitly​

Overlay and indicator workers are enabled by default. They start lazily and fall back to main-thread execution if startup fails. For the default path, deploy the worker files emitted with the same package build:

const mounted = sdk.chart.mount({
  mount: '#chart',
  symbol: 'AAPL',
  interval: '5m',
  datafeed,
});

The recommended deployment serves the packaged worker files from the same origin as the application. If your asset pipeline moves them, provide their final URLs:

const mounted = sdk.chart.mount({
  mount: '#chart',
  symbol: 'AAPL',
  interval: '5m',
  datafeed,
  workers: {
    overlay: { workerUrl: '/sdk-workers/overlay-compute.worker.js' },
    indicators: { workerUrl: '/sdk-workers/indicator.worker.js' },
  },
});

Keep each worker beside the chunks emitted with it. When using a CDN or another origin, configure JavaScript MIME types, CORS, and worker-src, then test that exact production origin in a real browser. If your deployment deliberately runs all calculation on the main thread, opt out explicitly:

const mounted = sdk.chart.mount({
  mount: '#chart',
  symbol: 'AAPL',
  interval: '5m',
  datafeed,
  workers: false,
});

Verify: mounted.api.getWorkerStatus() reports the expected execution mode. If workers are disabled, confirm that the chart remains responsive under the indicator and overlay load your product supports.

3. Allow integration origins​

Market-data requests originate from your application page. Cross-origin REST providers must allow the application origin and any authentication headers. WebSocket providers may validate the browser Origin header even though they do not use a CORS preflight.

Apply the same review to any browser-side broker, storage, news, alerts, or application-bootstrap endpoint. Prefer your backend as the boundary when a provider credential must remain secret.

Verify: history, realtime bars, search, quotes, and any other enabled feed capabilities succeed on the deployed origin without CORS or WebSocket-origin errors.

4. Configure Content Security Policy​

Add only the directives required by the features you enable:

DirectiveAdd it whenAllow
connect-srcMarket data, application bootstrap, or broker calls use network transportYour data, application, and broker origins.
worker-srcworkers is enabledPrefer the application origin with 'self'; otherwise allow the exact worker origin.
frame-srcUsers can place embedded web content on the chartThe exact video or content origins your product permits.

TradeScript does not require unsafe-eval for built-in indicators or trusted custom indicator modules compiled with your application.

Verify: use every enabled chart feature with browser CSP reporting active. No blocked request or worker startup error should appear.

5. Install the matching deployment lease​

Obtain the current deployment lease from your own backend bootstrap and create the SDK before mounting a chart:

import { createTradeScriptSdk } from '@tradescript/pro/sdk/core';

const deploymentLease = chartBootstrap.deploymentLease;
const sdk = await createTradeScriptSdk({ lease: deploymentLease });

Do not put the permanent TradeScript credential in frontend environment files, HTML, JavaScript bundles, browser storage, or worker messages. The lease must match the package version and customer build fingerprint in the deployed artifact. See Production Authorization for exchange and renewal.

Verify: a valid lease mounts on the approved production origin; a missing, expired, or wrong-build lease fails before the chart starts.

6. Record the release identity​

For every deployment, record the application version, TradeScript package version, customer build fingerprint, deployed origin, worker configuration, and release timestamp. Do not record the credential or complete lease.

This identity lets monitoring and support distinguish an application problem from a package, lease, policy, or stale-asset mismatch.

7. Verify the deployed user journey​

Run the checks against the deployed artifact, not only a development server:

  1. Load the route from a new browser session.
  2. Confirm the chart shell and historical bars appear.
  3. Change symbol and interval and confirm new feed requests succeed.
  4. Exercise every enabled optional surface: search, drawings, indicators, storage, trading, replay, or workers.
  5. Navigate away and confirm subscriptions and workers stop.
  6. Navigate back and confirm a fresh chart mounts once.
  7. Test loading, empty, denied, network-error, and expired-lease states.

Use Verify your deployment for the complete release matrix and evidence format.

Production checklist​

  • TradeScript package versions are pinned and styles are bundled once.
  • Worker files load from the configured URLs, or workers are explicitly off.
  • Data and broker origins allow the deployed application origin.
  • CSP permits only the network, worker, and frame origins the product uses.
  • Browser bootstrap contains a current deployment lease and no permanent TradeScript credential.
  • The recorded version, build fingerprint, origin, and worker configuration describe the artifact users actually receive.
  • The deployed chart passes mount, data, interaction, optional-feature, error, and teardown checks.

Next steps​