## Summary Currently we used a DOM based solution to render job logs, this solution has worked well enough for us from the beginning but there are a few limitations, most notably the ability to render large job logs without incurring in performance problems on the browser side. ## Improvements The new renderer should be able to support logs that are MB's in size, ideally the backend should be able to send the entire log and the frontend should display it as soon as the log is downloaded. ## Risks We should either create a custom canvas based renderer o use a library that allows us to work with HTML 5 based rendering to show a large number of job log lines, currently our job log component supports the following: - Mobile and Desktop compatible views - Collapsible sections - Limited ANSI escape sequences (Need clarification) - Anchors for each line. You can link to any line number of the job log by clicking on the line number - Searchable log via the browser tools The new renderer should support the above as a MVC as we don't want to compromise any existing features by introducing a new renderer, any new features can be created as follow-ups to this issue ## Current status In %"17.2" we have published an experimental log viewer that parses raw jobs logs and renders them in the browser. There is no limit to the size of the logs that can be rendered, as long as the machine/browser used is powerful enough. The job log viewer can be visited for any job by adding `/viewer` to the job details URL ([example](https://gitlab.com/ajwalker/colourful/-/jobs/7479492838/viewer)). In addition, a link the viewer is visible to when the log is over the 500kb limit. The viewer is marked as experimental, and users are invited to provide feedback at https://gitlab.com/gitlab-org/gitlab/-/issues/463391. ## Other considerations * Rendering large job logs - Rendering a 500kb log should be as fast / faster as today. Ideally loading up to the new limit would be as fast as a 500kb log today. * Improving the mobile log viewing experience on top devices accessing the page * Decreasing the loading times of the page/log by ??%