웹 성능 게이트 키퍼: 웹 성능 모니터링 서비스, '파루스' 의 기술과 활용 / if(kakaoAI)2024
if kakao 카카오 · YouTube
AI 핵심 요약
카카오의 여러 웹·웹뷰 서비스에서 성능을 지속적으로 비교하고 개선할 수 있도록, Lighthouse 기반 신택틱 모니터링 서비스 파루스를 개발했다. 페이지별 설정과 주기·즉시 측정, 리포트와 추이 그래프를 제공하고, 측정 요청은 메시지 큐와 쿠버네티스 러너로 처리하도록 구성했다. 측정 안정성과 신뢰성을 높이기 위해 브라우저 환경을 관리하고 측정 로직을 자식 프로세스로 격리했으며, 반복 측정값에서 대표 점수를 골랐다. 개발 단계에는 프록시를 이용해 로컬 페이지도 측정할 수 있게 했고, 발표에서는 파루스가 성능 개선 활동과 조직 내 성능 인식에 기여한 사례를 공유했다.
- 주기 측정은 전체 페이지의 성능 추이를 쌓고, 즉시 측정은 배포 직후 확인에 활용한다.
- 측정 환경을 일정하게 유지하려면 브라우저와 버전을 고정하고 CPU·네트워크 스로틀링 조건을 명시한다.
- 측정 로직을 Node.js 자식 프로세스로 분리하면 Lighthouse 오류를 격리하고 부모 프로세스의 흐름을 유지할 수 있다.
- 반복 측정 결과는 FCP·TTI를 기준으로 유클리디언 거리를 계산해 대표값을 선택한다.
- 개발 중 로컬 페이지는 프록시 도메인을 통해 러너가 접근하게 하여 운영 측정과 같은 환경에서 확인할 수 있다.
소개
좋은 품질의 웹서비스를 제공하기 위해서는 웹서비스의 성능을 지속적으로 모니터링하고 개선하는 것이 중요합니다. 카카오 FE플랫폼에서는 웹 성능 모니터링 서비스, 파루스(Pharus) 를 개발하고 있습니다. 파루스는 100개가 넘는 서비스에서 1000여 개 이상의 페이지 성능을 일관된 기준으로 모니터링(가시화)하고 분석 리포트를 제공하여 개선 전략을 세우는 데 도움을 주고 있습니다. 이번 발표에서는 파루스의 주요 기능과 기술을 소개하고 서비스의 활용 사례를 공유하고자 합니다. 파루스의 주요 기능과 기술을 소개하고 서비스의 활용 사례를 소개합니다. #FE #웹 성능 측정 #lighthouse 카카오 FE플랫폼팀에서 파루스 서비스를 담당하고 있는 Ted입니다. 카카오 FE플랫폼팀에서 파루스 서비스를 담당하고 있는 Dino입니다. 발표자료 보기 👉 https://speakerdeck.com/kakao/ifkakao24-37 if(kakaoAI)2024에 대한 자세한 정보는 👉...
비슷한 학습 자료
컨퍼런스 if kakao
카카오워크 메시징 엔진의 Rust 교체 개발 사례 from C / if(kakaoAI)2024
컨퍼런스 if kakao
기존에 C++로 개발된 카카오워크의 대량 트래픽 메시징 엔진을 Rust 기반으로 리팩토링 및 고도화한 사례를 다룹니다. Rust의 장점을 활용하여 메모리 안전성을 확보하고 성능을 개선했던 방법을 공유하며, 기 제공중인 서비스와의 안정적인 교체 사례도 함께 소개합니다. #RUST #메신저 KakaoWork 메시징 서버 개발하고 있는 Robby입니다. 발표자료 보기 👉 https://speakerdeck.com/kakao/ifkakao24-68 if(kakaoAI)2024에 대한 자세한 정보는 👉 https://if.kakao.com #카카오 #이프카카오 #개발자컨퍼런스 #AI #기술 #개발 #ifkakaoAI2024
백엔드 프로그래밍 언어
컨퍼런스 if kakao
관심과 우선순위를 받기 어려운 처지에 놓인 UX 관련 과제를 시작시키기부터 성공적으로 적용하는 데까지 직면했던 여러 문제들과 이를 극복해오면서 배운 경험을 공유하고자 합니다. #FE #UX #일하는 방식 카카오 FE플랫폼팀에서 티스토리 서비스를 담당하고 있는 Jordan입니다. 카카오 FE플랫폼팀에서 카페 서비스를 담당하고 있는 Leah입니다. 발표자료 보기 👉 https://speakerdeck.com/kakao/ifkakao24-36 if(kakaoAI)2024에 대한 자세한 정보는 👉 https://if.kakao.com #카카오 #이프카카오 #개발자컨퍼런스 #AI #기술 #개발 #ifkakaoAI2024
UI/UX
컨퍼런스 if kakao
선물하기 프론트엔드 성능 개선기 / if(kakaoAI)2024
컨퍼런스 if kakao
선물하기 프론트엔드 성능을 개선하면서 고민 했던 것들 그리고 적용한 기술들에 대해 공유하고자 합니다. #front-end #angular #웹 성능 선물하기 서비스에서 프론트엔드 개발을 하고 있는 Fleek입니다. 유저에게 더 나은 서비스 경험을 선사하기 위해 늘 노력합니다. 발표자료 보기 👉 https://speakerdeck.com/kakao/ifkakao24-35 if(kakaoAI)2024에 대한 자세한 정보는 👉 https://if.kakao.com #카카오 #이프카카오 #개발자컨퍼런스 #AI #기술 #개발 #ifkakaoAI2024
웹 개발 프론트엔드
컨퍼런스 if kakao
수 천만 건 이상의 대량 배치처리를 하기 위한 최고의 노하우를 전달드리겠습니다. 카카오페이 정산플랫폼팀은 카카오페이의 빠른 성장과 더불어 늘어나는 데이터를 일괄처리하기 위하여 꾸준히 노력 하고 있습니다. 더 많은 데이터를 처리하기 위해 진화하는 서비스와 개발방식을 소개하고자 합니다. #BatchPerformance #SpringBatch #SpringCloudDataFlow #Kubernetes #Redis 카카오페이 정산플랫폼팀 베니입니다. 서버 Performance 개선에 관심이 많습니다. 발표자료 보기 👉https://speakerdeck.com/kakao/ifkakao22-065 if(kakao)2022에 대한 자세한 정보는 👉 https://if.kakao.com if(kakao)2022에 대한 문의는 👉 if@kakaocorp.com #카카오 #이프카카오 #개발자컨퍼런스 #기술 #개발 #ifkakao2022
백엔드 데이터베이스 데브옵스 · 인프라
컨퍼런스 if kakao
웹 성능은 주로 로드 성능에 집중되었지만 웹의 역할이 커지면서 사용자 상호작용에 대한 성능도 중요해졌습니다. 웹이 로드 된 이후 사용자와 상호작용에 관련된 성능을 측정하고 개선하는 방법을 알아봅니다. #성능 #Responsiveness #Lighthouse #UserFlow #웹성능 카카오 FE플랫폼팀에서 FE개발자를 위한 개발을 하는 에단입니다. 발표자료 보기 👉https://speakerdeck.com/kakao/ifkakao22-75 if(kakao)2022에 대한 자세한 정보는 👉 https://if.kakao.com if(kakao)2022에 대한 문의는 👉 if@kakaocorp.com #카카오 #이프카카오 #개발자컨퍼런스 #기술 #개발 #ifkakao2022
프론트엔드
컨퍼런스 if kakao
Preview Frontend @if(kakao)2022
컨퍼런스 if kakao
if(kakao)2022 컨퍼런스에서 Frontend 관련 기술 발표 트랙을 소개합니다. 01:28 1. MFA, 누구냐 너: 공통 플랫폼개발 파트의 MFA도입기 by 어호선(sun.kist) 카카오 공통플랫폼개발파트에서 프론트앤드 개발을 담당하고 있는 썬입니다. 01:58 2. 마이크로프론트엔드. 실무에 쓸만할까? by 김수찬(tony.chan) 카카오워크의 관리자 서비스를 개발하고 있습니다. 02:17 3. 웹 반응성 개선하기: Lighthouse Userflow를 사용한 웹 반응성 개선기 by 박은우(ethan.eunwu) 카카오 FE플랫폼팀에서 FE개발자를 위한 개발을 하는 에단입니다. 02:35 4. 카카오페이 프론트엔드 개발팀의 Client Side Rendering 환경 고도화 by 박병현(eric.dev) 카카오페이 FE인프라TF TF장 에릭입니다. 카카오페이 FE 서비스의 근간을 이루는 다양한 환경에 대한 고민을 하고 있습니다. 02:56 5. 광고 웹 ...
프론트엔드