Network Information API

Network Information API는 웹 개발자가 연결 유형, 연결 속도 및 사용자가 사용한 데이터 양과 같은 사용자의 네트워크 연결에 대한 정보에 액세스할 수 있도록 하는 JavaScript API입니다. 이 정보는 웹 애플리케이션의 성능을 최적화하고 더 나은 사용자 경험을 제공하는 데 사용될 수 있습니다.

​

다음은 Network Information API를 사용하여 사용자의 네트워크 연결 유형을 가져오는 방법의 예입니다.

​

if ('connection' in navigator) {

const connection = navigator.connection;

​

switch (connection.effectiveType) {

case 'slow-2g':

// The user is on a slow 2G connection.

break;

case '2g':

// The user is on a 2G connection.

break;

case '3g':

// The user is on a 3G connection.

break;

case '4g':

// The user is on a 4G connection.

break;

default:

// The user is on an unknown connection type.

break;

}

}

​

이 예제에서는 먼저 `navigator` 개체에 `connection` 속성이 있는지 확인합니다. 이는 브라우저가 Network Information API를 지원함을 나타냅니다. 그런 다음 사용자의 네트워크 연결 유형을 나타내는 `connection` 개체의 `effectiveType` 속성을 가져옵니다.

​

또한 Network Information API를 사용하여 예상 왕복 시간(RTT)과 사용자 네트워크 연결의 최대 다운링크 속도를 얻을 수 있습니다.

​

if ('connection' in navigator) {

const connection = navigator.connection;

​

// Get the estimated round-trip time (RTT) in milliseconds.

const rtt = connection.rtt;

​

// Get the maximum downlink speed in megabits per second (Mbps).

const maxDownlinkSpeed = connection.downlinkMax;

​

console.log(`Estimated RTT: ${rtt} ms`);

console.log(`Maximum downlink speed: ${maxDownlinkSpeed} Mbps`);

}

​

이 예제에서는 `rtt` 속성을 사용하여 사용자 네트워크 연결의 예상 RTT를 밀리초 단위로 가져오고 `downlinkMax` 속성을 사용하여 최대 다운링크 속도를 초당 메가비트 단위로 가져옵니다. 이 정보를 사용하여 사용자의 네트워크 연결을 기반으로 미디어 콘텐츠의 크기와 품질을 조정하여 웹 애플리케이션의 성능을 최적화할 수 있습니다.