如何加快页面上图像的渲染速度?

时间:2015-04-12 09:14:22

标签: html image

我正在创建一个用户可以发布广告的网站,用户可以上传照片...我在我的网站顶部发布了四个最新的广告图片...所以每次我浏览我的网站时将显示最新的4个广告图片,但问题是渲染时间太长..使我的网站速度减慢...

我该如何优化它?我需要建议的人......

然后顺便说一下,我将这些图片保存在我的数据库中作为blob ..并在我的数据库中选择了4个最新广告。

<?php if($latest_upload_count > 0){ ?>
<div class = "collapse navbar-collapse">
    <div class = "container">
        <div class = "row">
        <?php while($get_lastest_pics = mysql_fetch_assoc($get_5_latest_ads_query_string_execute)){ ?>
            <div class = "col-xs-3">
                <img img src="data:image/jpeg;base64,<?php echo base64_encode($get_lastest_pics['img']); ?>"  style = "height: 180px; width: 270px;"  class="img-responsive img-thumbnail" alt="Cinque Terre" >     
            </div>
        <?php } ?>

        </div>
    </div>
    <br />
</div>

<?php } ?>

我尝试省略,我的网站运行得更快......

2 个答案:

答案 0 :(得分:4)

将图像另存为文件,并仅在数据库中保存路径。然后生成较小尺寸的缩略图以在主页上显示它们(例如,通过点击它们来放大这些图像的能力)或者仅缩小并优化这些图像。您也可以在数据库中保存缩略图的路径,也可以在运行中生成它们(在文件名中使用一些前缀/子修补程序,用于不同的大小)。

使用一些众所周知的PHP库进行图像处理(例如ImagickIntervention Image或类似)。

答案 1 :(得分:-1)

你自己的代码怎么样: 你怎么写这样的:

if($latest_upload_count > 0){
    echo "<div class = 'collapse navbar-collapse'><div class = 'container'><div class = 'row'>";
    while($get_lastest_pics = mysql_fetch_assoc($get_5_latest_ads_query_string_execute)){
        echo "<div class = 'col-xs-3'>
            <img img src='data:image/jpeg;base64,".base64_encode($get_lastest_pics['img'])."'  style = 'height: 180px; width: 270px;'  class='img-responsive img-thumbnail' alt='Cinque Terre' >     
        </div>";
    }
    echo "</div></div><br /></div>";
}