프라이빗 팀 교육

여러분의 코드베이스. 여러분의 데이터. 여러분의 팀.

저는 엔지니어링 팀과 에이전시가 Core Web Vitals 문제를 독립적으로 찾고 해결할 수 있도록 교육합니다. 일반적인 슬라이드나 사전 녹화된 비디오가 아닙니다. 여러분의 실제 프로덕션 사이트에서 실제 성능 데이터를 사용하여 라이브 세션으로 진행됩니다.

팀을 위한 예약트랙 보기

제가 교육하는 팀들.

happyhorizonadevintakpnebaysaturnvpnworkivamonarchperionloopearplugserasmusmcmarktplaatsnina caresnvmy work featured on web.devaleteiacompareharvarddpg mediafotocasawhowhatwearnestle
두 가지 트랙

경로를 선택하세요

두 트랙 모두 동일한 기술적 기반을 공유합니다. 차이점은 교육 후에 팀이 그것을 어떻게 활용하느냐에 있습니다.

제품 회사를 위한 트랙 €4,500

엔지니어링 팀 교육

개발자들은 자체 플랫폼에서 Core Web Vitals를 진단하고 수정하는 방법을 배웁니다. 교육 후에는 팀이 독립적으로 성능을 관리하게 됩니다. 저에 대한 지속적인 의존은 없습니다.

3개 세션, 총 9시간
프로덕션 사이트에서 라이브 디버깅
정액제. 인원 제한 없음.
녹화본 및 자료 포함

팀 교육 예약

디지털 에이전시를 위한 트랙 €4,500

에이전시 교육

팀은 고객을 위해 Core Web Vitals 감사 및 최적화를 제공하는 방법을 배웁니다. 아웃소싱하는 대신 성능을 청구 가능한 서비스로 전환하세요.

3개 세션, 총 9시간
고객 보고 및 감사 범위 지정
고객 모니터링을 위한 CoreDash 설정
성능 관련 작업의 가격 책정 및 판매 방법

에이전시 교육 예약

항상 나오는 질문입니다.

"YouTube 비디오를 봤습니다. web.dev 문서도 읽었습니다. 그런데 왜 우리 점수는 여전히 빨간색일까요?"

일반적인 조언은 여러분의 특정 아키텍처에 적용되지 않기 때문입니다. 여러분의 서드파티 스택, 프레임워크 하이드레이션, 광고 설정, 이미지 파이프라인. 이것들은 여러분에게 고유합니다. 비디오는 프로덕션 사이트에서 Chrome DevTools를 열고 개발자들에게 400ms의 입력 지연이 정확히 어디에서 오는지 보여줄 수 없습니다. 저는 할 수 있습니다.

커리큘럼

모든 세션에서 다루는 내용

핵심 커리큘럼은 두 트랙에서 모두 공유됩니다. 에이전시 교육에는 고객 납품, 보고 및 성능 서비스 판매에 대한 모듈이 추가됩니다.

브라우저 내부 구조

브라우저가 HTML을 파싱하고, DOM을 빌드하고, 스타일을 계산하고, 요소를 배치하고, 픽셀을 그리는 방법. 메트릭을 마스터하려면 기계를 이해해야 합니다. 이것은 다른 모든 것의 기반이 됩니다.

고급 Core Web Vitals

단순한 정의를 넘어섭니다. LCP 하위 파트, INP 단계(입력 지연, 처리, 프레젠테이션 지연), CLS 세션 창. CrUX 데이터를 읽고, 랩 결과와 비교하며, 왜 차이가 나는지 이해하는 방법을 배웁니다. web.dev에 소개된 고객 작업을 포함하여 실제 사이트의 실제 사례를 다룹니다.


성능 프로파일러 마스터하기

Chrome DevTools는 여러분이 가진 가장 강력한 진단 도구입니다. 플레임 차트를 읽고, 긴 작업을 추적하고, LoAF 기여 데이터를 식별하고, 프로파일러에서 보는 것을 현장에서 사용자가 경험하는 것과 연결하는 방법을 배웁니다.

아키텍처 전략

서드파티 거버넌스, 하이드레이션 전략, 리소스 우선순위 지정, CI/CD의 성능 예산. 대규모로 성능을 유지하고 모든 배포 후 성능 저하를 방지하는 방법을 배웁니다.

에이전시 트랙 보너스

에이전시 교육 독점 모듈

고객 보고

기술을 모르는 이해관계자에게 CWV 데이터를 프레젠테이션하는 방법. 메트릭을 고객이 실제로 관심을 가지는 비즈니스 결과로 변환합니다.

범위 지정 및 가격 책정

성능 감사의 범위를 지정하고, 시간을 정확하게 예측하고, 작업 가격을 책정하는 방법. 포함할 항목, 제외할 항목 및 기대치를 설정하는 방법.

고객 모니터링을 위한 CoreDash

각 고객을 위해 RUM(Real User Monitoring)을 설정합니다. Core Web Vitals를 지속적으로 추적합니다. 데이터를 사용하여 새로운 최적화 기회를 식별하고 지속적인 가치를 입증하세요.

형식

9시간. 3개 세션. 여러분의 실제 문제.

각 세션은 3시간입니다. 일반적으로 1~2주에 걸쳐 일정을 잡아 팀이 세션 사이에 자료를 흡수하고 실습해 볼 시간을 가질 수 있도록 합니다.

모든 세션은 동일한 구조를 따릅니다:

2시간: 이론 및 개념

브라우저 내부 구조, 메트릭 메커니즘 및 진단 기술에 대해 깊이 파고듭니다. 단순히 무엇인지가 아니라 왜 그런지를 설명합니다.

1시간: 여러분의 실제 사례

Chrome DevTools에서 여러분의 사이트를 열고 방금 다룬 내용을 적용합니다. 현재 성능 티켓, 실제 성능 저하 문제, 특정 서드파티 문제들을 다룹니다. 우리는 이를 실시간으로 해결합니다.

이것은 교육과 컨설팅이 혼합된 형태입니다. 여러분의 팀은 기술을 배우면서 동시에 사이트의 실제 문제를 해결합니다.

Core Web Vitals 교육을 진행하는 Arjen Karel
Arjen Karel
Arjen Karel
웹 성능 분야 17년 경력. 저는 eBay, Adevinta, KPN 및 DPG Media의
팀을 교육했습니다.

Client Success

Don't just take my word for it

가격

정액제. 인원 제한 없음.

개인이 아닌 팀 단위로 가격을 책정합니다. 프론트엔드 팀 전체를 데려오세요. QA 엔지니어들을 초대하세요. 테크 리드도 참여하게 하세요. 참석하는 사람이 많을수록 성능은 더 빨리 여러분 문화의 일부가 됩니다.

엔지니어링 팀 €4,500

팀을 자급자족할 수 있게 만드세요

9시간 (3 × 3시간 세션)
전체 핵심 커리큘럼
사이트에서 라이브 디버깅
녹화본 및 슬라이드 덱
인원 제한 없음

팀 교육 예약

에이전시 €4,500

성능을 수익으로 전환하세요

팀 교육의 모든 내용 포함
고객 보고 모듈
감사 범위 지정 및 가격 책정
고객 모니터링을 위한 CoreDash 설정
인원 제한 없음

에이전시 교육 예약

모든 가격에는 부가가치세(VAT)가 제외되어 있습니다. 세션은 Google Meet을 통해 온라인으로 제공됩니다. 원하시는 도구(Zoom, Teams)도 사용 가능합니다.

교육 후

여러분의 팀은 성능 문제의 90%를 독립적으로 처리하게 될 것입니다. 다른 관점이 필요한 복잡한 엣지 케이스인 나머지 10%에 대해서는 두 가지 옵션이 있습니다.

시간당 €150의 온콜 세션(On-call sessions). 팀이 특정 문제에 막혔을 때 2시간을 예약하세요. 제가 진단하고, 우리가 수정하며, 여러분의 팀이 배포합니다. 대부분의 팀은 교육 후 분기당 한두 번의 세션을 예약합니다.

€15,000부터 시작하는 풀 컨설팅(Full consultancy). 교육 중 팀이 단독으로 처리할 수 있는 수준 이상의 아키텍처 문제가 발견되면, 저는 2~6주 동안 합류하여 성능 인프라를 함께 재구축합니다.

저의 가장 큰 컨설팅 계약 중 다수는 교육에서 시작되었습니다. 팀은 기초를 배우고, 문제의 실제 범위를 파악한 후 전체적인 브리핑과 함께 다시 찾아왔습니다.

교육

기술을 구축하세요. 여러분의 팀은 자급자족할 수 있게 됩니다.

온콜

시간당 €150. 특정 문제에 대해 전문가의 시선이 필요할 때.

풀 컨설팅

€15,000부터 시작. 여러분의 팀과 함께 플랫폼을 혁신합니다.

팀을 위한 교육 예약

팀, 스택, 그리고 겪고 있는 성능 문제에 대해 알려주세요. 특정 상황에 맞게 커리큘럼을 맞춤화하고 스프린트 주기에 맞는 일정을 제안해 드립니다.

교육 예약

현재 2주 이내로 세션 일정을 잡고 있습니다. 범위에 합의하기 전까지는 어떠한 약정도 없습니다.

교육

자주 묻는 질문

범위, 깊이, 물류, 그리고 팀이 얻어갈 것에 대한 예약 전 일반적인 질문들.

기술적 범위

이 교육은 초보자를 위한 것인가요?

아닙니다. 개발자들은 JavaScript 및 웹 개발에 대한 기본적인 이해가 필요합니다. 기본 사항은 건너뛰고 브라우저 메커니즘, 성능 프로파일링 및 실제 진단 작업으로 바로 들어갑니다. 팀이 DevTools를 여는 방법은 알지만 플레임 차트를 해석하는 방법을 모른다면 이 수준이 적합합니다.

React나 Next.js와 같은 특정 프레임워크에 중점을 두나요?

저는 브라우저에 중점을 둡니다. 렌더링 엔진은 React, Angular, Vue, Next.js, Nuxt, Magento, Shopify 또는 순수 HTML 사용 여부와 관계없이 동일한 규칙을 적용합니다. 그렇긴 하지만 실제 사이트에서 작업하기 때문에 교육은 자연스럽게 성능에 영향을 미치는 프레임워크 특정 패턴을 다루게 됩니다. 하이드레이션 전략이 병목 현상이라면 그것이 우리가 함께 디버깅할 대상입니다.

INP를 심도 있게 다루나요?

네. INP는 대부분의 팀이 어려움을 겪는 부분입니다. 메인 스레드, 이벤트 루프, 입력 지연, 처리 시간 및 프레젠테이션 지연을 해부하는 데 전용 시간을 할애합니다. 개발자들은 긴 작업을 식별하고, LoAF 기여 데이터를 추적하고, 무거운 JavaScript 실행을 분할하여 상호 작용의 응답성을 유지하는 방법을 배웁니다.

서드파티 스크립트 관리를 다루나요?

네. 단순히 마케팅 태그를 삭제할 수는 없습니다. 저는 팀에 로드 전략, 실행 타이밍, 태그 관리자를 위한 yield 패턴, 그리고 각 스크립트의 성능 비용을 정량화하여 무엇을 유지하고 무엇을 제거할지에 대해 정보에 입각한 결정을 내릴 수 있도록 스크립트 거버넌스 방법을 가르칩니다.

형식 및 진행

우리 실제 웹사이트에서 작업하나요?

네. 모든 세션은 프로덕션 또는 스테이징 환경에서의 라이브 디버깅을 위해 1시간을 할애합니다. 팀이 추적해 온 현재 성능 티켓, 성능 저하 문제들을 가져와 방금 다룬 기술을 사용하여 실시간으로 해결합니다. 이것은 교육과 컨설팅이 혼합된 형태입니다. 팀은 기술을 배우면서 동시에 실제 문제를 해결합니다.

몇 명까지 참석할 수 있나요?

인원 제한은 없습니다. 가격은 1인당이 아닌 팀 단위로 책정됩니다. 프론트엔드 팀 전체, QA 엔지니어, 테크 리드를 초대하세요. 참석하는 사람이 많을수록 성능은 워크플로에 더 빨리 내재화됩니다. 20명 이상의 그룹의 경우 세션을 상호 작용할 수 있도록 형식을 약간 조정할 수 있습니다.

일정은 어떻게 되나요?

각 3시간씩 3개의 세션이 진행됩니다. 팀이 자료를 흡수하고 세션 사이에 실험할 수 있도록 일반적으로 1~2주에 걸쳐 일정을 잡습니다. 시간 조정은 유연합니다. 스프린트 주기에 맞는 시간대를 찾습니다.

녹화본을 제공하나요?

네. 모든 세션의 전체 녹화본과 슬라이드 덱을 제공합니다. 팀은 프로파일링 기술과 브라우저 메커니즘을 각자의 속도에 맞춰 복습할 수 있습니다. 참석하지 못한 개발자들도 녹화본을 시청하고 따라갈 수 있습니다.

에이전시 트랙

에이전시 트랙은 무엇이 다른가요?

에이전시 트랙에는 엔지니어링 팀 교육의 모든 내용이 포함되며, 기술을 모르는 고객에게 Core Web Vitals 결과를 프레젠테이션하는 방법, 성능 감사 범위 및 가격을 책정하는 방법, 지속적인 고객 모니터링을 위해 CoreDash를 설정하는 방법이라는 세 가지 추가 모듈이 포함됩니다. 목표는 에이전시가 단순한 기술 지식이 아니라 새로운 청구 가능한 서비스를 가지고 떠나는 것입니다.

교육 중에 실제 고객 사이트를 사용하나요?

네. 팀이 가장 잘 아는 고객 사이트를 선택하세요. 라이브 디버깅 부분에 사용합니다. 교육이 끝날 때쯤이면 팀은 고객 사이트의 실제 성능 문제를 진단하고 제공할 구체적인 최적화 로드맵을 갖게 될 것입니다.

PageSpeed & Core Web Vitals 교육Core Web Vitals PageSpeed & Core Web Vitals 교육