Improve log scrolling to be more smooth (not flaky and not freezing the UI) when dealing with large amount of logs

[brian-mulier-p]

Explain the bug

The following flows produce a large amount of logs for a single task. Currently there is no pagination due to the fact that we want to provide to user a smooth scrolling experience without bothering with pages. However when dealing with large flows, it appears that the scrolling feels laggy and quite unusable. Maybe we can do something about it like an invisible pagination or check if we can optimize rendering or use another library than vue-virtual-scroller ?

id: logs
namespace: dev

tasks:
  - id: reproducer
    type: io.kestra.plugin.scripts.python.Script
    warningOnStdErr: false
    script: |
        import random
        import datetime
        import logging
        import time

        def setup_logger():
            logger = logging.getLogger('my_logger')
            logger.setLevel(logging.DEBUG) 

            formatter = logging.Formatter('%(asctime)s - %(levelname)s - %(message)s')

            console_handler = logging.StreamHandler()
            console_handler.setLevel(logging.DEBUG)  
            console_handler.setFormatter(formatter)

            logger.addHandler(console_handler)

            return logger

        def generate_log_message():
            log_levels = ['DEBUG', 'INFO']  
            log_messages = [
                'Debug info for troubleshooting',
                'Logging something to the concole on INFO level'
            ]
            log_level = random.choice(log_levels)
            log_message = random.choice(log_messages)
            return f'[{log_level}] {log_message}'

        def generate_logs(logger, num_logs):
            for _ in range(num_logs):
                log_message = generate_log_message()
                if log_message.startswith('[DEBUG]'):
                    logger.debug(log_message)
                elif log_message.startswith('[INFO]'):
                    logger.info(log_message)
                time.sleep(0.001)  # Simulate some time between log entries

        if __name__ == '__main__':
            logger = setup_logger()
            generate_logs(logger, 100000)

Environment Information

• Kestra Version:
• Operating System and Java Version (if not using Kestra Docker image):

[anna-geller]

a bit annoying part here is that you can't go back to the initial logs as the logs view keeps immediately moving to the most recently streamed logs. We may benefit from a more explicit scrollbar that doesn't move automatically

[anna-geller]

extra feedback: this amount of logs freezes the UI - might be a bigger issue than scrolling alone