Currently, when viewing source code all syntax highlighting markup is generated on the BE (with Rogue) which has a big performance impact. By highlighting the syntax on the frontend using HighlightJS we can reduce the load on the backend ### Solutions We have identified a few possible solutions to render source code on the FE and have created POC implementations for each of them: * Rogue (current) * [Source Editor (read-only Monaco)](https://gitlab.com/gitlab-org/gitlab/-/merge_requests/67864) * [Monaco](https://gitlab.com/gitlab-org/gitlab/-/merge_requests/67805) * [HighlightJS](https://gitlab.com/gitlab-org/gitlab/-/merge_requests/68652) At this stage, HighlightJS seems like the most lightweight solution with the most language support. ### Things to keep in mind Here are some things we need to keep in mind when making the decision. * Performance impact (**check performance against very large files**) * Language support * UX impact * Feature support (Sourcegraph, Code intelligence, [.gitattributes](https://docs.gitlab.com/ee/user/project/git_attributes.html#syntax-highlighting) etc.) <!-- triage-serverless v3 PLEASE DO NOT REMOVE THIS SECTION --> *This page may contain information related to upcoming products, features and functionality. It is important to note that the information presented is for informational purposes only, so please do not rely on the information for purchasing or planning purposes. Just like with all projects, the items mentioned on the page are subject to change or delay, and the development, release, and timing of any products, features, or functionality remain at the sole discretion of GitLab Inc.* <!-- triage-serverless v3 PLEASE DO NOT REMOVE THIS SECTION -->