2013-03-14 64 views
0

我運行一個Wordpress網站,有數千篇文章,每篇文章至少有一個主JPEG圖像,每篇文章我們裁剪到240px高x 135px寬,並使用Save For Web功能在Photoshop中縮小其文件大小。所以在存檔頁面的情況下,我們可以在單個頁面上加載20到30個這樣的圖像。使用縮小到1/2尺寸的大圖像?加載時間不合適?

因爲我們正在設計在工地附近的一個應用程序,並希望我們的圖像看起來高品質,240×135大小是不會削減它在更高分辨率的屏幕,所以我們將需要更新尺寸。

我的問題是:如果我們將每個帖子設置爲在各自的頁面中使用603 x 339圖片,但是設置存檔頁面以列出較小圖片的帖子以將這些603 x 339圖片縮小爲240 x 135 CSS。加載時間有多糟?由於存檔頁面仍然會加載20-30張設置爲以240 x 135顯示的圖像,我們可以嗎?或者源603 x 339圖片的實際文件大小是否會對我們的頁面速度產生巨大的負面影響?

回答

2

當然有,增加加載時重

UPDATE: 說你有你的文件系統中的圖像(603x339)。使用給定的類here。 然後使用

$resizeObj -> resizeImage(240 ,135 , 'crop'); 
$resizeObj -> saveImage('sample-resized.jpg', 100); 

創建一個調整大小的圖像,並使用圖像存檔pages.You可以刪除此圖片保存文件系統的大小在多個計算每次的費用。 但是你的主網頁,你仍然可以使用圖像在文件系統中作爲不被修改

替代解決方案:

WordPress的有一個叫ImageMagick Engine

使用,你可以插件重新大小在將圖像發送到客戶端機器之前將圖像發送出去。因此,您可以發送要顯示大小的圖像(客戶端不需要重新調整大小)。

因此將負載限制在所需的範圍內。

要不乾脆用圖像壓縮工具(如Caesium或任何其它),這會降低你的系統本身

+0

娛樂時間:您可以在將圖像發送到客戶端機器之前通過調整圖像大小來解釋您的意思嗎?在我上面說過的例子中,我的Wordpress文章將使用603x339的主圖像,然後我們想在歸檔頁面上調用時按比例縮小相同的圖像。 – 2013-03-14 03:14:00

+0

@JoeGrizzly查看上述更新 – funtime 2013-03-14 12:13:13

1

用CSS縮放圖像尺寸仍然需要整個加載圖像,然後在瀏覽器有規模的是在顯示它之前下來,所以它可能比以原始大小顯示圖像慢得多。爲了更好的速度,你需要發送預縮放圖像給客戶端。

相關問題