2009-06-15 2 views
2

성능에 대한 질문.CSS 파일을 가장 잘 관리하는 방법

현재 (압축되지 않은) 다른 CSS 파일이있는 웹 프로젝트가 있습니다. 모든 페이지에 필요한 파일이 포함되어 있습니다.

나는 하나의 파일에 모든 스타일 정의를 넣고, 압축하고, 헤더에 중앙에 두는 것에 대해 생각하고 있습니다.

성능 향상을 위해 무엇이 필요합니까? 하나의 파일을 압축 (모든 페이지가 모든 스타일을로드)하거나 파일을 분할하고 필요한 파일 만로드 할 수 있습니까?

답변

5

파일을 분할하면 브라우저가 더 많은 요청을해야합니다. 결국 모든 페이지에 대해 다시 사용되는 하나의 스타일 시트를 넣을 때보 다 느립니다. 브라우저에 스타일 시트가 있으면 브라우저 캐시에 저장됩니다. 첫 번째 페이지 이후의 모든 페이지에 대해 브라우저는 스타일 시트를 다운로드 할 필요가 없습니다. 결국 나는 이것이 더 나은 사용자 경험을 제공한다고 생각합니다.

희망이 도움이됩니다.

+0

) 인쇄 스타일 시트를 잊어 버린 것 같지만 ? – Kezzer

+0

고마워, 나는 모든 것을 하나의 파일에 담아 yui-compressor와 같이 압축하려고 시도 할 것이다! – opHASnoNAME

3

우리는 일반적으로 우리의 모든 CSS 파일을 개발 중에 별도로 유지합니다. 그리고 배포 할 때 우리는 그것들을 하나의 파일로 묶고 서버에서 gzip 압축을 사용하여 압축 된 파일을 클라이언트에 보냅니다.

+0

CSS 자체를 축소하여 추가로 가져갈 수도 있습니다 (예 : http://dimebrain.com/2008/03/a-better-css-mi.html – Dror

1

하나의 압축 파일이 아마도 가장 빠릅니다. HTTP 요청을 줄이려고합니다. 또한 모든 배경 이미지를 하나의 파일에 넣고 CSS 스프라이트를 사용하십시오.

0

이 웹 사이트의 유형에 따라,

  • 는 사용자가 아마 가장 빠른 될 것입니다 모든 CSS를 다음 사이트에있는 모든 페이지를 사용하여 미리로드하는 인트라넷 웹 사이트 인 경우.
  • 대부분의 사용자가 몇 번의 클릭 후 사라질 인터넷 웹 사이트 인 경우 페이지 당 더 작은 CSS 파일을 사용합니다.

자세한 내용은 YSlowGoogle Page Speed을 참조하십시오.

0

저는 압축되지 않은 별도의 파일에서 공용 스타일 시트를 사용하는 환경에서 작업하고 있으며 자동으로 병합되어 하나의 파일로 압축됩니다. 압축되어 있기 때문에 분명히 크기가 작고로드가 더 빠르지 만 스타일 시트를 가져올 때 서버에 하나의 연결 (각 CSS 파일에 1 개의 연결이 필요함)이 있기 때문에 하나의 파일 일 때 더 나아졌습니다. 사용자 브라우저.

관련 문제