Overview 아무리 복잡한 웹 애플리케이션이라도 모든 것은 HTML 문서를 로딩하는 것부터 시작됩니다. 로딩된 문서는 자바스크립트를 실행하기 위한 태그, CSS style이나 image 등을 가져오기 위한 태그들을 포함하는 경우가 대부분이며, 브라우저는 HTML 문서를 받아온 뒤 이를 파싱 하면서(혹은 파싱 한 후에) 해당 태그들이 포함하는 리소스들을 가져옵니다. 기본적으로 브라우저는 Critical Rendering Path를 기준으로 삼아 fetch 해야 하는 리소스에 우선순위를 부여합니다. 브라우저의 경우 도메인마다 2~6개(Chrome브라우저의 경우 도메인마다 최대 6개)의 커넥션을 맺을 수 있고, 최대 커넥션의 개수를 넘어서는 요청은 이전 요청이 끝나야 이루어질 수 있습니다. 따라서 같은 도..

Overview iPhone X 등 notch가 있는 디바이스들에서 웹뷰의 Element를 Inspect 해야 할 일이 생겼었습니다. 최신 Chrome브라우저(포스팅 날짜 기준 Version 87.0.4280.88 (Official Build) (x86_64)) 에서 기본적으로 iPhoneX에 대한 디바이스 시뮬레이션을 제공하지만, notch 등 safe-area가 제공된 환경이 아닌, 스크린 크기만 맞춰진 환경을 제공하기 때문에 safe-area에 대한 테스트가 어렵다는 단점이 있습니다. 따라서 디바이스 환경을 재현할 수 있는 다른 환경이 필요하게 되었고, notch가 있는 iPhone12 mini에서 테스트할 수 있는 환경을 찾아보게 되었습니다. 물론 디바이스가 없는 경우 Xcode에서 제공하는 시뮬..