시작하기 전에...

- 작년 7월에 공식 블로그를 통해 속도 향상 방법을 공개했었다. (2025/7)

- 커뮤니티에 퍼진 속도 향상 수치 15% 는 Motionmark 벤치마크에서 M3 기준 15% 향상이다.

 

적용은 간단하다.

크롬브라우저 주소 창에 chrome://flags 를 입력하고, Skia Graphite를 Enable로 바꿔주면 된다.

SKia Graphite

 

*아래는 해당 기술을 공개한 블로그 글의 일부를 번역한 것이다.

 

1. 크롬에서는 Skia를 사용하여 Blink와 브라우저 UI의 페인트 명령을 화면의 픽셀로 렌더링하는데, 이 과정을 래스터화(rasterization)라고 한다.

  • Skia는 크롬 그래픽 개발 초기부터 (2008/10) 핵심적인 역할을 해왔다.
  • 하지만 웹이 발전하고 복잡해짐에 따라 Skia는 성능 문제에 직면하게 되었고, 이에 크롬과 Skia는 Ganesh라는 GPU 가속 래스터화 백엔드에 투자했었다.

2. 수년에 걸쳐 Ganesh는 견고하고 고성능의 래스터화 백엔드로 발전했으며, 모든 플랫폼의 Chrome에서 GL 기반(Windows D3D9/11에서는 ANGLE 사용)으로 GPU 래스터화를 구현할 수 있었다.

  • 그러나 Ganesh는 항상 GL 중심적인 설계로 인해 너무 많은 특수 코드 경로가 존재했고, 최신 그래픽 API를 활용하는 최적화를 원칙에 따라 구현하는 데 어려움을 겪었다.

3. 이를 계기로 새로운 래스터화 백엔드인 Graphite를 개발하여 GPU 래스터화 방식을 근본적으로 재구상한다.

  • Graphite는 처음부터 코드 경로를 최소화하고 이해하기 쉽게 만드는 것을 원칙으로 개발했다.
  • 이러한 원칙 덕분에 Metal, Vulkan, D3D12와 같은 최신 그래픽 API와 컴퓨팅 기반 경로 래스터화와 같은 패러다임을 활용할 수 있으며, 기본적으로 멀티스레딩을 지원한다.

4. Chrome에 Graphite를 적용한 결과, MacBook Pro M3에서 Motionmark 1.3 점수가 거의 15% 향상되었다.

https://blog.chromium.org/2025/07/introducing-skia-graphite-chromes.html

  • 동시에 INP(상호작용 후 다음 화면 표시 시간), LCP(최대 콘텐츠 표시 시간), 그래픽 부드러움(프레임 드롭률), GPU 프로세스 malloc 메모리 사용량 등과 같은 실제 사용 환경 지표도 개선되었다.
  • 이는 전반적으로 훨씬 부드러운 상호 작용, 스크롤 시 끊김 현상 감소, 웹사이트 로딩 시간 단축으로 이어진다.

 

적용이 되고 있는지 확인하려면, chrome://gpu 를 검색하고 Skia Graphite가 Enabled로 나오는지 체크한다.

 

+ Recent posts