在Google阅读器中动态加载项目

Question

我一直在使用Google Reader，并希望实现类似的技术，使他们“似乎”延迟加载每个帖子的内容。当您点击其中一个订阅时，您会看到一系列包含代码段和其他信息的帖子。当您点击帖子时，它会展开以显示完整的正文。我认为他们只是简单地切换元素的可见性，但他们似乎在动态插入DOM。您可以通过在页面加载后查看HTML来证明这一点 - 没有扩展内容的迹象。如果正文包含图像，则仅在展开时加载它们。这显着改善了初始请求的加载时间，因为它没有为每个帖子加载每个图像。

我有两个想法发生了什么：

1. 他们正在执行AJAX请求并插入响应，从而在需要时加载和呈现任何图像。
2. 他们用JavaScript做了些什么，但我不知道到底是什么。

我的第一次尝试渲染了折叠内容，但使用CSS使其不可见：

display: none

然后我用jQuery切换了visibiliy：

$("itemDetail").toggle()

唯一的问题是隐藏内容中的图像是在初始请求期间加载的 - 这对用户来说并不明显，但可能会产生其他负面影响。

这是列表视图（全部已折叠）：

alt text http://img6.imageshack.us/img6/4503/croppercapture1.jpg

这是带有扩展帖子的列表视图：

alt text http://img6.imageshack.us/img6/4215/croppercapture2.jpg

有什么想法吗？

Answer 1

  

他们正在做一个AJAX请求   插入响应，从而加载   并在何时呈现任何图像   需要的。

嗯，是的，这就是他们正在做的事情。

那么，究竟是什么问题呢？你在可见度方面做的事情是完全不同的，正如你自己所说的那样，效率并不高。

因此，您需要在正确的位置了解如何make that request with JQuery和put the HTML you get from the request进入页面。

Answer 2

当您点击折叠项目展开它时，我不确定是否会向Google的服务器发出AJAX请求。我使用Firebug使用Net选项卡跟踪任何请求。我只能看到这个特定项目的两个请求，两个都是托管它的服务器（在这种情况下是weblogs.asp.net） - 不知道第一个做什么，但第二个获取嵌入在帖子中的imaage。这里有两个屏幕截图，一个前后显示AJAX请求：

在： alt text http://img207.imageshack.us/img207/8461/croppercapture12.jpg

在： alt text http://img207.imageshack.us/img207/6128/croppercapture13.jpg

我不希望这个问题变成一个争论，我只是陈述我发现的证据，这表明还有另一种解释。