강태풍의 개발블로그

🎈개요 10분 테코톡 에서 발표한 " 발표내용 " 발표를 듣고 강의 내용을 간략히 정리하고, 느낀점과 해야할 일을 적는 리뷰 글입니다. 📚강의 내용 정리 왜 이미지를 개선해야 하는가? 웹성능(로딩성능과 렌더링 성능) 을 개선해야함 이미지의 파일이 웹페이지의 가장 큰 용량을 가짐 차세대 이미지 형식 결정하기 PNG : 무손실 압축 사용, 최고 품질이미지를 제공하나, 크기가 다른 형식에 비해 훨씬 크다 JPEG : 손실 압축 사용, PNG에 비해 용량이 작다 WebP : 구글에서 2010년 발표, JPEG보다 더 나은 압축과 더 많은 기능을 제공, 범용성이 더 높다 AVIF : AOMedia에서 2019년 발표, WebP와 유사하게 높은 압축률 자랑 WebP 사용시 JPG에 비해 35% ~ 65%정도 용량을..

🎈개요 인프콘 2023 에서 발표한 " 당신의 웹페이지는 몇점인가요? " 발표를 듣고 강의 내용을 간략히 정리하고, 느낀점과 해야할 일을 적는 리뷰 글입니다. 📚강의 내용 정리 웹성능 사이트 내의 로드 시간을 단축 : 리소스들의 로딩 시간을 단축 서비스를 빠르게 사용 가능하게 준비 매끄러운 상호작용성 사용자의 체감 성능 : 실제 로딩 시간보다 사용자가 더 빠르게 느끼게 하기 로딩 성능과 렌더링 성능을 고려해야한다. 로딩성능 리소스가 렌더링 되기 전에 로딩되는 성능 Network 바에서 확인 가능 로딩성능의 개선 네트워크 개선 및 리다이렉트 방지, 캐시 적극적 사용 보통 캐시를 이용해서 쉽게 개선이 가능하다 리소스 압축 및 최적화 렌더링 성능 개선 받아온 리소스가 DOM 에 그려지는 성능 FP / FCP ..