有个朋友问我,如何将 CSS、JS、HTML 等合理地组织起来,而不是揉在一起。我给了他以下建议:
1. 禁止使用内嵌的 CSS 和 JS;
2. 将 CSS 和 JS 分别组成一个文件,CSS 放在页头,JS 放在页脚。其实,这是 Yahoo 的页面优化原则,也是比较常用的方法。
3. 通过 lazyload 技术,使网页中的图片按需加载。也就是说,动态加载当前视口内的图片,减少网页加载时的网络请求。在国内的大部分网站中,无节制地在网页中引用图片,是造成浏览器加载页面缓慢的主要原因。而通过 lazyload 技术,可以显著地加快网页的加载速度。
以上只是一些技术点,在开发整体项目时,如何使多人合作,高效地开发富界面(RIA)产品是另外一问题。要解决这个问题,需要一个系统的解决方案,且与后台所使用的脚本语言相关,因而是因公司而异的。对于任何一个公司来说,这都需要一个长期摸索实践的过程。
但总的来说,您网站的目标是,要建立一个高效的开发环境和前端代码框架,使开发时的源代码与发布后的网站代码从形式上分离。只有这样,才有可能将单个的复杂页面,分解成多人合作开发的简单布局模块。为“由难化简”的解决思路,提供基本条件。
另外,本人常用的网名是 lzlhero,真名是吕志良,欢迎大家帮我推广,我也乐意为更多的人提供前端技术上的咨询。
相关链接
Best Practices for Speeding Up Your Web Site
Lazy Load Plugin for jQuery