Base64를 안쓰고 s3에 이미지를 넣는 이유는 뭘까?

[yunseorim1116]

• 이미지를 base64로 변환하면 서버에 저장안하고 이미지를 src에 그대로 넣을 수 있는 이유가 뭘까?

이미지를 Base64로 변환해서 HTML의 src 속성에 직접 넣을 수 있는 이유는, Base64 인코딩이 바이너리 데이터를 텍스트로 변환하기 때문입니다. 이 방식은 이미지를 외부 서버에 저장하지 않고도 웹 페이지에 포함시킬 수 있는 방법 중 하나입니다.

• 용량은 어떨까? 그대로 보존될까?

용량은 Base64로 인코딩하면 약 33% 정도 증가합니다. 이는 바이너리 데이터를 텍스트로 변환하면서 8비트를 6비트로 나누어 처리하고, 결과적으로 더 많은 데이터가 필요하게 되기 때문입니다.

• 보통 서버 s3에 저장해서 url 로 하면 서버비용이 드는, base64를 안쓰는 이유는 무엇일까?

1. S3에 이미지를 저장하고 URL로 접근하면, 이미지 자체를 HTML에 포함하지 않아도 되므로 HTML 파일 크기가 작아집니다.
2. S3에서 제공하는 CDN을 이용하면 전 세계적으로 빠른 이미지 로딩이 가능해집니다.
3. 이미지는 캐시되어 재요청 시 성능을 개선할 수 있습니다.

• Base64를 사용하지 않는 이유:

1. 성능 문제: 큰 이미지를 Base64로 인코딩하여 HTML에 포함하면 웹 페이지 로딩 속도가 느려질 수 있습니다.
2. 유지 보수: 이미지가 많아지면 HTML 코드가 길어지고 복잡해져 관리가 어려워질 수 있습니다.
3. SEO 및 접근성: Base64로 인코딩된 이미지는 검색 엔진에서 인덱싱되지 않으며, 텍스트 기반의 이미지 분석이 어려울 수 있습니다.

• Encoding과 Decoding에 추가 CPU 연산까지 필요한데 우리는 왜 Base64 Encoding을 하는가?

문자를 전송하기 위해 설계된 Media(Email, HTML)를 이용해 플랫폼 독립적으로 Binary Data(이미지나 오디오)를 전송 할 필요가 있을 때, ASCII로 Encoding하여 전송하게 되면 여러가지 문제가 발생할 수 있습니다. 대표적인 문제는

• ASCII는 7 bits Encoding인데 나머지 1bit를 처리하는 방식이 시스템 별로 상이하다.

결론

Base64는 소량의 작은 이미지를 인라인으로 포함해야 할 때는 유용하지만, 많은 이미지나 큰 이미지를 다룰 때는 효율적이지 않습니다.