Search code examples
c#.netwpfflowdocument

Displaying streaming rich text with WPF

I have a WPF application that connects via a socket to a device and gets streaming text data (approx 1 message per second). This data is then displayed on the UI. The user can create rules like "If the data contains 'abc' highlight the line" or "…make it bold", so plain text output will not do, it needs to be "rich" text.

My current solution to this is to have a FlowDocument in my ViewModel that contains the formatted output. The View has a FlowDocumentScrollViewer that is bound to the FlowDocument in the ViewModel.

This works, but when the FlowDocument gets large (~6,000 lines) performance starts to degrade. The current algorithm caps the number of lines at 10,000, but then things get even worse, to the point where the app is unusable. Once it reaches 10,000 lines, then I remove a line for every line that is added resulting in the FlowDocumentScrollViewer getting 2 update notifications for every new line.

I tried to find a way to batch delete (when we reach 10,000 lines delete the oldest 1,000 lines), but there is no bulk delete on the FlowDocument. Looping 1,000 times and doing the delete results in 1,000 update notifications and locks up the UI.

That’s my problem, here’s my question:

What is the best way to display streaming rich text content with WPF? I get ~ 1 message per second, each message is ~150 characters, and I want to keep the last 10000 messages. Am I going about this the wrong way? Are there other controls/objects that would perform better?

EDIT: Here are some more requirements

  • Need to be able to print the output text
  • Need to be able to select and copy the output text so it can be pasted into another document
Solution

  • The performance breakdown seemed to be caused by the high number of Blocks in the FlowDocument. For every message received I was creating a Run, adding that run to a Paragraph and adding the paragraph to the document.

    I changed the algorithm so now it creates a Paragraph then adds 250 Runs to that Paragraph, then creates a new Paragraph ... adds 250 Runs ... and so on. This essentially cuts the number of blocks in half.

    This also has an added benefit when I reach the max number of lines (10,000). Instead of deleting a single line for each new line added (and pegging the CPU), I can just delete the oldest Paragraph and that instantly deletes the oldest 250 lines.

    This relatively simple change brought the performance well within the acceptable range. Instead of pegging the CPU and locking up the UI, now the CPU stays relatively low with spikes around 15%.