Facebook的网站前端是如何设计的？

我在想如何设计Facebook前端，特别是它是固定的右侧边栏？我想在我的web应用中实现类似的侧边栏来显示用户的任务。但我首先想更好地理解Facebook的边栏工作方式。Facebook的网站前端是如何设计的？

我想要理解的第一件事是他们如何处理右侧边栏总是在那里！当你在facebook里面打开新链接时，它不会重新加载。我了解可视化CSS部分，没有问题：position:fixed; right:0; top:0; height:100%;。但是我真的好奇他们是怎么做到的：当你点击Facebook内部的一个加载新页面的链接（例如点击一个朋友的名字）时，整个新页面内容都会被加载，但似乎并没有再次加载侧边栏。它一直坐在那里。

当你点击链接时，他们不会做任何AJAX的东西，所以整个页面的内容不会通过AJAX加载？它只是非常快，或者他们使用某种（对我来说不明）的设计模式？

来源

2013-09-16 Primoz Rome

我认为[这篇文章在BigPipe上]（https://www.facebook.com/note.php?note_id=389414033919）回答了这个问题（至少在高层次上）。 –

哇很有趣的阅读。所以这个BigPipe实际上是这样做的：1.当服务器接收到一个页面请求时，它发送一个简单的HTML模板来描述页面块和一个JS库的响应。2.启动JS来扫描模板并启动多个AJAX请求来获取HTML，CSS和JS用于不同的页面块，3.浏览器然后呈现来自每个页面块请求的响应......这或多或少是？ –

这听起来正确;理论上，简单的HTML模板将非常快速地呈现，并且未改变的块可以使用浏览器已经可用的数据（例如本地存储）。但可能还有更多（这是一个很好的问题）。 –

既然没有人想回答这个问题，我想我可以提供答案，帮助我最准确地回答我的问题。

答案是在这Facebook's dev blog post，其中描述BigPipe设计模式由Facebook率先推出。 BigPipe将页面分成不同的块，称为'pagelets'并异步加载它们（并行）。

我发现了BigPipe的open source PHP implementation和live example here，但是它已经更新了很长时间，看起来并没有积极的发展。

来源

2013-09-18 13:57:09

Facebook的网站前端是如何设计的？

回答

相关问题