폰트 최적화 알아보기
·
React
인프런 강의 프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 2의 폰트 최적화를 학습하고 정리한 내용입니다. 폰트를 최적화하지 않으면 다음과 같은 현상이 발생할 수 있습니다. 웹 폰트도 하나의 리소스로 네트워크를 통해 서버에서 다운로드해야 합니다. 그렇기 때문에 폰트가 적용된 텍스트를 브라우저 화면에 출력할 때 깜빡이는 현상이 발생합니다. 깜빡이는 현상에는 FOUT와 FOIT가 있다. FOUT(Flash of Unstyled Text)는 처음에는 기본 폰트로 출력하다가 다운로드가 완료되면 폰트가 적용되는 방식입니다. IE와 엣지 등의 브라우저에서 기본적으로 이 방식을 사용하고 있습니다.FOIT(Flash of Invisible Text)는 처음에는 텍스트를 보여주지 ..