웹 성능 컨설턴트: Salesforce Commerce Cloud
Salesforce Commerce Cloud 스토어의 성능을 최적화합니다
Salesforce Commerce Cloud(SFCC)는 premium 국제 brand를 motorize합니다. Custom cartridge를 통한 유연성은 또한 기술 부채의 주요 source입니다. 안정적인 Core Web Vitals를 위해 cartridge, ISML cache, OCAPI 및 SFRA frontend에 작업합니다.
고객들이 신뢰합니다
감사를 부르는 SFCC 신호
잘못 frame된 SFCC 스토어는 사용자 측과 Business Manager 측에서 관찰 가능한 신호를 보여줍니다.
🐢 PDP와 checkout에서 드리프트하는 TTFB
잘못 최적화된 custom cartridge, uncalibrated된 ISML cache, blocking synchronous OCAPI 호출. 감사 없이 PDP TTFB는 피크에서 쉽게 1초를 초과합니다.
🧩 문서화 없이 쌓인 custom cartridge
이전 에이전시에서 상속된 일부 active cartridge 10~30개, 때로는 undocumented. Dead code, 더 이상 서비스하지 않는 hook, 유지되지 않은 dependency.
📦 SFRA JavaScript 번들이 1 MB 이상
Native SFRA가 jQuery, Bootstrap, theme-specific code를 embed합니다. Custom cartridge가 자체 asset을 추가합니다. Main thread가 포화되고, mobile INP가 드리프트합니다.
🖼️ next-gen 형식 또는 fetchpriority 없는 제품 이미지
SFCC DynamicImageService는 기본적으로 WebP/AVIF를 생성하지 않습니다. 명시적 구성 + PDP LCP 이미지에 fetchpriority가 300~500ms를 얻습니다.
🌐 Rendering을 차단하는 Synchronous OCAPI 호출
ISML rendering에서 synchronous하게 OCAPI 또는 SCAPI를 호출하는 custom helper는 서버를 차단합니다. Async 호출 또는 가능한 호출의 short-term OCAPI cache가 상황을 자유롭게 합니다.
🛒 긴 checkout과 빨간 mobile INP
Multi-step, AJAX tax/shipping 계산, 무거운 JS validation. Chrome DevTools profiling이 Long Tasks를 식별하고, refactoring이 최적화를 타게팅합니다.
SFCC 최적화 방법론
4 성과를 변환하는 단계
1. Cartridge + Business Manager 감사
Active cartridge inventory, PDP/PLP/checkout에 대한 영향 측정. Page cache, fragment cache, varyby 구성 감사.
2. ISML 및 cache 최적화
무거운 ISML 템플릿 refactor, cache fragment calibrate, 쓸모없는 include 제거. HTML compression 활성화.
3. OCAPI/SCAPI 및 external service
Controller와 템플릿에서 OCAPI/SCAPI 호출 감사. 가능한 호출에 대해 async 또는 short-term cache로 이동.
4. SFRA frontend 또는 Composable 마이그레이션
In-place SFRA 최적화(defer 스크립트, JS refactor, image prioritization) 또는 PWA Kit / Composable Storefront로의 마이그레이션 평가.
1. Cartridge + Business Manager 감사
Active cartridge inventory, PDP/PLP/checkout에 대한 영향 측정. Page cache, fragment cache, varyby 구성 감사.
2. ISML 및 cache 최적화
무거운 ISML 템플릿 refactor, cache fragment calibrate, 쓸모없는 include 제거. HTML compression 활성화.
3. OCAPI/SCAPI 및 external service
Controller와 템플릿에서 OCAPI/SCAPI 호출 감사. 가능한 호출에 대해 async 또는 short-term cache로 이동.
4. SFRA frontend 또는 Composable 마이그레이션
In-place SFRA 최적화(defer 스크립트, JS refactor, image prioritization) 또는 PWA Kit / Composable Storefront로의 마이그레이션 평가.
미션 약속
Frequently asked questions
SFCC가 녹색 Core Web Vitals에 도달할 수 있나?
Composable Storefront(PWA Kit)로 마이그레이션해야 하나?
새 통합을 위한 OCAPI 또는 SCAPI?
SFCC engagement는 어떻게 구조화됩니까?
Salesforce Commerce Cloud를 최적화하세요
2023-2026 데이터
고객 후기
훌륭한 작업입니다.
Paul은 사이트 속도를 눈에 띄게 개선했고 Google 권장사항에 완벽히 맞춰 주었습니다.
전문적이고 꼼꼼하며 효율적이라 강력히 추천합니다.
Nicolas - April Moto
디지털 & 이커머스 디렉터
저희는 Paul의 업무에 매우 만족하고 있습니다. 그는 신속하고, 언제든지 응대 가능하며, 특히 효율적입니다. 그가 합류한 이후 성과와 대응력 측면 모두에서 매우 좋은 결과가 확인되었습니다. 저희 팀의 진정한 자산입니다.
Léo - Maison de luxe
이커머스 프로덕트 오너
우리가 이 말을 충분히 했는지는 모르겠지만.
하지만 로딩 속도를 개선하고,
Google을 만족시키고 Core Web Vitals를 초록 영역으로 만들고 싶다면,
Paul Delcloy에게 연락하세요.
Florian Darroman - Les Makers
공동 창업자
SFCC, premium 플랫폼과 cartridge 부채
Salesforce Commerce Cloud(이전 Demandware)는 premium 국제 e-commerce의 상당 부분(luxury, beauty, fashion, enterprise retail)을 motorize합니다. 그 commercial 모델(revenue share)은 성능과 안정성을 요구하지만, custom cartridge를 통한 extensibility는 빠르게 massive한 기술 부채에 대한 문을 엽니다.
SFCC의 e-commerce 웹 성능 최적화 angle은 particular합니다: direct 서버 접근 없음(Salesforce-managed 플랫폼), 모든 것이 cartridge, Business Manager, OCAPI 또는 SCAPI를 통해 진행됩니다. Lever는 custom cartridge 감사, ISML 최적화, page 및 fragment cache calibration, frontend 현대화(SFRA 또는 Composable Storefront)에 집중됩니다.
Custom cartridge, 첫 work-stream
일반적인 SFCC 사이트는 수년에 걸쳐 10~30개의 custom cartridge를 누적합니다. 각 cartridge는 controller, ISML 템플릿, hook, 때로는 frontend JavaScript dependency를 추가합니다. 정기적인 감사 없이 dead code, 더 이상 서비스하지 않는 hook, 유지되지 않은 dependency를 누적합니다.
Cartridge 감사는 critical 페이지(PDP, PLP, checkout)에서 각 cartridge의 소비를 측정하고, 비용 큰 패턴(무거운 custom helper, synchronous OCAPI 호출, blocking external service)을 식별하고, rebuild 또는 제거를 결정합니다.
ISML cache와 SFRA frontend
ISML(Internet Store Markup Language)은 SFCC 템플릿 엔진입니다. 그 cache(page cache 및 fragment cache)는 강력하지만 strict 모델링 디스크립닌을 요구합니다: coherent한 cache key, 적절히 사용된 varyby, 타게팅된 exclusion. Disciplined page cache 없는 SFCC 사이트는 피크에서 1~2초 TTFB를 서비스할 수 있습니다. 잘 구성되면 동일한 사이트가 300ms 미만으로 떨어집니다.
Frontend에서 SFRA(Storefront Reference Architecture)는 기본적으로 무겁게 머뭅니다(jQuery, Bootstrap, custom cartridge에 specific한 code). Composable Storefront(PWA Kit, React 기반)로 이동이 Salesforce 측의 미래입니다. 여전히 SFRA에 있는 사이트의 경우 in-place 최적화(defer 스크립트, JS refactor, image prioritization)가 수익성으로 남아 있습니다.
기타 전문 분야 기술
Angular
Angular 최적화: lazy modules, OnPush change detection, SSR Universal 또는 Analog, signals, zone.js 제거. Enterprise SPA에서 안정적인 Core Web Vitals.
더 알아보기
Astro
Astro 최적화: island 아키텍처, image 최적화, view transition, content collection. 녹색 Core Web Vitals를 가진 거의 정적 사이트.
더 알아보기
Drupal
Drupal 최적화: Render API 및 cache contexts, Dynamic Page Cache + BigPipe, Views 성능, MySQL tuning. 전략적 템플릿에서 녹색 Core Web Vitals.
더 알아보기