把你的Plone变得像Douban一样快.doc

把你的 Plone 变得像Douban 一样快随着上海润普公司推出免费的 Plone 空间 PloneSpace 之后（注：此免费空间早已不可使用）, Plone 开始变成 Pythoner 日常生活, 建立个人站点稀疏平常的一个选择。任何对 Plone 强大的描述, 或者与其他 CMS (内容管理系统) 以及应用 (Blog、论坛、Wiki) 之间的对比, 都是可笑的, 所以今天我就不汤这趟混水了。因为 PloneSpace 的服务器目前还在电信, 我从网通过去, 就显得慢。所以我决定给 Plone 来个提速。从今天开始, 就让我们一起来 Step By Step, 给 Plone 加加速, 让他变得和 Douban 一样快。第一步, 请大家在自己机器上下载安装一个 Plone。或者注册一个 PloneSpace 空间。如果你还不熟悉 Plone 的使用, 请下载一份Plone最终用户导读。咱们今天先热热身。影响 Plone 速度的原因今天, 先讲一下策略, 让我们首先来分析一下 Plone 的页面。这里, 以我在 Plonespace 上面的站点 为例。打开首页, 我们可以看到 Plone 安装后的默认页面。点击右键查看页面的源 HTML。我们可以看到: . .我们会发现 Plone 在 Head 部分加载了一些 JavaScript 脚本和 CSS 样式。我们知道, 这些文件在第一次访问之后就会被缓存起来, 所以用户在第二次访问 Plone 站点时, 因为不会重复下载, 所以速度就很快了。但是, 在首次访问时, 用户需要下载多少内容呢?我检查了一下这几个外部文件, 其总和可以到二三百 K, 在网速并不那么如意的地方, 耗时是恐怖的。比如我现在从网通访问 Plonespace, 就是如此。更糟的是因为外部文件都被放在 HTML Head 部分, 所以在下载阶段, 大家只能看到一片空白的浏览器, 很容易让用户等到意兴阑珊。 Plone 在 Head 部分放置外部文件, 导致在低网速的地区, 在外部文件完全下载完毕之前无法看到实际内容。所以说 Plone 很冤枉, 特别是在 Plone2.5 下, 只有首次访问因为还没有外部文件的缓存才会显得比较 慢, 这实在是网络 IO 的原因, 和 Plone 本身的性能毫无关系。但却会导致人们误以为是 Plone 的处理速度有问题, 殊不知 Plone 早就把页面内容放在 Body 部分发送给你了, 只是没有马上显示出来而已。这是人们关于 Plone 的一个误区, 当然也给我们提速 Plone 提供了一个突破口。第二个方面, Plone 组装一个页面, 会进行非常繁复的内部操作。比如首页, Plone 需要组装一个页面框架, 导航栏, 登录框等。而通常, 我们可能并不需要这样复杂的页面框架, 至少, 对我而言是这样的。 在没有缓存的情况下, Plone 组装一个页面是非常复杂和耗时的 (ZPT/ZODB), 如果 Plone 默认的显示框架对你的应用来说存在过多冗余信息, 或者你需要完全定制显示, 那么在这些地方消耗的时间是浪费的, 并且是可以节省下来的。在我写这篇文章的时候 (这是连载的第二篇), 有网友就已经对第一篇文章提出了自己的观点。 如果是把 CSS、JavaScript 都简化掉。那也没什么大意思。对此, 我的观点是: 如果本来我们就需要完全重构站点的显示, 我们就干脆做彻底一点, 即使把 CSS、JavaScript, 甚至把 HTML 架构都简化掉, 都无不可。通常这种方法不仅让定制变得极为简便 (这个我们下面将会看到), 而且能得到最好的速度。同时在站点管理部分, 或者你需要的部分使用 Plone 原始界面, 享受 Plone 的强大。低成本高收益, 何乐而不为? 如果我们需要尽可能保留站点的显示和构造, 我们可以采用后置加载 (放在 Body 部分最后面或者通过 JavaScript 程序动态加载) 的方法, 把 CSS 和 JavaScript 在 Body 部分加载进来。这样即使是第一次访问, 用户都可以迅速看到页面上的内容。Plone 的 降解 (兼容各种低端浏览器) 做得很好, 通常在 CSS 还没有下载完的时候, 页面内容都已经组织得非常好了。下面我们动手。在此之前, 请使用管理员身份登录你的 Plone。然后在你的地址栏上打下 manage: 比如 /manage现在你已经到了一个全新的地方, 我们管这个叫做 ZMI。如果你是第一次进入 ZMI, 大跌眼镜手足无措都是正常的。如果有时间不妨先熟悉一下, 你会发现这个界面对我们管理 Plone 大有裨益。我们接下来的工作, 基本上将围绕着这个界面展开。下面我们先热身。在正式动手之前, 我们最好是先看一下关于 Plone 定制方面的文档。请下载Plone 资料汇编浏览其中的第四章、第七章。不过这些内容有一定门槛, 但是请别泄气, 我们可以慢慢来, 基本上对 Plone 定制留个大体的印象就可以了。通过实践, 我们会逐渐弄明白。反过来, 先按照本文进行实践, 再回过头去看 Plone 资料, 或许会事半功倍。好, 我们正式开始。上次有提到, 我们可以采取两种策略来加快 Plone 的显示。第一种, 就是把外部 CSS 和 JavaScript 文件放在 Body 部分下载。第二种, 就是简化页面显示。这里, 我两种策略都采取。 使用 JavaScript 动态加载外部 CSS 文件。 定制 Document (页面) 的显示, 去除复杂的系统框架, 仅仅显示文档的内容。这里, 使用 JavaScript 来动态加载外部 CSS 文件, 只是让整件事情变得更酷而已。最简单的方法, 不过是把导入 CSS 的 HTML 文本从 Head 部分转移到 Body 的末尾, 效果是一样的。关于 JavaScript 是如何动态加载外部 CSS 文件的, 请参考我以前的资料在网页中动态加载 CSS 样式文件。现在你不用自己来写这个程序, 我已经把一个直接能用的程序放在了 /lazy.js 这个位置。大家可以下载来用。接下来登录为管理员, 进入你的 ZMI 界面 (/manage)。请看上面图片, 这次你走得更远, 你点击了 portal_skins (见图片 A), 再选择文件夹 custom, 便进入了 /portal_skins/custom (见图片 B) 目录。往添加菜单看去 (见图片 C), 选择 File 类型, 把我在上面所说的 lazy.js 上传上去 (见图片 D)。接着我们要使用真功夫了。选择添加菜单的 Page Template 类型。这是一个 Zope/Plone 的页面模板 (ZPT), 强大并且复杂, 你可以从Plone 资料汇编中得到 ZPT 所有的魔法说明。我们给这个模版起一个叫做 document.view 的名字。这里, 页面本来的默认模版叫做 document_view, 如果我们的模版也叫 document_view, 那么我们就把页面原先的显示给覆盖了。如果你觉得直接覆盖没关系, 那就选择 document_view 这个名字吧。不过我们这里 document.view 这个名字显然要酷得多了。下面, 编辑模版 document.view, 内容如下: Title or id Edit|Originally  LazyLoadStyle(/portal_css/Plone%20Default/ploneStyles8918.css); LazyLoadStyle(/portal_css/Plone%20Default/ploneStyles4002.css); 其中 这行是用来告诉 IE 浏览器这个网页的编码是什么。因为 IE 很傻, 他不会像 Mozilla 那样自己判断。 . . 上面这段模板, 用来取出 Document 页面的内容。而下面的代码, 为页面的编辑和原始页面的浏览留下两个链接。 Edit|Originally 接下来, 我们使用 lazy.js 的 LazyLoadStyle 函数来导入外部 CSS 文件。请注意这里外部 CSS 文件的文件名需要从你自己的 Plone 页面 HTML 源中取出来。比如你可以打开首页, 然后看首页中加载了哪些 CSS 文件。我这里选择了两个主要的 CSS 文件。这里请对照、参考把你的 Plone 变得像 Douban 一样快 (二)。代码如下: LazyLoadStyle(/portal_css/Plone%20Default/ploneStyles8918.css); LazyLoadStyle(/portal_css/Plone%20Default/ploneStyles4002.css); 最后一步, 因为我使用了免费的空间, 所以作为感谢, 加上免费空间的声明和链接。 这样我们就完成了 document.view, 选择保存 (见图片 D)。现在我们来试验一下首页 /front-page/document.view 。你会发现 document.view 模板已经开始工作了!最后一步, 让 document.view 变成 Document 页面的默认模板 (代替 document_view)。请在 ZMI 下选择 portal_types, 你会看到 Plone 支持的所有对象的列表, 选择 Document (Page), 我们会看到 Document 的默认标签页 Properties。直达链接为 /portal_types/Document/manage_propertiesForm。在 Available view methods 属性中增加一行, 填上 document.view, 然后把 Default view method 属性改成 document.view。这样我们就已经把页面的默认显示改变成 document.view 了。现在, 我们再来访问 Plone 页面, 就已经飞快了!现在我们已经脱离到