Question

我正在获取一个嵌套的JSON对象，它可能非常大，并且包含一些图片URL。类似的东西：

[
    {
        'id':1,
        'title': 'Title 1',
        'picture': 'url/for/picture/one.png'
    },
    {
        'id':2,
        'title': 'Title 2',
        'picture': 'url/for/picture/two.png'
    },
    {
        'id':...,
        'title': '...',
        'picture': 'url/for/picture/....png'
    },
    {
        'id':n,
        'title': 'Title n',
        'picture': 'url/for/picture/n.png'
    },
]

我每次都会在视图中从模型中加载不同的图片，所以我希望将这些图像（或至少其中一些图像）预先加载到内存或类似内容中，以便改进我的应用程序。的表现。

Backbone和/或Marionette有可能吗？

Answer 1

服务器端优化和客户端优化是两件不同的事情。

如果你想预加载图片，意味着把它们放在缓存中，你必须优化服务器端（例如用php：启用gzip，memcache等）。

一旦数据从服务器发送到客户端，除非在HTTP中再次发出另一个请求（意味着服务器和客户端之间的“谈话”），否则无法重新发送它们。

但是如果你有可滚动的内容，你可以在客户端做什么是lazy load images。基本上你在页面上看到的内容就像你通常那样呈现。但是当用户滚动时，您会请求加载其他图像。换句话说，如果用户不滚动，则将图像数量限制为他所看到的最小值。如果用户滚动，则通过异步请求请求其他图像。

如果你只想从服务器到骨干网中获取一些json数据，你将不得不操纵和“剪切”json文件服务器端，因为fetch()骨干方法获取json中的所有数据。

Answer 2

一个名为PreloadJS的优秀javascript库来处理这个问题。

示例：

function loadImage() {
    var preload = new createjs.LoadQueue();
    preload.addEventListener("fileload", handleFileComplete);
    preload.loadFile("assets/preloadjs-bg-center.png");
}

Backbone缓冲区或在内存中加载图像

2 个答案: