브라우저(크롬) 디버깅 - 1

Network conditions 다루기

웹 프론트엔드 개발을 하다 보면 브라우저(크롬)에서 디버거를 열고 디버깅을 하는 경우가 많습니다.

디버깅을 할 때에 네트워크가 느린 상황에서 테스트가 필요할 때가 가끔 있는데요.

이럴때에 크롬 디버깅을 여시고 (F12) Network > 와이파이 모양 아이콘을 클릭하시면 하단에 Network conditions 탭이 나타나게 됩니다.

여기에서 Network throttling 에서 옵션을 조정하시면 됩니다.

Network throttling 옵션들

No throttling: 네트웍 정상 속도

Fast 3G: 빠른 3G 속도

Slow 3G: 느린 3G 속도

Offline: 오프라인

 

Network conditions 탭을 꺼낸 모습입니다. 캡쳐화면의 하늘색(민트색) 체크가 클릭 포인트 입니다.

Network conditions 탭 꺼내기

Network throttling 행에서 원하는 속도 선택하기

 

한번 설정하면 다른 브라우저 탭에도 동일하게 적용되니 느린 속도 디버깅이 끝나시면 다시 No throttling 으로 원상복구 하는 것 잊지 마세요.

오늘도 즐거운 코딩하세요~!