블로그

Volterra 앱 전송 네트워크(ADN)로 웹 앱의 거리를 줄이세요

프라나브 다르와드카 썸네일
프라나브 다르와드카르
2020년 7월 30일 게시

이 블로그는 기업이 직면한 실제 문제 사례에 대한 새로운 블로그 시리즈의 시작이며 Volterra의 앱 전송 네트워크(ADN)가 설명된 문제를 어떻게 해결하는지 설명합니다. 이 블로그에서는 전 세계 온라인 기업이 매일 직면하는 웹 애플리케이션 성능의 주요 과제에 대해 자세히 설명합니다. 대부분의 소비자가 재택근무를 하면서 이러한 문제는 더욱 심각해졌습니다. Volterra가 기업이 웹앱의 "거리를 없애" 애플리케이션을 다시 작성하지 않고도 애플리케이션 성능을 77% 개선하는 데 어떻게 도움을 줄 수 있는지 설명합니다.

웹 앱 성능이란?

웹 앱 성능은 일반적으로 최종 사용자가 인식하는 대로 페이지의 콘텐츠가 표시되는 데 걸리는 시간에 따라 측정됩니다. 웹 개발자는 First Contentful Paint, Largest Contentful Paint, Document Complete 등 여러 가지 지표를 사용하여 웹 앱 성과를 측정합니다. 이 블로그에서 저는 "문서 완료" 메트릭을 웹앱 성능의 척도로 사용했습니다. 웹 개발자는 Web Page Test, Google Lighthouse 또는 Rigor와 같은 도구를 사용하여 이러한 메트릭을 측정합니다.

웹 앱 성능이 중요한 이유는 무엇입니까?

웹 앱 성능이 약간만 저하되어도 사용자 경험에 큰 영향을 미치며, 결과적으로 온라인 포털을 통한 매출에도 영향을 미칩니다. 전자상거래 거대 기업 Amazon은 애플리케이션 성능이 1초만 저하되어도 16억 달러의 매출 손실이 발생한다고 보고했습니다. Akamai가 조금 더 오래된 보고서에서 보고한 것처럼, 다양한 수직 산업의 온라인 기업에서도 비슷한 경제적 영향이 관찰되었습니다. Google 과 Microsoft는 비슷한 경제적 영향 수치를 보고했습니다.

에이비엔1
그림 1

이러한 데이터는 웹 애플리케이션 성능이 온라인 기업에 가장 중요한 요소라는 점을 분명히 확인합니다.

무엇이 과제인가요?

전자상거래 분야의 온라인 기업의 구체적인 예를 들어보겠습니다. 많은 전자상거래 기업들은 하나 또는 몇 개의 데이터 센터에 웹 애플리케이션을 보유하고 있으며, 이러한 데이터 센터는 전자상거래 기업 사용자가 거주하는 모든 국가에 존재하지 않습니다. 사용자가 데이터 센터와 다른 국가/지역에 있는 경우, 사용자와 데이터 센터 간 네트워크 지연 시간이 길어져 페이지 로드 시간이 약 6~12초까지 느려집니다. 위에서 언급했듯이 페이지 로드 시간이 5초를 초과하면 이탈 확률이 90%로 증가합니다.

그림 2에 표시된 대로 웹 앱 페이지 로드를 분해해 보겠습니다.

애드엔2
그림 2
  • 먼저, 사용자 브라우저와 웹 앱 사이에서 6개의 메시지를 주고받는 보안 SSL 세션이 설정됩니다.
  • 다음으로, 웹 앱은 일반적으로 사용자 브라우저의 쿠키를 사용하여 사용자가 전자상거래 공급업체에 계정을 가지고 있는지 확인합니다.
  • 쿠키를 기준으로, 사용자에게 계정이 있으면 로그인 페이지가 표시되고, 계정이 없으면 게스트로 체크아웃 페이지가 표시됩니다.

높은 지연 링크(잠재적으로 대서양/태평양 링크)를 통해 전송될 때 보안 SSL 세션을 설정하기 위한 6개의 메시지는 확실히 페이지 로드 시간에 영향을 미치고 결과적으로 사용자 경험이 저하됩니다.

Volterra ADN은 앱 성능을 어떻게 개선할 수 있나요?

이미지를 압축하거나 종속성을 최적화하여 페이지 로드 시간을 줄이는 등 애플리케이션을 최적화하여 웹 앱 성능을 개선하는 다양한 기술이 있습니다. 많은 경우, 이러한 최적화는 애플리케이션 설계를 주도하는 비즈니스 요구 사항으로 인해 불가능할 수 있습니다. 이러한 최적화가 가능하더라도 앱을 작성한 개발자가 더 이상 조직에 없거나 새로운 서비스를 개발하는 데 바쁘지 않으면 실행 가능한 옵션이 아닐 수 있습니다. 따라서 전자상거래 조직의 DevOps 팀은 애플리케이션 성능을 개선할 수 있지만 애플리케이션을 변경할 필요가 없는 솔루션을 중요하게 생각합니다.

Volterra는 VoltMesh와 VoltStack이라는 두 가지 제품을 제공하며, 이를 Volterra의 ADN과 결합하면 애플리케이션 성능을 최대 75%까지 개선할 수 있습니다(다음 섹션의 데모 참조). Volterra의 VoltMesh 제품은 전 세계적으로 분산된 네트워킹 및 보안 제품으로 Volterra의 ADN에 구성하면 애플리케이션 가속 기능도 제공합니다. Volterra의 VoltStack 제품은 분산 애플리케이션 배포 및 수명 주기 관리를 제공하여 사용자가 애플리케이션의 일부를 Volterra의 ADN으로 오프로드하여 애플리케이션 성능을 더욱 향상시킬 수 있도록 합니다.

VoltMesh와 VoltStack은 다음 세 가지 방법으로 전자상거래 기업의 웹 애플리케이션 성능을 해결합니다.

해결책 1: SSL 종료(일명. Volterra ADN의 TLS 오프로드

웹 앱 성능을 개선하는 가장 간단한 솔루션은 Volterra의 글로벌 ADN에서 SSL 세션 종료를 수행하는 것입니다. SSL 세션을 설정하는 6개 메시지 세트는 국내 글로벌 네트워크 가장자리로 로컬로 전송되며 대서양이나 태평양 링크를 통과하지 않습니다. 원격 Volterra 글로벌 네트워크 사이트와 원본 서버 사이에 지속적인 SSL 세션이 구축되어 성능이 더욱 향상됩니다. 이는 그림 3과 같이 시각화할 수 있습니다.

애드앤3
그림 3

해결책 2: 쿠키 처리와 같은 지연에 민감한 처리를 Volterra ADN으로 이동합니다.

성능을 더욱 향상시키기 위해 기업은 앱의 지연에 민감한 부분을 ADN에 배포할 수 있습니다. 웹 앱의 지연에 민감한 부분의 예로는 쿠키 처리나 graphQL 또는 백엔드 대 프런트엔드가 있습니다. 전자상거래 기업의 경우, 일반적으로 쿠키를 처리하여 사용자에게 어떤 페이지를 표시할지 결정합니다. 예를 들어, 사용자에게 계정이 있으면 로그인 페이지를 표시하고, 계정이 없으면 게스트 페이지를 표시합니다. ADN에서 쿠키를 처리하면 지구 반대편의 중앙 집중형 DC나 클라우드에서 쿠키를 처리하는 것보다 성능이 획기적으로 향상됩니다. 이는 그림 4와 같이 시각화할 수 있습니다.

애드엔4
그림 4

해결책 3: 웹 앱의 프런트엔드(예: 제품 카탈로그) 자체를 엣지(즉, 물리적 매장)로 이동합니다.

Macy’s, Home Depot, Target과 같은 많은 상거래 공급업체는 소비자가 실제 매장 내에서 온라인 제품 카탈로그를 탐색하여 품목 위치를 확인하고 거래/쿠폰에 액세스할 수 있는 실제 매장도 보유하고 있습니다. 사용자 경험을 개선하기 위해 웹 앱의 프런트엔드만 매장 내 컴퓨팅으로 옮기는 것을 선택할 수 있습니다. 앱의 나머지 구성 요소(예: 데이터베이스)는 프런트엔드 제품 카탈로그만큼 자주 액세스되지 않으므로 백엔드 데이터 센터에 그대로 둘 수 있습니다. 이는 그림 5와 같이 시각화할 수 있습니다.

아디엔5
그림 5

모든 솔루션에서 고려해야 할 핵심 아키텍처 원칙

이 문제는 근본적으로 여러 이기종 클라우드에 걸친 분산 컴퓨팅 문제입니다. DevOps 팀은 퍼블릭 클라우드 공급업체, CDN 공급업체, 엣지 공급업체 등 다양한 공급업체의 단편적인 솔루션을 조합하여 직접 구현하는 방식을 선택할 수도 있고, 분산 클라우드 서비스 플랫폼 공급업체로부터 패키지 솔루션을 구매할 수도 있습니다. 그림 6에서는 과제가 강조되어 있습니다.

아디엔6
그림 6

DevOps 팀이 솔루션을 평가할 때 고려해야 할 주요 아키텍처 원칙은 다음과 같습니다.

  1. 여러 클라우드에서 일관된 애플리케이션 런타임 환경: DevOps 팀의 애플리케이션은 백엔드 클라우드(개인 데이터 센터 또는 퍼블릭 클라우드)와 엣지 위치 및 물리적 매장 위치 등 다양한 곳에 분산되며, 이 모든 위치는 완전히 다른 애플리케이션 런타임 환경이 될 수 있습니다. DevOps 팀은 모든 분산 클라우드에서 일관된 애플리케이션 런타임 환경을 제공하기 위해 Kubernetes를 활용하는 솔루션을 적극 고려해야 합니다. 쿠버네티스는 클라우드를 동질화하고 애플리케이션의 일부를 클라우드 간에 쉽게 이동할 수 있도록 해줍니다.
  2. 지리적 근접성 트래픽 라우팅: 애플리케이션의 프런트 엔드는 클라우드 대 엣지 대 물리적 매장 엣지 등 다양한 위치에 배포될 수 있으므로 모든 솔루션은 사용자 트래픽이 프런트 엔드 서비스가 배포된 가장 가까운 위치로 전환되도록 보장해야 합니다. 그리고 고려된 모든 솔루션은 DevOps 팀이 인터넷 라우팅 정책을 변경할 것을 요구하지 않아야 합니다.
  3. 글로벌 로드 밸런싱: 고려되는 모든 솔루션은 백엔드 서비스가 전 세계 여러 위치에 있을 수 있으므로 글로벌 로드 밸런싱을 제공해야 합니다.
  4. 여러 클라우드에 걸친 균일한 애플리케이션 및 네트워크 보안 정책: 애플리케이션 구성 요소의 위치는 지역에 따라 다를 수 있지만, 고려되는 모든 솔루션은 프런트엔드 서비스가 배포된 클라우드에 균일한 애플리케이션 및 네트워크 보안 정책을 적용할 수 있는 기능을 제공해야 합니다.
  5. 여러 클라우드와 애플리케이션 및 네트워크 연결 전반에 걸친 단일 창구 관찰: 분산 클라우드 환경에서는 여러 클라우드의 애플리케이션과 연결성 전반에서 발생하는 문제를 해결하는 것이 매우 어렵습니다. 고려되는 모든 솔루션은 여러 클라우드에서 연결성, 보안 및 애플리케이션 배포를 단일 창에서 관찰할 수 있어야 합니다.

Volterra 솔루션이 달성한 결과

테스트 설정

다음에 설명된 테스트 설정은 이전 섹션에 설명된 각 Volterra 솔루션이 제공하는 성능 개선을 보여주는 데 사용되었습니다. 

  • 사용된 웹 앱은 Google의 클라우드 기반 마이크로서비스 데모 애플리케이션인 Online Boutique 입니다. 웹 앱은 그림 7에 표시된 대로 11개의 마이크로서비스로 구성됩니다.
아디엔7
그림 7
  • 웹 앱 성능은 webpagetest.org를 사용하여 측정되었습니다.
  • webpagetest.org에서 웹 앱 성능을 결정하는 데 사용된 메트릭은 "문서 완료"였습니다.
  • 이 기업은 파리에 데이터 센터를 둔 유럽 전자상거래 회사입니다.
  • 사용자(또는 클라이언트)는 항상 샌프란시스코에 위치합니다.

테스트 시나리오 및 결과

다음 네 가지 시나리오를 테스트하였으며, 각 시나리오별 성능 개선 사항을 설명합니다.

기준 시나리오: 먼저, 그림 8에서 볼 수 있듯이 샌프란시스코에 있는 사용자와 파리 데이터 센터에서 전적으로 실행되는 웹 앱의 웹 앱 성능의 기준을 정했습니다. 기준 시나리오에 대한 웹 앱의 성능은 3.5초로 측정되었습니다.

아디엔8
그림 8

솔루션 1 테스트 시나리오: 솔루션 1에 대한 테스트에서 사용자는 여전히 샌프란시스코에 있고, 웹 앱은 여전히 파리 데이터 센터에서 실행 중이지만 SSL 세션은 샌호세의 Volterra ADN에서 실행되는 VoltMesh 역방향 프록시에서 종료됩니다. 이 시나리오는 그림 9에 나와 있습니다.

애드엔9
그림 9

VoltMesh는 산호세 PoP에서 실행되는 역방향 프록시와 파리 데이터 센터에서 실행되는 웹 앱 간에 지속적인 SSL 세션을 자동으로 생성합니다. 웹 앱의 성능은 2.9초로 개선되었으며, 이는 약 18%가 향상된 수치입니다.

솔루션 2 테스트 시나리오: 솔루션 2에 대한 테스트에서 프런트엔드와 통화 마이크로서비스는 샌호세의 ADN에 배포되었습니다. 나머지 마이크로서비스와 데이터베이스는 여전히 파리 데이터 센터에서 실행됩니다. 이 시나리오는 그림 10에 나와 있습니다.

아디엔10
그림 10

프런트엔드와 통화 마이크로서비스만 이동하는 이유는 이러한 마이크로서비스가 사용자의 일상적인 브라우징 활동 중에만 관련되기 때문입니다. 웹 앱의 성능은 솔루션 1의 결과보다 31% 향상된 2초로 개선되었습니다.

솔루션 3 테스트 시나리오: 솔루션 3에 대한 테스트에서 프런트엔드와 통화 마이크로서비스는 물리적 매장 가장자리에 있는 상용 Intel NUC(가상 코어 4개)에 배포되었습니다.

아디엔11
그림 11

프런트엔드와 통화 마이크로서비스만 이동하는 근거는 이러한 마이크로서비스가 사용자가 물리적 매장 가장자리에서 가끔씩 탐색하는 활동에만 관련되기 때문입니다. 웹 앱의 성능은 0.8초로 개선되었으며, 솔루션 2의 결과보다 60% 가 향상되었습니다.

요약 결과 및 경제적 가치

테스트 결과와 그에 따른 경제적 가치의 요약은 그림 12에 나와 있습니다. 경제적 가치는 조직의 개선에 따른 초 단위의 가치를 초 단위로 외삽하여 결정할 수 있습니다. 예를 들어, Amazon에서는 1초의 결과 개선을 16억 달러의 경제적 가치로 평가합니다. 따라서 솔루션 3은 기준선 대비 43억 달러의 경제적 가치를 제공합니다.

 

아디엔12
그림 12

이러한 결과에서 볼 수 있듯이, DevOps 팀은 이 블로그에서 제안한 세 가지 옵션을 사용하여 애플리케이션을 다시 작성하지 않고도 상당한 성능 향상을 달성할 수 있으며, 애플리케이션의 보안 보호 수준은 동일하게 유지할 수 있습니다. 분산 클라우드 플랫폼으로 해결할 수 있는 실제 고객 사용 사례에 대해 자세히 알아보거나, 나와 공유하고 싶은 실제 고객 사용 사례가 있으면 LinkedIn 이나 Twitter를 통해 나에게 연락하세요.