Question

我正在使用挂毯开发智能手机的网络应用程序。我的索引页面有一个循环。我在这个循环中放了五个以上的图像。每个图像大小为5KB。但是加载时间超过150毫秒（每张图片）。

有没有办法减少图像加载时间。请任何人帮助我。

代码：

Index.tml

<t:loop source="topRatedVideoDatas" value="videoItemProperty" index="currIndex" encoder="encoder">
<table width="100%" cellpadding="0" cellspacing="0">
<tr class="list">
<td>
<img src="${videoItemProperty.image}"  width="130" />
</td>
</tr>
</table>
</t:loop>

Index.java

public List<ItemProperty> getTopRatedVideoDatas() {
        List<ItemProperty> videoItemProperties = null;
        try {
            final GetData getData = new HttpGetData();
            final String json = getData.getContent("http://localhost:8080/sample/getTopRatedItems" );
            final JSONObject object = new JSONObject(json);
            if(object.optString(Constants.CODE).equalsIgnoreCase(Constants.STATUS_CODE_1)) {
                videoItemProperties = new ArrayList<ItemProperty>();
                final String[] result = object.optString(Constants.ITEMS).split(Constants.COMMA);
                for(int innerIndex = 0; innerIndex < result.length; innerIndex++) {
                    videoItemProperties.add(itemProperties.get(innerIndex).getPropety().get(innerIndex));
                }
            }
        } catch(final Exception e) {

        }
        return videoItemProperties;
    }

Answer 1

见上述评论;我建议

将组合视频数据的逻辑移出页面代码并转移到服务中
提出了一种合理的方法来缓存视频数据结果，和/或定期在后台更新它

这将导致页面渲染更快;下一步是看看自己下载图像需要多长时间。

您可以查看重新缩放和压缩图像。您可以确保图像具有其内容的唯一URL，并且远期将到期标头（和/或ETag）以确保浏览器只下载一次，并将它们保存在本地缓存中。

如果还不够，你可以做更高级的技巧。您最初可以下载一个快速低分辨率缩略图，然后在初始页面加载后用更高分辨率的缩略图替换它（虽然您在使用渐进式JPEG格式时获得了一些好处。

但是，再次，从测量和目标开始，找出实际存在的问题。 FF和Chrome都有很好的工具来获取这些信息。使用它。

如何减少图像加载时间

1 个答案: