553 feature request graphical timetable streckengrafik performance optimisation #555

aiAdrian · 2025-10-08T13:54:24Z

Description

Graphical Timetable Performance Optimization

The calculation time for the extractSectionTracks method has been significantly reduced:

Google Chrome: Improved by a factor of 3 (from ~75ms to ~25ms)
Microsoft Edge: Improved by a factor of 5 (from ~620ms to ~115ms)

These optimizations enhance responsiveness and reduce latency across browsers, especially for Edge users.

Performance Improvement: extractSectionTracks Method

Goal: Improve rendering performance of the graphical timetable by introducing caching and more efficient data structures.

Extended Functionality

Caching introduced: Added getTrainrunSectionFromCacheDuringRendering() method using a Map<number, TrainrunSection> to avoid redundant service calls.

Cache integration: The cache is now used across multiple methods:

render()
extractStreckenGleis()
extractSectionTracks()
calculateMinimumHeadwayTimeAtNode()
computeTrackAlignments()
setMaxTrackMap()

 Performance Improvements

Optimized data structure: Replaced number[][] with Uint8Array for dataMatrix to reduce memory usage and improve access speed.
Frequency unrolling refactored: New method extractSectionTracksUnrollFreq() handles train frequency loops more efficiently.
Occupation band optimization: extractSectionTracksFillOccupationBand() fills occupancy data with bounds checking and performance tuning.

 Logic Enhancements

headwayTime calculation now uses the cache.
Precomputations like travelTimeIdxPart and baseTimeCellIdx improve loop performance

Issues

#553

Checklist

This PR contains a description of the changes I'm making
I've read the Contribution Guidelines
I've added tests for changes or features I've introduced
I documented any high-level concepts I'm introducing in documentation/
CI is currently green and this is ready for review

…. To improve rendering performance, we’ve introduced a lookup cache that handles frequent access more efficiently.

shenriotpro

I can't say I understand the logic, but I love the result :)

src/app/streckengrafik/services/sg-6-track.service.ts

aiAdrian · 2025-10-11T06:48:19Z

#556

src/app/streckengrafik/services/sg-6-track.service.ts

Copilot

Pull Request Overview

This PR optimizes the performance of the graphical timetable rendering by introducing caching and more efficient data structures, achieving ~3x improvement in Chrome and ~5x improvement in Edge for the extractSectionTracks method.

Key changes:

Introduced a Map<number, TrainrunSection> cache to eliminate redundant service calls during rendering
Replaced number[][] with Uint8Array for the data matrix to reduce memory usage and improve access speed
Refactored the track extraction logic into smaller, more focused methods with precomputed values

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2025-11-11T17:47:31Z

src/app/streckengrafik/services/sg-6-track.service.ts

      return;
    }

+    // prepare fast look (cache for big netzgrafik)


Corrected incomplete comment 'prepare fast look' to 'prepare fast lookup'.

Suggested change

// prepare fast look (cache for big netzgrafik)

// prepare fast lookup (cache for big netzgrafik)

Copilot · 2025-11-11T17:47:32Z

src/app/streckengrafik/services/sg-6-track.service.ts

+      // We restrict the number of section tracks to 255 tracks (between two nodes we could only
+      // have 255 tracks - this improves the performance


The comment explains why 255 tracks is the limit but doesn't explain the underlying constraint. Consider clarifying why the limit exists (e.g., Uint8Array max value) and whether this is a technical or business constraint.

Suggested change

// We restrict the number of section tracks to 255 tracks (between two nodes we could only

// have 255 tracks - this improves the performance

// We restrict the number of section tracks to 255 tracks (between two nodes) because we use Uint8Array

// to store track occupancy, and Uint8Array can only store values from 0 to 255. This is a technical constraint,

// not a business constraint, and allows for efficient memory usage and performance.

Copilot · 2025-11-11T17:47:32Z

src/app/streckengrafik/services/sg-6-track.service.ts

+    departureMod: number,
+    timeRes: number,
+    headwayTime: number,
+    dataMatrix: any[],


The parameter type any[] is too generic. Based on the implementation, this should be typed as Uint8Array[] for better type safety and code clarity.

Suggested change

dataMatrix: any[],

dataMatrix: Uint8Array[],

src/app/streckengrafik/services/sg-6-track.service.ts

Copilot · 2025-11-11T17:47:32Z

src/app/streckengrafik/services/sg-6-track.service.ts

+    const startIdx =
+      baseTimeCellIdx < 0 ? 0 : baseTimeCellIdx > nTimeCells ? nTimeCells : baseTimeCellIdx;
+
+    // const endIdx = Math.max(0, Math.min(baseTimeCellIdx + bandLength, nTimeCells)); (perf. opt.)


Similar to the startIdx comment above, this commented-out code should either be removed or the comment should explain why the ternary operator approach is a performance optimization over Math.max/Math.min.

Suggested change

// const endIdx = Math.max(0, Math.min(baseTimeCellIdx + bandLength, nTimeCells)); (perf. opt.)

// Instead of using: const endIdx = Math.max(0, Math.min(baseTimeCellIdx + bandLength, nTimeCells));

// we use the ternary operator below for performance reasons, as this code is in a hot loop and

// avoiding function calls (Math.max/Math.min) can be measurably faster in JavaScript/TypeScript.

Co-authored-by: Copilot <[email protected]>

louisgreiner

After some testing, the performances seem way better indeed, however, on the demo reticular, I notice different result between the current version and this one.

Old version	New version

:/

aiAdrian added 7 commits October 7, 2025 11:25

fix: Refactored / reordered code improve perf?

df83154

fix: speed up 2x

551ffaf

fix: Refactored / reordered code improve perf?

3d71bee

npm run format

56d2e4f

npm run format

58773a8

fix: performance imporved

fc5d9c2

fix: performance imporved

bed1d6e

aiAdrian linked an issue Oct 8, 2025 that may be closed by this pull request

[Feature request]: Graphical Timetable (Streckengrafik) performance optimisation #553

Open

3 tasks

removed console.log out

157c251

aiAdrian self-assigned this Oct 8, 2025

aiAdrian added the enhancement New feature or request label Oct 8, 2025

aiAdrian added 3 commits October 9, 2025 08:11

small perf fixes

5438ce4

Looking up train run sections can be costly in large network graphics…

76c7fea

…. To improve rendering performance, we’ve introduced a lookup cache that handles frequent access more efficiently.

cache/lookup refactored into private method to avoid code duplications

a585316

aiAdrian requested review from emersion, louisgreiner and shenriotpro October 9, 2025 14:24

aiAdrian added this to the 2.10 milestone Oct 10, 2025

comment added

251c177

shenriotpro reviewed Oct 10, 2025

View reviewed changes

aiAdrian requested a review from shenriotpro October 10, 2025 14:42

aiAdrian added 9 commits October 10, 2025 21:09

refactored

2811152

typo fixed

f747110

typo/text fix

8a9c967

npm run format - added endOfLine

80d27d0

clrf -> lf

fec0f27

clrf

adf48e0

get more info

9d762ef

prettier --loglevel debug

27d2169

prettier --loglevel debug

daf0da5

aiAdrian and others added 4 commits October 10, 2025 21:51

npm run format

5bfb56e

checkout issue -> LF must be set

6dd57f4

Update package.json

fa46d64

Moved into separate PR .prettierrc.json

061cb70

readability improved

0b4db41

louisgreiner reviewed Oct 13, 2025

View reviewed changes

src/app/streckengrafik/services/sg-6-track.service.ts Show resolved Hide resolved

npm run format

9bdfdfb

aiAdrian requested a review from louisgreiner October 13, 2025 15:31

aiAdrian added 2 commits October 14, 2025 17:28

Math.max replaced by faster variant

660a67b

formating issue

b86a830

shenriotpro removed their request for review October 20, 2025 07:35

aiAdrian requested a review from Copilot November 11, 2025 17:46

Copilot AI reviewed Nov 11, 2025

View reviewed changes

Update src/app/streckengrafik/services/sg-6-track.service.ts

a1940b7

Co-authored-by: Copilot <[email protected]>

louisgreiner reviewed Nov 14, 2025

View reviewed changes

	// prepare fast look (cache for big netzgrafik)
	// prepare fast lookup (cache for big netzgrafik)

		// We restrict the number of section tracks to 255 tracks (between two nodes we could only
		// have 255 tracks - this improves the performance

-      // We restrict the number of section tracks to 255 tracks (between two nodes we could only
-      // have 255 tracks - this improves the performance
+      // We restrict the number of section tracks to 255 tracks (between two nodes) because we use Uint8Array
+      // to store track occupancy, and Uint8Array can only store values from 0 to 255. This is a technical constraint,
+      // not a business constraint, and allows for efficient memory usage and performance.

-    // const endIdx = Math.max(0, Math.min(baseTimeCellIdx + bandLength, nTimeCells)); (perf. opt.)
+    // Instead of using: const endIdx = Math.max(0, Math.min(baseTimeCellIdx + bandLength, nTimeCells));
+    // we use the ternary operator below for performance reasons, as this code is in a hot loop and
+    // avoiding function calls (Math.max/Math.min) can be measurably faster in JavaScript/TypeScript.

553 feature request graphical timetable streckengrafik performance optimisation #555

Are you sure you want to change the base?

553 feature request graphical timetable streckengrafik performance optimisation #555

Conversation

aiAdrian commented Oct 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Graphical Timetable Performance Optimization

Performance Improvement: extractSectionTracks Method

Extended Functionality

Performance Improvements

Logic Enhancements

Issues

Checklist

Uh oh!

shenriotpro left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

aiAdrian commented Oct 11, 2025

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Uh oh!

Copilot AI Nov 11, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Nov 11, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Nov 11, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Copilot AI Nov 11, 2025

Choose a reason for hiding this comment

Uh oh!

louisgreiner left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

aiAdrian commented Oct 8, 2025 •

edited

Loading

 Performance Improvements

 Logic Enhancements