2012-06-29 5 views
2

Facebook 및 기타 이미지 집약적 인 사이트는 축소판 그림을 축소하거나 왜곡시키지 않으면 서 전체 이미지의 축소판 크기를 어떻게 유지합니까?축소하거나 늘리지 않고 이미지 캐싱 및 크기 조정?

엄지 손가락을 클릭하면 원본 크기 이미지를 참조 할 수 있도록이 엄지 손가락이 원본의 자른 버전으로 저장됩니다.

내 img 태그의 미리 설정된 크기로 제한하려고하면 이미지가 늘어나거나 줄어 듭니다.

가로 세로 비율을 왜곡시키지 않고 미리 설정된 크기에 맞게 각 이미지를 자르고 싶습니다. 이 작업을 즉시 수행 할 수 있다면 대용량 이미지를 효율적으로 처리 할 수 ​​있습니까?

답변

2

HTML 마크 업 또는 CSS 스타일로 이미지의 크기를 조정하는 것은 considered bad practice입니다. 파일 크기를 늘리면 품질이 떨어지고 파일 크기를 줄이면 사용자가 필요한 것보다 큰 파일을 다운로드해야하므로 속도가 빨라집니다.

거의 모든 언어 또는 프레임 워크에서 이미지 크기 조정 및 캐싱을 위해 구축 된 라이브러리가 있습니다. 표준 가로 세로 비율을 유지하기 위해 대부분 자르기 기능도 제공합니다. PHP의 경우 GD/ImageMagick을 기반으로 한 phpThumb을보십시오.

크기가 변경된 이미지는 캐시 폴더에 저장되므로 이미지를 요청할 때마다 다시 생성 할 필요가 없습니다. 이렇게하면 정적 파일을 제공하는 것만 큼 성능이 향상됩니다. 유일한 오버 헤드는 크기가 조정 된 버전이 캐시에 있으면 작은 검사입니다.

1

페이스 북을 직접 말할 수는 없지만 대부분의 사이트는 큰 이미지를 업로드 한 다음 크기가 작은 미리 설정된 크기가 자동으로 다시 작성되고 (대개 스크립팅 언어와 PHP/GD와 같은 라이브러리에 의해) 저장됩니다. 유사한 파일 이름 패턴을 사용하여 가능한 적은 대역폭을 사용하고 로딩 시간을 향상 시키며 css로 이미지를 조작하지 않도록합니다.