프로필 사진
Jeongwoo Seo
  • Blog
  • Series
  • Portfolio
BLOG

a developer who never stops growing.

Contact
Email
Github
Subscribe

새 글을 구독해보세요

Explore
Blog
Series
Portfolio
Admin

© 2024 Seo Jeongwoo. All rights reserved.

프리뷰 | 네트워크 기반 동적 품질 조절 기능 개발 1편 Thumbnail

네트워크 품질의 성능 지표에 대해서

프로필 사진
개발자 서정우
2025. 3. 4.5 min read
네트워크

작년 부스트캠프에서 진행했던 프로젝트 WebRTC 화상통화 기반 Preview 프로젝트를 리팩토링하기로 결정했다.

이번에 새롭게 만들어볼 기능은 네트워크 품질에 따른 동적 화질 조절 기능이기 때문에 네트워크 CS를 좀 더 깊게 공부해보면서 만들어보기로 했다.

네트워크 모니터링을 해야하는데, 어떤 지표를 모니터링해야할지 알아야 할 것 같아서 이에 대해 공부해봤다.

네트워크 성능 지표

네트워크의 성능을 측정하는 지표로는 여러가지가 사용된다. 대표적으로 지연시간, 지터, 패킷 손실률, 대역폭, RTT 등이 있다.

  • 지연 시간: 데이터가 전송되는데 걸리는 시간
  • 지터: 지연시간의 변동성
  • 패킷 손실률: 데이터 전송 중 손실되는 데이터 패킷의 비율
  • 대역폭: 한번에 네트워크를 통과할 수 있는 데이터 볼륨
  • RTT(Round-Trip Time): 지연시간의 일종이지만, 데이터가 전송됐다가 응답되는 시간을 기록한 것

좋은 네트워크 성능은 지연시간이 짧고 변동성이 적으면서 패킷 손실률이 적은 네트워크이다. 반대의 경우는 좋지 못한 네트워크 품질이라고 할 수 있다.

지연시간

네트워크 지연의 원인은 여러가지가 있다. 전송 매체가 무선인지 유선인지에 따라 달라질 수 있고 네트워크 트래픽 이동 거리가 길어지면 길어질 수록 지연이 길어진다. 또한 전송하는 데이터의 볼륨이 커질 수록 지연시간이 길어진다. 그 외에도 서버 성능, 네트워크 홉 수 등이 영향을 미친다.

만약 우리 프로젝트에서 지연시간이 길어지면 어떻게 될까? 실시간 화상통화인데 실시간이 아니게 될 수 있다. 지연시간을 줄이기 위해서 전송하는 미디어의 품질과 수신받는 미디어의 품질을 동적으로 조절하는 방식으로 피어커넥션의 지연시간을 줄여볼 수 있을 것 같다.

지터

지터는 처음 들어보는 개념이었다. 지터는 지연시간의 변동성을 말한다고 한다. 지터는 네트워크 정체나 타이밍 드리프트 또는 경로 변경 등의 이유로 연속된 데이터 패킷 간의 도착 시간 차이의 변화량을 말한다.

지터가 작을 수록 좋은 네트워크인 것이다. 지터가 커지면 WebRTC에서는 목소리가 로봇처럼 들린다던가 화면이 깨지는 현상 등이 발생한다고 한다.

패킷 손실률

패킷 손실률은 말그대로 패킷이 손실된 비율을 의미한다. 그렇다면 왜 발생하는걸까?

  • 네트워크 정체
    • 네트워크가 트래픽으로 정체되어 최대 용량에 도달하게 되면 더이상 패킷을 저장할 수 없게 되고 네트워크가 따라 잡을 수 있도록 폐기될 수 있다고 한다.
  • 하드웨어 문제
    • 오래된 네트워크 하드웨어는 트래픽을 느리게 할 수 있고 패킷 손실로도 이어질 수 있다고 한다.

문서 같은 정적인 데이터의 경우에 패킷이 손실되도 다운로드 속도가 느려지는 정도지만, WebRTC 같은 실시간성이 요구되는 데이터 교환에서는 아주 약간의 패킷 손실률만으로도 불쾌감을 느낄 정도로 사용자 경험이 안좋아질 수 있다고 한다.

WebRTC에서의 모니터링

WebRTC의 RTCPeerConnection API 중 getStats() 메서드를 사용하면 현재 커넥션의 여러가지 정보를 모니터링할 수 있도록 Report를 반환한다.

이 Report 객체에는 지터 등의 네트워크 품질 지표가 포함되어있다. 이런 지표들을 일정 시간마다 반복하면서 모니터링하면서 최근 네트워크 품질이 낮아지게 되면 동적으로 사용자의 비디오 품질을 조절하는 방식으로 최적화를 해보려고 한다.

코드 예제

getStats() 메서드는 Promise로 반환되기 때문에 then이나 await을 써줘야한다. 처음에 console.log(stats)를 찍었을 때 결과 값이 안나와서 당황했는데, getStats()의 반환값인 StatReport는 Map과 같은 이터러블한 객체이기 때문에 아래와 같은 식으로 꺼내서 볼 수 있었다.

setInterval(()=> {
  pc.getStats().then(stats =>
  {
    console.log('스탯 보고서')
    stats.forEach(stat=> {
      console.log(stat)
    })
  })
}, 10000)

무수히 많이 찍히는 모니터링 결과 보고서..

image.pngimage.png


다음 글에서는 실제로 네트워크 품질 모니터링을 위한 기획과 구현에 대해서 작성해봐야겠다.

📌 Table of Contents

  • 🌲 네트워크 성능 지표
  • 🪓 지연시간
  • 🪓 지터
  • 🪓 패킷 손실률
  • 🪓 WebRTC에서의 모니터링
  • 🪵 코드 예제
0
추천 글