Skip to main content
Skip table of contents

6.0.0

Flow Director 6.0.0 ships the first release built on a brand-new web frontend. The previous UI was written against Vue 2 and Vuetify 1, a stack that hit end-of-life and could not be carried forward safely. Rather than patch around a frozen foundation, we rebuilt the UI on a small, durable, framework-free base.

What changed

The 6.0.0 frontend is built on native Web Components and the platform:

  • No framework. No Vue, no React, no Svelte, no Angular. Every screen is a custom element (fd-…) with its own Shadow DOM. No virtual-DOM layer.

  • No transpile step. Source is modern JavaScript (ES2022+). Vite (esbuild) bundles it. No Babel, no preset-env, no polyfills, no --openssl-legacy-provider.

  • No TypeScript toolchain. Plain JavaScript with JSDoc where useful.

  • A 7-package runtime allowlist (the entire production dependencies block, end to end):

    • @floating-ui/dom — menus, tooltips, autocompletes

    • @mdi/js — SVG icon paths

    • @vertx/eventbus-bridge-client.js — broker transport

    • echarts — charts

    • focus-trap — accessible modals

    • google-maps-api-loader — runtime loader for the map widget

    • mitt — ~200-byte in-process pub/sub

  • A single server facade in src/server/ is the only path between the UI and the server. Components subscribe to typed Shells, States, and Streams; no UI code speaks raw topic strings.

  • Themed through CSS custom properties only. Light and dark themes are token swaps, not separate stylesheets. Theme tokens pierce Shadow DOM boundaries, so every widget themes consistently with zero per-component theme code.

  • In-house SVG flow renderer. The flow editor, the flow viewer, and the db-process dashboard widget all share a single SVG canvas. The previous JointJS / Rappid dependency is gone.

What customers will notice

  • Faster first paint and faster navigation. Smaller bundle, no framework boot, no virtual-DOM reconciliation.

  • A consistent dark mode across every screen, every chart, every dialog.

  • Better keyboard and screen-reader behavior in dialogs and menus (native <dialog> + focus-trap).

  • No regressions in dashboard content. Every dashboard HTML file from 5.x continues to mount in 6.0 without modification — the same db-grid-layout, db-table, db-timeline, db-process, status cards, and chart widgets are available, with the same tag names and the same attribute contracts.

  • Same server, same flows, same permissions. The 6.0 UI talks to the same server your 5.x deployment already runs against. No flow JSON migration. No permission migration. No data migration.

What this means for your operations team

  • Smaller attack surface. Production dependency count dropped from the hundreds (transitively, through vue-cli-service and friends) to single digits direct, low double digits transitive. Most categories of npm-supply-chain CVE simply do not apply anymore because the packages are not installed.

  • Long-lived foundation. Web Components, native ES modules, CSS custom properties, and <dialog> are W3C standards shipped in every evergreen browser. There is no framework end-of-life clock to reset every two years.

Upgrade notes

  • 6.0.0 is a client-only change.

  • Hard-refresh the browser after deployment to clear cached 5.x bundles.

  • Bookmarks to top-level apps (/system, /explorer, the app selector) continue to work. Deep links into specific dashboards are intentionally not supported — navigation inside an app is menu-driven.

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.