如何提高页面响应速度?
来源:电脑爱好者 时间:07-07-24 点击: 点击这里收藏本文
web开发准则与提高响应速度
可惜上文提到的这些计巧与我们通常认为的web开发的准则有冲突。例如减少页面包含文件数量会造成产品的可维护性变差。为了使网站的不用页面(首页,文章页,存档页)保持不同的页面风格最简单的方法是不同类型的页面的特殊的样式存放在他们各自的样式文件中。一个页面可以有一个最基本的样式文件,然后根据页面的不同类型再包含该类型页面的指定的样式文件。
脚本的存放也可以用相同的方法,将功能相近的脚本放到一个文件中。这样有助于代码的维护。你不用察看所有的脚本代码就可以很快的找到你需要的函数。此外,将脚本加入到页面的主体部分通常被认为是不良的编码习惯,因为他将用户的行为控制逻辑嵌入的页面的结构中。
幸好有技术方案可以解决这些问题。
用一个包含来引用多个样式或脚本。
爱德华艾略特提出的解决方法是用一个PHP的脚本将多个CSS样式或脚本整理成单一的档案。这个脚本对于javascript还可以调用Douglas Crockford’s的JSmin进行压缩。这个脚本使用很简单,而且可以缓存归并后的文件,直到这些被归并的文件被修改。这就意味着当你修改被归并的某个文件后,脚本会自动重新打包缓存。这样就很简单的解决了代码维护和页面响应速度间的矛盾。
解决页面加载的问题
另一个棘手的问题是,嵌入在页面头元素的脚本,必要要等页面加载完成后才能被调用。这样就会有些延时 ,而且还会产生问题。
延时是由于浏览器加载,解析和展现文档的方式造成的。当你用window的onload事件加载脚本时,浏览器的处理顺序是这样的:
解析HTML代码装载外部脚本和样式表
执行被解析后的脚本
建立HTML的DOM树
装载图片和其它外部引用内容
页面装载完毕
在大多数情况下这样的加载会比较慢,而有些步骤需要提前。许多聪明的程序员致力于解决这个问题,不时的会有新的解决方案出现。大多数的javascript脚本都会有针对onAvailable或onDocumentReady的事件处理。这类事件会在部分文档装载完成后就会被触发,而不用等到大量图片被加载。但通过实践和反复测试,针对旧的浏览器和操作系统并没有无懈可击的解决方案。但我相信只要我们继续努力,再加上那么点运气一定会找到最终的解决方案的。
对于web应用由于调用未加载完成的元素而导致异常是很致命的问题。如果这类问题时发生在页面美化部分,则会有一些解决方法为了解决一次加载过多内容的问题,可以采按需分别加载内容。
为了更好的装饰页面一次载入大量的内容,往往会产生问题。大量的内容有可能是每个标签中都包含过多的文字或者是一个有四级的导航栏。运用javacript脚本可以很轻松的动态展示这些内容。但是如果脚本被禁用,则这些动态内容就会失去样式而被打乱,无法正确地展示,这当然不是一个好主意。页面也没有必要一次将所有的动态展示内容都一次加载,这样会增加页面载入的负载。
把此文章收藏到: