개발 Q&A

제목 이미지 로딩 속도 때문에 고민입니다.
글쓴이 수야디벨 작성시각 2015/04/16 10:22:07
댓글 : 6 추천 : 0 스크랩 : 0 조회수 : 20331   RSS
안녕하세요 , 벌써 2015년의 4개월이 지나갔 ...


이제 프로젝트의 막바지네요 . (나름 혼자 감격중 ..)

아무튼 이제 전반적인 사이트 속도에 대해서 개선하고 있는 중인데 ,

맡고 있는 사이트가 쇼핑몰 사이트다보니 이미지가 엄청나게 많습니다 .

한 페이지에서 불러오는 이미지 양도 꽤 많구요. 

그래서 구글에 '이미지 로딩 속도 개선' 같은 키워드로 검색하다가 아래와 같은 글을 봤습니다.



3. 캐시메모리에 다음 페이지의 이미지를 미리 받습니다. 

다음 페이지로 연결되는 페이지라면 다음 페이지의 이미지를 미리 받아 
캐시 메모리에 저장시켜두는 것이 다음 페이지의 로딩속도를 빠르게 합니다. 
예를 들어 다음 페이지에 test.gif라는 큰 이미지가 있다면 앞 페이지의 
하단에 다음 태그를 넣습니다. (앞페이지를 보는 동안 뒷 페이지 이미지를 받음) 

 

위 방법은 만약 페이지가 페이징 형식(1,2페이지,3페이지가 존재하는 형식) 이라면

1페이지에서 미리 2페이지에 출력될 이미지를 출력 시켜놓는다는 이야기겠죠?

그럼 어차피 1페이지에선 2페이지 이미지 미리 출력하느라 부담이가고 ,

2페이징선 3페이지 이미지를 미리 출력하기에 부담이 되고 ,

3페이지에선 4페이지 이미지를 미리 출력하기에 부담이 되어서 ..

어차피 도찐개찐(?) 그게 그거 일거 같은데 ..

위 방법에 대해선 다들 어떻게 생각하시는지 의견 여쭙고 싶습니다.



또 이미지 로딩속도 개선 하는데에 어떤 방법들을 사용하고 계신지 궁금합니다 ~!
 다음글 자바스크립트에 PHP 코드를 섞는다는 것 (6)
 이전글 서브라임텍스트 + 코드이그니터 PHP (6)

댓글

인스카 / 2015/04/16 10:34:07 / 추천 0
저는 1) 이미지를 페이지 로딩 완료 후 동적으로 표시 2) CloudFront 사용 의 방법으로 해결했습니다.
kaido / 2015/04/16 12:04:39 / 추천 0
속도 개선을 위해서 w3c 에서의 권장 사항입니다.

1. 스플릿 이미지를 사용하기를 권장 하고 있습니다. 

2. 이미지 파일 형태는 가급적 PNG만 사용을 권장 하고 있습니다.

서버 환경에서는 CDN을 넣어 주시면 더욱 향상이 됩니다.

그 밖에 여러가지 수를 쓴다 해도... 결론적으로 최적은 이미지 용량을 줄이는 것이 최적의 방법 ( ..)
 
수야디벨 / 2015/04/17 09:34:14 / 추천 0
인스카// kaido 

역시, 이미지 용량을 줄이는게 가장 최선이겠죠 ? 조언 감사합니다 ㅎ
lovelywook / 2015/04/17 17:33:32 / 추천 0
이게 의도에 맞는지는 모르겠지만 래이지 로더 링크 슬쩍 던집니다.
http://www.appelsiini.net/projects/lazyload
들국화 / 2015/04/24 17:08:02 / 추천 0
서비스 형테에 따라 달라질것 같네요.
프로파일링 해서 어디서 가장 문제인지 판단하는게 가장 빠를것 같네요.
가장쉬운팁중 하나는 http 1.1 을 사용 하는 겁니다.
파리지앵 / 2015/04/28 18:15:27 / 추천 0
저는 솔루션 개발팀은 아니고 다른 개발팀에 있지만 도움이 되지 않을까 생각되어 글남겨드립니다.
저희 회사에 이미지 경량화 솔루션이 있습니다.  이미지 로딩속도 감소시키는데 도움이 될것 같아서요.
Jpeg이미지를 시각적 화질 손상 없이 평균 1/3 사이즈로 줄여주는 기술입니다. 
실제로 음식배달 앱과 모 쇼핑몰 사이트 등에 저희 회사 솔루션이 들어가 있구요.
안드로이드 앱으로 테스트를 해보시는건 어떠신지요? 그리고 평가도 부탁드리고 싶어서요. 
 "아톰포유" 라는 어플입니다.  검색후 사용해 보시고... 필요하시면 프로버전 보내드릴께요.
hy.jung@quramsoft.com