Ins7ght Web Application

Ins7ght Web Application

CIB ins7ght provides a web-based interface for process analytics and visualization. The application displays global statistics, process analysis, and bottleneck detection through interactive charts and BPMN diagrams.

Architecture

CIB ins7ght consists of three main layers:

Frontend: Web interface built with Vue 3 that displays visualizations and charts

Backend: Spring Boot application that processes data and exposes REST APIs

Database: Stores synchronized process data from CIB seven (PostgreSQL or H2)

The backend continuously polls CIB seven via REST API to keep data synchronized.

Technology Stack

Backend

  • Framework: Spring Boot 3.5.1
  • Language: Java 17
  • Database Access: Spring Data JPA with Hibernate
  • CIB Seven Integration: Camunda REST Client 7.22.0
  • Supported Databases: PostgreSQL 12+, H2 2.0.202+

Frontend

  • Framework: Vue 3.5.13
  • Build Tool: Vite 6.2.3
  • HTTP Client: Axios 1.7.9
  • Charts: ApexCharts (vue3-apexcharts)
  • BPMN Visualization: bpmn-js 18.2.0
  • UI Framework: Bootstrap 5.3.3
  • Internationalization: Vue i18n (German, English, Spanish)

Key Features

Global Overview

Displays aggregated statistics across all processes:

  • Total started and finalized instances
  • Average duration metrics
  • Time series charts showing process execution over time
  • Process-specific KPI cards

Process Analysis

Detailed analysis for individual processes:

  • Activity-level performance metrics
  • Bottleneck identification and visualization
  • Outlier detection for slow instances
  • Interactive BPMN diagrams with overlays showing:
    • Activity execution counts
    • Average durations
    • Performance heatmaps

Filtering

All views support filtering by:

  • Process definition
  • Process version
  • Time range

BPMN Visualization

Interactive BPMN diagram viewer with:

  • Visual overlays for performance data
  • Activity selection and highlighting
  • Duration statistics display
  • Heatmap visualization
  • Click-to-drill-down functionality

How It Works

Data Synchronization

  1. The backend polling service connects to CIB seven REST API
  2. Process data is fetched incrementally (every 10 seconds by default)
  3. Data is transformed and stored in the CIB ins7ght database
  4. Historical data is available immediately for analysis

User Interaction

  1. User opens the web application in a browser
  2. User selects filters (process, time range, version)
  3. Frontend requests data from backend REST API
  4. Backend queries the database and calculates metrics
  5. Results are displayed as charts and visualizations

Deployment

Application Structure

CIB ins7ght is packaged as a single WAR file that contains:

  • Spring Boot backend application
  • Vue frontend (compiled static assets)
  • All required dependencies

Deployment Options

Tomcat Deployment: Deploy the WAR file to Apache Tomcat 10 or higher. The frontend is served by the backend at the same URL.

Container Deployment: The application can be deployed as a container using the pre-built images from harbor.cib.de/dev/cib-ins7ght.

Default port: 8899

See Installation Guide for deployment instructions.

Configuration

Backend Configuration

Key configuration options:

  • Database connection settings
  • CIB seven REST API URL
  • Polling interval and batch sizes
  • Authentication method for CIB seven

Frontend Configuration

The frontend reads API configuration from a config.json file:

  • API base URL
  • Default locale

See Configuration Guide for details.

Supported Languages

The web interface supports multiple languages:

  • German
  • English
  • Spanish

Language selection is available in the UI.

Performance Considerations

Backend

  • Hibernate batch processing for efficient database operations
  • Pagination for large data sets from CIB seven
  • Database indexing for query performance
  • Configurable polling intervals to balance freshness and load

Frontend

  • Optimized chart rendering for large datasets
  • Vite build optimization for fast load times
  • Asset minification and compression

Browser Requirements

Modern web browsers with JavaScript enabled:

  • Chrome 90+
  • Firefox 88+
  • Edge 90+
  • Safari 14+

Troubleshooting

Backend Issues

Application not starting:

  • Check database connection configuration
  • Verify port 8899 is available
  • Review application logs

No data appearing:

  • Verify CIB seven connection is configured correctly
  • Check polling status via /pollinfo endpoint
  • Ensure CIB seven REST API is accessible
  • Review authentication configuration

Frontend Issues

Cannot connect to backend:

  • Verify apiBaseUrl in config.json
  • Check that backend is running on the configured port
  • Review browser console for error messages

Charts not loading:

  • Check browser compatibility
  • Verify data is available from API endpoints
  • Review browser console for JavaScript errors

BPMN diagrams not showing:

  • Ensure process definitions have been imported
  • Verify BPMN XML is valid
  • Check that process has been deployed to CIB seven

Limitations

  • No authentication: Access control must be implemented externally

  • No real-time updates: Data is synchronized via polling, not pushed in real-time

  • Read-only: CIB ins7ght only reads data from CIB seven, it cannot modify processes or instances

Integration with CIB Seven

CIB ins7ght connects to CIB seven as a read-only analytics tool:

  • Accesses historical data via CIB seven REST API
  • Does not modify any CIB seven data
  • Requires authentication credentials for CIB seven
  • Compatible with CIB seven 7.22+

The application can connect to multiple CIB seven environments by changing the configuration.

On this Page: