StackDependenciesD3

D3

Last updated: Oct 28, 2026


Rationale

D3.js and Billboard.js render the pre-computed analytics in the dashboard of the Fluid Attacks platform.

These are the primary reasons why Fluid Attacks selected them:

  • They are open source.
  • D3 is the de facto standard for data-driven documents, and it gives full control over rendering and the DOM. The generators use it for selection and layout (for example, d3.select and d3.selectAll).
  • Billboard.js is built on D3, and it has ready-made chart types (line, bar, stacked bar, and others). These chart types are a good fit for Fluid Attacks and decrease the custom code.
  • The stack is a good fit for the analytics pipeline of Fluid Attacks. The pipeline stores pre-computed data and then sends it to the front end. Server-side chart rendering is not necessary.
  • The charts run in the browser from the static JSON that the generators produce.

Alternatives

Fluid Attacks examines these alternatives:

Evidence.dev

  • Evidence.dev is an open-source BI framework (Markdown + SQL). It can use Snowflake, which Fluid Attacks uses at this time.
  • To embed charts as iframes, Evidence Studio must have an Enterprise license. This blocks the primary integration surface (the Graphic component).
  • Evidence Studio does not support GitLab versioning. The report definitions are only on the Evidence platform, and this conflicts with the standard workflow of the team.
  • Evidence OSS has no built-in access control. To secure chart pages, a custom reverse proxy or authentication layer is necessary, and this adds much infrastructure work.

Plotly

  • Plotly is an open source charting library.
  • A new service is not necessary for it. Fluid Attacks can build charts with a SQL query to Snowflake, without pre-computed data.
  • The charts are interactive by default (hover, zoom, pan, and click events).
  • With the current D3 and Billboard approach, each graph usually loads in less than 1 second. Plotly charts load in 2 to 5 seconds per graph without alru_cache. This makes the dashboard experience worse.
  • The Plotly.js CDN bundle is approximately 3 MB. It adds much weight to each chart response in sandboxed iframes.

Apache ECharts

  • Apache ECharts has many chart types, and it is an alternative that Fluid Attacks can examine.
  • Fluid Attacks continues to use D3 and Billboard because of their smaller API surface and their current generator integration.

Usage

Fluid Attacks uses D3.js and Billboard.js to render analytics in its platform:

  • The platform loads the pre-computed chart data from storage and sends it to the client.
  • The front end loads D3 and Billboard and runs the generator logic for each visualization.
  • The generators use the data and use D3 and Billboard to draw the chart on the page.

On this page