html 테이블에 그림을 표시하는 웹 사이트가 있습니다. 페이지를 클릭하면 사진 크기에 따라 점진적으로 테이블을로드하고 크기를 조정하는 방법이 표시됩니다. 그 준비가 증가 로딩 방지하기 위해 찢어하는 후그림 테이블의 증분 렌더링을 피하십시오.
대기 번 테이블을 보여줍니다 :
그래서 하나가이 작업을 수행 할 수있는 더 좋은 방법이 있나요. ".로드" 일부를 보여주는이 완전히 렌더링 될 때까지 업데이트img 태그 자체의 CSS 또는 height/속성을 통해이든간에 각 이미지의 높이와 너비를 HTML 태그의 일부로 지정하십시오. 그렇게하면 브라우저는 이미지 파일을 완전히 다운로드하기 전에 이미지에 할당 할 화면 공간 (페이지 레이아웃 방법)을 알 수 있습니다.
이것은 Google의 PageSpeed optimization recommendations의 일부입니다.
"CSS sprites"의 기술을 살펴볼 수 있습니다. 이것은 한 번에 다운로드되지만 페이지에 별도의 이미지로 계속 표시되는 하나의 큰 파일로 여러 이미지를 병합 할 수있는 CSS 트릭입니다.
나는 모든 것이로드 된 후에 모든 이미지를 한 번에 보여주는 것에 관한 것입니다. – rahul
어떻게 이미지 높이와 너비를 얻을 수 있습니까? .i 그냥 URL이 있습니다. http://www.mysite.com/image1.jpg – leora
이상적으로 크기를 저장해야합니다 (DB에서 가져 오는 경우). 이론적으로 PHP에서 GD 또는 유사한 것을 사용하여 이미지의 크기를 파악할 수는 있지만 페이지를로드 할 때마다 성능이 저하 될 수 있습니다. 크기를 DB에 저장하는 것이 좋습니다. – Amber