전자상거래 웹사이트 성능을 높이는 5가지 방법
게시 됨: 2020-06-12시장이 성장하고 경쟁이 치열해짐에 따라 전자 상거래 상점 소유자는 군중에서 눈에 띄는 방법을 찾고 고객의 행동에 영향을 주어 구매를 유도합니다. 그러나 판매를 방해하는 주요 요인 중 하나는 느린 웹 사이트 성능 입니다.
Radware 연구 에 따르면 방문자가 페이지가 빨리 로드되지 않으면 웹사이트를 떠나는 데 3초가 걸립니다. 또한 웹 사이트 성능에 만족하지 않는 고객의 79%는 매장에서 다시 구매할 가능성이 없습니다. 무엇보다도 검색 엔진 최적화와 관련 하여 Google은 성능이 느린 웹사이트가 상위 검색 결과에 표시되지 않도록 하기 때문에 속도가 직접적인 순위 요소 입니다.
매 초가 중요한 전자 상거래 세계에서 웹사이트가 느리면 일일 출석률, 전환율, 이탈률, 검색 순위, 페이지 조회수, 그리고 무엇보다도 매출 및 수익과 같은 모든 비즈니스 지표가 영향을 받습니다. 페이지 응답이 1초 지연되어도 전환율 이 7% 감소할 수 있습니다 .
웹 성능이 중요한 것처럼 들리지 않습니까? 이 기사에서는 전자 상거래 상점 소유자가 범하는 일반적인 실수를 식별하고 웹 성능과 속도를 개선하는 방법을 간략하게 설명합니다.
더 빠른 웹사이트 속도 최적화를 위한 주요 성능 문제를 식별하는 방법은 무엇입니까?
성능은 데이터로 완전히 측정됩니다. 메트릭을 측정하는 가장 쉬운 방법은 웹마스터와 매장 소유자가 프로젝트를 모니터링하여 최신 성능 최적화를 제공하도록 설계된 전자 상거래용 분석 도구를 사용하여 테스트하는 것입니다.
다음은 웹사이트 성능을 추적하는 데 사용할 수 있는 몇 가지 도구입니다.
- Google PageSpeed 통계
Google에서 만든 도구는 데스크톱 및 휴대기기의 페이지 속도를 보고할 뿐만 아니라 더 나은 결과를 얻기 위해 페이지를 개선해야 하는 방법에 대한 실행 가능한 권장 사항을 제공합니다. Google PageSpeed Insights의 주요 기능은 현장 및 실험실 데이터를 모두 제공하는 것입니다. 마지막은 중간 계층 장치(Moto G4)의 시뮬레이션된 로드 페이지와 고정된 네트워크 조건 집합을 기반으로 합니다. 랩 데이터는 성능 문제를 디버깅하는 데 사용할 수 있습니다. 필드 데이터의 경우 URL이 어떻게 수행되었는지에 대한 일종의 이력 보고서이며 다양한 장치 및 네트워크 조건에서 실제 사용자의 익명화된 성능 데이터를 기반으로 합니다. 데이터는 진정한 사용자 경험을 결정하는 데 유용합니다. 두 데이터를 종합하고 분석하면 사용자는 웹사이트 성능에 대한 완전한 그림을 얻을 수 있습니다.
- GTMetrix
A에서 F 등급의 결과를 할당하고 사이트의 특정 문제에 대한 많은 세부 정보를 제공하는 사이트 로드 시간을 테스트하는 데 사용되는 사용하기 쉬운 온라인 도구입니다. 트윅을 이해하기 위해 로드하는 데 대부분의 시간이 걸립니다.
- 키 CDN
웹 사이트의 성능에 대한 개요와 자세한 보고서를 얻기 위해 전체 페이지 속도 테스트를 제공하는 것 외에도 도구에는 다양한 기타 유용한 기능이 있습니다. 예를 들어, URL이 HTTP/2 프로토콜을 통해 전달되는지 확인하기 위한 HTTP/2 테스트입니다.
다양한 도구를 사용하여 전자 상거래 상점 성능을 테스트하는 방법을 알았으므로 이제 웹 사이트의 어떤 측면을 조정해야 하고 성능 최적화를 개선하기 위해 어떤 조치를 취해야 하는지 자세히 살펴보겠습니다.
#1 호스팅 솔루션 개선
호스팅 유형, 물리적 서버의 밀도 및 로드는 전자 상거래 매장 성능과 관련하여 일반적인 원인입니다. 호스팅 리소스가 부족하면 사이트 성능이 저하되고 다운타임이 길어지면 잠재 고객과 판매 수익의 손실이 불가피합니다.
호스팅 솔루션의 선택은 매장의 규모(수신하는 아웃바운드 트래픽 양, 하루 주문 및 방문자 수)와 기반 CMS에 따라 다릅니다. 따라서 예를 들어 Magento CMS를 기반으로 하는 대형 또는 중형 매장은 단순한 공유 호스팅과 일치하지 않습니다. 이러한 상점을 호스팅하려면 판매 또는 휴가 시즌 동안 트래픽 급증을 관리할 수 있는 확장 가능한 VPS, 클라우드 또는 전용 호스팅이 최소한 필요합니다.
#2 서버 응답 시간 및 HTTP 요청 수 감소
많은 수의 서버 요청은 잠재 고객이 상점에 얼마나 잘 참여하고 있는지를 결정하는 주요 지표에 부정적인 영향을 미칩니다. 요청이 많을수록 응답 시간이 길어질수록 페이지를 로드하는 데 더 오래 걸립니다. 모든 JS 및 CSS 파일, 모든 스크립트, 스타일시트, 포함된 비디오 또는 이미지는 하나의 추가 HTTP 요청을 의미합니다.
서버 요청을 줄이려면 웹 사이트의 백엔드에서 변경이 필요합니다. 그러나 이러한 변경 사항은 성능을 저하시키는 웹 사이트의 측면을 보여주는 것을 목표로 하는 복잡한 감사에 따라 달라집니다.
서버 요청을 최소화하기 위해 웹마스터는 다음을 수행할 수 있습니다.
- 모든 JavaScript 리소스를 하나로 결합하고 각 페이지에 대해 하나의 스타일시트만 사용합니다 (Apache Ant 또는 pkd.io와 같은 소프트웨어를 사용하여 프로세스를 자동화할 수 있음).
- 불필요한 이미지를 제거하거나 CSS 스프라이트 기술을 사용하여 여러 이미지를 단일 이미지로 결합하여 최적화합니다(이미지를 하나의 파일로 결합할 수 있는 Spritegen, CSS Sprite Tool 등의 도구가 있습니다).
- 데이터베이스를 최적화하십시오. 웹사이트가 정보를 축적하는 한 데이터베이스에 저장된 방대한 양의 데이터는 시스템의 병목 현상입니다. 쿼리가 너무 오래 걸리면 데이터베이스 또는 잘못 구성된 DB 서버가 실제 문제가 될 수 있습니다. 웹 사이트 데이터베이스 최적화 프로세스에는 불필요한 항목 제거, 플랫 카탈로그로 전환하여 DB 쿼리 줄이기, 데이터베이스 버전 업데이트, 큰 테이블에 인덱스 추가 및 기타 정렬이 포함됩니다.
- 나중에 방문하는 동안 파일을 재사용하여 방문자에게 빠르게 전달할 수 있도록 캐싱을 구성 합니다. 예를 들어 오픈 소스 인메모리 데이터 구조 서버인 Redis (PDF)를 설치할 수 있습니다 . 자주 필요한 데이터가 저장되는 분산 서버 캐시나 데이터베이스로 사용할 수 있습니다.
- JavaScript 파일을 비동기식으로 로드하도록 웹사이트를 설정합니다 . 웹사이트 콘텐츠가 동시에 여러 페이지 요소를 렌더링할 수 있습니다.
- 중복되고 긴 변수, 주석, 원치 않는 문자를 제거 하여 코드 크기를 축소하고 압축합니다 .
- 블로트웨어 (가치를 제공하지 않고 공간을 차지하는 프로그램, 플러그인, 애플리케이션)를 제거합니다.
#3 타사 확장 프로그램 사용
기본 기능 외에도 전자 상거래 웹 사이트 성능을 향상시키는 데 사용할 수 있는 확장 기능이 많이 있습니다. 성능 확장을 사용하면 코드의 일부를 조정하고, 브라우저 캐싱을 활용하고, 이미지 크기를 최적화하고, 특정 사용 사례에 맞게 웹사이트를 최적화하고, HTML/JS/CSS를 (다소) 축소하고, 성능과 관련된 가장 명백한 문제를 수정할 수 있습니다.
그러나 확장 기능이 모든 웹 사이트 문제에 대한 마법의 약이 아니라는 점을 고려하고 복잡한 문제를 해결하기를 기대하지 마십시오. 어떤 확장도 경험 많은 개발자와 마찬가지로 코드베이스를 이해할 수 없습니다.
또한 모든 새 확장은 서버에 별도의 HTTP 요청을 추가합니다. 서버가 요청을 처리하는 데 더 많은 시간이 걸리므로 페이지 로드 속도에 영향을 줍니다. 따라서 온라인 상점에 복잡한 코드 구조가 있거나 이미 많은 타사 확장을 로드했거나 CMS가 고도로 사용자 정의된 경우 성능 확장을 사용하는 것은 좋은 생각이 아닙니다. 예를 들어, 성능 최적화가 어려운 Magento 기반 전자 상거래 상점의 경우 타사 확장 프로그램이 해결할 수 있는 것보다 더 많은 문제의 원인이 될 수 있습니다. 여기서 마젠토 성능 최적화 서비스를 제공하는 업체에 최적화 과정을 맡기는 것이 합리적 이다.
#4 Elasticsearch로 전환
Elasticsearch는 데이터 구조를 저장하고 검색하는 오픈 소스 검색 엔진이자 분산 문서 저장소입니다. 2010년에 개발되었으며 전체 텍스트 검색 엔진은 Java로 작성되었습니다. Elasticsearch는 많은 주요 전자 상거래 브랜드에서 대량의 데이터를 즉석에서 저장, 분석 및 검색하는 데 사용하는 주류 도구입니다.
검색이 상점의 주요 기능 중 하나인 한, Elasticsearch는 전자 상거래 상점 소유자에게 인지된 성과와 실제 성과를 모두 높일 수 있는 기회를 제공합니다. 많은 비용을 들이지 않고 빠른 사용자 경험을 제공하기 위한 훌륭한 전략입니다.
Elasticsearch는 WooCommerce, Shopify 또는 Magento에 관계없이 모든 CMS에서 작동하며 사이트 데이터베이스에 과부하가 걸리는 과도한 쿼리로 인해 허용할 수 없을 정도로 느리게 실행되는 온라인 상점에 매우 유용할 수 있습니다. 보너스로 Elasticsearch에는 흥미로운 기능이 있습니다. 기본 검색보다 복잡한 검색 쿼리를 훨씬 더 잘 이해합니다.
#5 미디어 콘텐츠의 더 빠른 로딩을 위한 지연 로딩 사용
전자 상거래 웹 사이트의 일반적인 페이로드에서 비디오, 오디오 및 이미지의 비율은 엄청날 수 있습니다. 그러나 상점 소유자는 웹사이트에서 미디어 콘텐츠를 제거하는 것을 꺼릴 수 있습니다. Lazy Loading(또는 주문형 로딩)은 여기에서 마술을 부릴 수 있습니다. 필요한 순간까지 "중요하지 않은" 또는 "오프스크린" 파일의 로드를 연기하는 미디어 콘텐츠 최적화 기술입니다. 설정에 따라 패턴은 애플리케이션의 다양한 순간에 발생할 수 있지만 일반적으로 스크롤, 클릭 또는 탐색과 같은 일종의 사용자 상호 작용에서 발생합니다.
사용자가 볼 수 없는 항목을 로드할 수 있는 한 다음과 같은 몇 가지 이유로 문제가 발생합니다.
- 배터리 및 기타 시스템 리소스를 낭비합니다.
- 데이터를 낭비합니다(제한된 데이터 요금제를 사용하는 사용자에게 중요).
이미지 및 비디오의 지연 로드를 적절하고 적절하게 사용하면 초기 페이지 무게와 초기 로드 시간을 모두 줄일 수 있으며 이 모두는 성능에 긍정적인 영향을 미칩니다.
그러나 이 기술의 사용에는 몇 가지 함정이 있습니다. 첫째, 이를 구현하려면 기존 코드에 추가 코드 라인을 추가해야 하므로 복잡합니다. 둘째, 이 패턴은 언로드된 콘텐츠의 부적절한 인덱싱 가능성으로 인해 검색 엔진 순위에 다소 영향을 미칠 수 있습니다.
요약
의심할 여지 없이 기술에 정통한 비즈니스 소유자는 웹 사이트의 어떤 측면을 수정해야 하는지 정의하기 어렵습니다. 모든 사람이 더 나은 속도와 성능을 위해 전자 상거래 상점을 최적화할 수 있는 것은 아닙니다. 병목 현상이 발생할 수 있는 문제가 많이 있으며 웹 사이트가 잘못 작동한다고 생각되면 웹 사이트 개발 및 최적화에 대한 탄탄한 전문 지식을 갖춘 최적화 서비스를 제공하는 회사를 찾는 것이 좋습니다.