event.preventDefault(), 이미지 용량에 따른 이미지 처리

• event.preventDefault()

1. a 태그 클릭 시 href 링크로 이동
2. form의 submit 누를 시 새로 실행

해당 event 에서 기본적으로 실행되는 로직을 실행되지 않게 하고 싶을 때

<form onSubmit={buttonSubmitHandler}>
<button type=“submit”/ >
</form>

• 자식 컴포넌트의 상태를 부모 컴포넌트로 올리고 싶다면, 부모 컴포넌트에서 함수를 만들어서 props를 통해 전달해줘야 한다.

• 이미지 가져오기

1) jpg, jpeg
높은 압축률
이미지 퀄리티 손상가능(lossy)
수천 가지 팔레트 색
로고,라인 x

2) png
손실없이 압축가능 but 파일 크기가 큼
W3C 권장 표준
간단한 배너 이미지

3) svg
2차원 백터 그래픽
해상도 상관 없이 이미지 품질 좋음
로고,라인
복잡한 이미지 x

이미지 용량에 따른 이미지 처리 : 9.7KB 초과 미만

이미지 파일의 크기가 9.7KB 기준으로 큰지 작은지에 따라 이미지 파일을 브라우저에서 처리하는 방식이 달라진다

개발서버 base64 인코딩 => 스트링

static 이미지파일