• /
  • EnglishEspañolFrançais日本語한국어Português
  • 로그인지금 시작하기

사용자의 편의를 위해 제공되는 기계 번역입니다.

영문본과 번역본이 일치하지 않는 경우 영문본이 우선합니다. 보다 자세한 내용은 이 페이지를 방문하시기 바랍니다.

문제 신고

레벨 1 - JavaScript 오류율 점수표 규칙

JavaScript 오류율은 JavaScript 오류가 발생하는 브라우저 애플리케이션의 비율을 측정합니다. JavaScript 오류는 사용자 기능을 손상시키고 사용자 경험을 저하시킬 수 있습니다. 이 점수표 규칙은 고객 만족에 직접적인 영향을 미치는 프런트엔드 문제를 식별하고 해결 우선순위를 정하는 데 도움이 됩니다.

이 점수카드 규칙에 관하여

이 JavaScript 오류율 규칙은 디지털 경험 성숙도 모델 의 레벨 1(반응형)의 일부입니다. 사용자에게 영향을 줄 수 있는 해결되지 않은 JavaScript 오류가 브라우저 애플리케이션에 있는지 평가합니다.

중요한 이유: JavaScript 오류는 양식, 탐색, 결제 또는 대화형 기능과 같은 중요한 사용자 기능을 손상시킬 수 있습니다. 기능이 작동하지 않는 사용자는 종종 작업을 포기하고, 그로 인해 전환율이 떨어지고 브랜드 인지도가 저하됩니다.

이 규칙의 작동 방식

이 규칙은 JavaScript 오류가 나타나는 브라우저(애플리케이션 모니터 by 뉴렐릭 브라우저 )의 비율을 평가합니다. 프런트엔드 코드 문제로 인해 사용자가 기능 장애를 경험할 수 있는 애플리케이션을 식별합니다.

점수 이해하기

  • 통과(녹색): 브라우저 애플리케이션 중 낮은 비율의 JavaScript 오류가 사용자에게 영향을 미칩니다.
  • 실패(빨간색): 브라우저 애플리케이션 중 상당수가 해결되지 않은 JavaScript 오류를 가지고 있습니다.
  • 개구리, 목표: 모든 브라우저, 특히 사용자 트래픽이 높은 브라우저에서 JavaScript 오류를 최소화합니다.

이는 무엇을 의미합니까?

  • 합격 점수: 프런트엔드 애플리케이션은 최소한의 기능 장애로 안정적인 사용자 경험을 제공합니다.
  • 점수 실패: 사용자는 만족도와 전환에 영향을 미칠 수 있는 깨진 기능, 양식 또는 블록 복사를 접할 수 있습니다.

JavaScript 오류율을 줄이는 방법

점수에서 JavaScript 오류율이 높게 나타나는 경우 다음 단계에 따라 프런트엔드 문제를 식별하고 해결하세요.

1. 오류 인박스(errors inbox)의 오류 패턴 분석

  1. 액세스 인박스(errors inbox): 뉴렐릭의 뉘스 인박스(errors inbox)로 이동하여 귀하의 전체 JavaScript 오류를 모두 확인하세요.
  2. 큰 영향을 미치는 오류 식별: 사용자 또는 중요한 사용자 여정에 가장 큰 영향을 미치는 오류에 집중하세요.
  3. 유사한 오류 그룹화: 오류 메시지, 영향을 받은 페이지 또는 사용자 세그먼트에서 패턴을 찾습니다.
  4. 비즈니스 영향에 따라 우선순위 지정: 트래픽이 많은 페이지나 전환에 중요한 흐름의 오류를 먼저 해결합니다.

2. 오류를 분류하고 분류합니다.

중대한 오류(즉시 수정):

  • 결제 처리 실패
  • 사용자 인증 문제
  • 데이터 제출 문제
  • 탐색 또는 경로 설정 실패

높은 우선순위 오류(스프린트 내에서 수정):

  • 양식 유효성 검사 실패
  • 검색 기능 문제
  • 사용자 상호작용 문제
  • 콘텐츠 로딩 실패

중간 우선 순위 오류(향후 릴리스에서 수정):

  • 사소한 UI 결함
  • 비중요 기능 실패
  • 미용 또는 스타일링 문제
  • 에지 케이스 시나리오

3. 체계적인 오류 해결을 구현합니다.

재생산 및 진단:

  • 스택 추적 사용: 오류 세부 정보를 조사하여 어떤 코드가 실패했는지 파악합니다.
  • 브라우저 호환성 확인: 오류가 브라우저 관련 문제가 아닌지 확인하세요.
  • 테스트 사용자 시나리오: 오류를 유발하는 사용자 작업 재현
  • 최근의 내용을 검토하고, 배포: 오류가 최근 코드 변경 사항과 관련이 있는지 확인하세요.

근본 원인 해결:

  • Null/정의되지 않음 검사: 누락된 데이터에 대한 적절한 오류 처리 추가
  • API 오류 처리: 실패한 네트워크 requests대한 우아한 대체 방안 구현
  • 입력 검증: 양식이 예외 상황과 잘못된 입력을 처리하는지 확인합니다.
  • 리소스 로딩: 누락된 이미지, 스크립트 또는 스타일시트에 대한 오류 처리 추가

4. 오류 예방 관행 수립

더 나은 오류 처리를 구현하세요.

  • Try-catch 블록: 위험한 작업을 적절한 오류 처리로 감싸기
  • 기본값: 누락되거나 잘못된 데이터에 대한 대체 수단 제공
  • 우아한 저하: 기능이 실패하더라도 핵심 기능이 작동하도록 보장합니다.
  • 사용자 친화적인 메시지: 기술적인 세부 정보 대신 유용한 오류 메시지를 표시합니다.

개발 관행을 개선하세요:

  • 코드 검토: 동료 검토 중 오류 처리에 집중
  • 테스트 전략: 단위 테스트와 통합 테스트에 오류 시나리오 포함
  • 스테이징 환경: 프로덕션 릴리스 전에 철저히 테스트하세요
  • 모니터링 통합: 개발 및 스테이징 환경에 오류 추적 추가

개선 측정

JavaScript 오류 감소 노력을 확인하려면 다음 지표를 확인하세요.

  • 오류율 감소: JavaScript 오류가 있는 애플리케이션 비율 감소
  • 사용자 영향 지표: 전환률 개선, 이탈률 감소, 사용자 만족도 향상
  • 오류 해결 시간: JavaScript 문제를 더 빠르게 식별하고 수정
  • 오류 재발: 수정 후 반복되는 오류가 줄어듭니다.

일반적인 JavaScript 오류 시나리오

타사 스크립트 오류:

  • 문제: 외부 라이브러리 또는 위젯이 로드되지 않거나 문제가 있을 때 오류가 발생합니다.
  • 해결 방법: 오류 경계 구현, 폴백 사용 및 제3자 의존성/종속성 모니터링

브라우저 호환성 문제:

  • 문제: 코드가 일부 브라우저에서는 작동하지만 다른 브라우저에서는 실패합니다.
  • 솔루션: 브라우저 간 테스트, 폴리필 사용 및 점진적 향상 구현

네트워크 및 API 오류:

  • 문제: 네트워크 requests 실패하거나 예기치 않은 데이터가 반환될 때 JavaScript 오류가 발생합니다.
  • 솔루션: API 호출에 대한 적절한 오류 처리를 추가하고 재시도 논리를 구현하며 사용자 피드백을 제공합니다.

사용자 입력의 예외 사례:

  • 문제: 예상치 못한 사용자 입력으로 인해 폼이나 복합체 복합체가 깨짐
  • 솔루션: 포괄적인 입력 인증 및 사운드 구현

고급 오류 관리 전략

오류 추적 자동화

  • 자동 알림: 새 JavaScript 오류나 빈번한 JavaScript 오류에 대한 알림을 설정합니다.
  • 오류 그룹화 : 공지사항 방지를 위해 지능형 그룹화 사용
  • 영향 평가: 사용자 영향 및 빈도를 기준으로 오류 우선 순위 지정

개발 워크플로우와의 통합

  • 통합/연속속 배포(CI/CD) 통합: 블록 구현, 중대한 오류가 발견되면 배포
  • 성능 예산: 설명하기 전에 값을 설정하고, 구현으로, 배포 게이트를 사용하십시오.
  • 오류 귀속: 특정 구현, 배포 또는 기능 릴리스에 오류를 연결합니다.

사용자 경험에 초점을 맞추다

  • 사용자 실 모니터링: 오류가 실제 사용자 행동에 어떤 영향을 미치는지 추적합니다.
  • 전환 영향: 오류율이 비즈니스와 어떻게 연관되는지 측정
  • 사용자 여정 분석: 사용자 흐름에서 오류가 가장 자주 발생하는 위치를 파악합니다.

중요한 고려 사항

  • 사용자 영향에 따라 우선순위 지정: 사용자 또는 중요한 비즈니스 기능에 가장 큰 영향을 미치는 오류에 먼저 집중하세요.
  • 완벽함과 실용성의 균형: 사용자 경험에 큰 영향을 미치지 않는다면 일부 오류는 허용될 수 있습니다.
  • 비즈니스 맥락을 고려하세요. 트래픽이 많은 애플리케이션은 내부 도구보다 오류 허용 범위가 낮을 수 있습니다.
  • 사후 구현 모니터링, 배포: 수정으로 인해 새로운 오류가 발생하지 않는지 확인

다음 단계

  1. 즉각적인 조치: 에러스 인박스(errors inbox)를 검토하고 사용자에게 영향을 미치는 가장 큰 영향을 미치는 JavaScript 오류를 식별합니다.
  2. 프로세스 개선: 정기적인 오류 분류 회의 및 해결을 수립합니다.
  3. 예방 초점: 개발 프로세스에서 더 나은 오류 처리 관행 구현
  4. 사전 모니터링: 사전 오류 방지 및 사용자 경험 최적화를 향해 나아가세요
  5. 레벨 2로 진행: JavaScript 오류가 제어되면 Core Web Vitals 최적화에 집중하세요.

JavaScript 오류 모니터링 및 해결에 대한 자세한 지침은 당사의 브라우저 모니터링 문서뎃스 인박스(errors inbox) 가이드를 참조하세요.

Copyright © 2025 New Relic Inc.

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.