이미지 크기 조정 가이드

이 섹션에는 GitLab 이미지 크기 조정기의 간단한 개요와 해당 작업 방법이 포함되어 있습니다.

GitLab에서 이미지 크기를 조정하는 역사에 대한 일반 소개는 다음의 Unfiltered 블로그 글에서 확인할 수 있습니다: this Unfiltered blog post.

이미지 크기 조정의 이유

버전 13.6부터 GitLab은 페이지 데이터 크기를 줄이기 위해 이미지 크기를 요구에 맞추어 줄입니다. 이는 “와이어 상의” 데이터 양을 줄이는 것 뿐만 아니라, 브라우저가 처리해야 하는 작업을 줄여 렌더링 성능에 도움이 됩니다.

언제 이미지를 조정하나요?

일반적으로 이미지 크기 조정기는 클라이언트가 쿼리 문자열에 width 매개변수를 추가하여 이미지 리소스를 요청할 때 활성화됩니다. 그러나 우리는 특정 종류와 형식의 이미지만 크기를 조정합니다. 이미지 크기를 다시 조정할 것인지 여부는 하드코딩된 규칙과 구성 설정의 조합에 의해 결정됩니다.

하드코딩된 규칙은 다음만 허용합니다:

또한, Workhorse의 구성은 다음과 같은 경우 이미지 크기 조정기가 요청을 거부하도록 할 수 있습니다:

예를 들어, GitLab 프로젝트 아바타를 원본 크기와 64픽셀로 축소된 크기로 제공하는 두 가지 다른 URL은 다음과 같습니다. 두 번째 요청만 이미지 크기 조정기를 활성화시킵니다:

이미지 크기를 어디에서 조정하나요?

현재 Rails와 Workhorse가 이미지 크기를 조정하기 위해 협력하고 있습니다. 이는 GitLab에서 중요한 비즈니스 로직인 요청 인증 및 유효성 검사가 Rails에서 발생하고, “중량 들기”인 크기 조정 및 이진 데이터 서비스가 Workhorse에서 발생하는 일반적인 구현 및 성능 패턴입니다.

전체적인 요청 흐름은 다음과 같습니다:

sequenceDiagram Client->>+Workhorse: GET /uploads/-/system/project/avatar/278964/logo-extra-whitespace.png?width=64 Workhorse->>+Rails: 요청 전달 Rails->>+Rails: 요청 유효성 검사 Rails->>+Rails: 이미지 위치 확인 Rails-->>-Workhorse: Gitlab-Workhorse-Send-Data: 크기 조정된 이미지 전송 Workhorse->>+Workhorse: 이미지 크기 조정 호출 Workhorse-->>-Client: 200 OK

Rails

현재 이미지 크기 조정은 Upload 엔터티에만 제한되며, 위에서 언급한 아바타에만 해당됩니다. 따라서 Rails에서의 모든 이미지 크기 조정 관련 로직은 현재 send_file_upload 컨트롤러 mixin에서 찾을 수 있습니다. 클라이언트를 통해 Workhorse를 통해 받은 요청을 처리할 때, 우리는 위에서 언급한 기준에 따라 이미지 크기 조정기를 활성화해야 하는지 확인하고, 그렇다면, Workhorse가 크기 조정 요청을 처리할 수 있도록 필요한 매개변수와 함께 특별한 응답 헤더 필드 (Gitlab-Workhorse-Send-Data)를 렌더링합니다. Rails가 요청을 유효한 이미지 크기 조정 요청으로 판단하지 않는다면, 우리는 보통의 업로드를 제공하는 경로를 따릅니다.

Workhorse

Rails가 요청을 유효하다고 판단한다면, Workhorse가 관여합니다. Rails 응답을 통해 send-scaled-image 명령을 받으면, 이미지 크기를 조정하는 방법을 알고 있는 특별한 응답 삽입기가 호출됩니다. 이 삽입기는 이미지 위치(블록 저장소에 이미지가 있는 경우 경로 또는 원격 저장소의 URL)와 원하는 너비만 필요로 합니다. Workhorse는 이미지의 위치를 투명하게 처리하여 Rails가 이미지가 실제로 있는 위치에 대해 걱정할 필요가 없습니다.

또한, Rails에서의 요청 유효성 검사를 위해 Workhorse는 실제로 이미지 크기를 조정할 수 있는지 확인하기 위해 몇 가지 사전 조건 검사를 실행합니다. 예를 들어, 스케일러 프로세스 예산을 넘어서지 않을 것이고 메모리 소비를 조절하기 위해 구성된 최대 허용 크기 제한을 충족시킬 것을 확인합니다.

실제로 이미지 크기를 조정하기 위해 Workhorse는 최종적으로 실제 크기 조정 작업을 수행하는 자식 프로세스로 분기하고 결과를 클라이언트에게 다시 스트리밍합니다.

이미지의 캐싱된 크기 조정

현재 우리는 크기가 조정된 이미지를 어디에도 저장하지 않습니다. 작은 버전이 요청될 때마다 스케일러가 실행됩니다. 그러나 Workhorse는 클라이언트 캐시에 이미지가 최신 상태인 경우 스케일러를 건너뛴다는 표준 조건부 HTTP 요청 전략을 구현합니다. 이를 위해 원본 이미지 파일의 UTC 타임스탬프를 포함하는 Last-Modified 헤더 필드를 전송하고, 클라이언트 요청의 If-Modified-Since 헤더 필드와 대조합니다. 원본 이미지가 변경되고 크기 조정이 필요한 경우에만 스케일러를 다시 실행합니다.