zoukankan      html  css  js  c++  java
  • 高性能网站优化-创建快速响应的Web

    《高性能网站建设进阶指南》

    优化原则

    优化的目的是希望降低程序的整体开销。

    减少开销

    通常认为开销就是程序的执行时间。而在进行优化工作时,应该把重点放在对程序开销影响最大的那部分。
    假设我们有四个模块:A,B,C,D,其中模块A运行所需开销54%,模块B运行所需开销4%,模块C运行开销30%,模块D运行开销12%。
    即使可以通过某种方法将模块B性能开销减少到2%,其实也只是降低了整体开销的2%。如果A的开销减少10%,却可以获得更好的效果,而显然模块A更值得去优化。优化那些开销不大的模块回报太低。

    优化循环

    程序大部分的时间都消耗在循环上,优化那些只执行一次的代码得到的回报微不足道。但优化循环得到的好处却总是让人欣慰。

    合理利用Ajax

    利用Ajax技术,客户端将较小的数据包发送到服务端,然后服务端响应请求返回另一个较小的数据包,客户端的JavaScript程序处理服务端返回的数据包,更新浏览器中的页面。这样数据的传输量和反馈时间间隔都大大减少,同时客户端和服务端工作量也减少。万万不可将所有的应用数据都发送给浏览器,这样反而会增加服务端的响应时间,而返回给客户端的数据也增加程序运行的压力,从而降低性能。

    注意DOM

    浏览器不是为应用平台而设计的,所以在处理Ajax应用程序的时候具有挑战。但是浏览器的发展速度很快,远远超出想象,已经有足够的能力去处理和执行复杂的应用。通过Ajax库可以碾碎很多障碍。
    但是浏览器对DOM的解析依然低效。浏览器运行时,最大的开销往往是解析DOM而不是JavaScript 。注意优化DOM结构,避免多余的开销大的DOM操作。


    伪多线程

    就像所有的GUI应用程序一样,浏览器按队列顺序完成其队列中单独事件的处理。它按照先进先出的顺序从队列中取出,然后决定如何处理。但是,在浏览器中这个过程是单线程的,浏览器每次只能处理这些任务中的一个,并且其他任意一个任务都可以阻止其他任务的执行。由于JavaScript现在不支持多线程,所以无法创建一个后台程序执行开销很大的代码。而实际上,我们有一些方法可以在JavaScript中实现多线程的工作,但是却没有线程之间相互入侵的危险。

    定时器

    待完善

    Web Workers

    使用 setTimeout()、setInterval()、XMLHttpRequest 和事件处理程序等技术模拟“并行”,确实都是异步运行的。但没有阻碍未必就意味着并行。系统会在生成当前执行脚本后处理异步事件。可以通过Web Worker执行一些操作,同时却不会阻碍UI和其他脚本。

    内存管理

    JavaScript中绝大部分的运行环境(?为什么是绝大部分?)都实现了垃圾回收。但是自动管理内存是有开销的。在执行回收时,它们会冻结整个运行环境,包括正在调用的主线程,直到遍历完整整个创建对象的“堆”。在这个过程中查找不再使用或者能够回收内存的对象。
    对于大部分应用程序而言,GC是完全透明的。冻结运行环境的时间短到完全可以忽略。但是随着内存占用的增加,遍历整个内存中保存着对象的“堆”查找不再使用的对象的时间将增长,最终引起注意。
    当这种情况发生是,应用程序开始定期出现间歇迟钝,更严重一点整个浏览器可能出现反映迟钝。
    在编写代码时要注意:

    • 使用delete关键词从内存中移除不再需要的对象;

    • 从网页DOM树中移除不再需要的节点

    通过拆分节省下载

    将JavaScript分成两部分:一部分是渲染初始页面必须的,剩下的作为另一部分。在初始化时只加载必要的 JavaScript,其余的JavaScript稍后再加载。
    拆分JavaScript代码的一个难点就是要避免出现未定义标识符错误。如果在执行的时候引用到了一个被延时加载的标识符时,就会出现这种问题。不过也有解决方法:
    在延迟加载的代码和UI界面相关联的情况下,可以通过提示来巧妙的避开与用户的冲突。比如菜单中可以添加一个“加载中”的图标,告诉用户正在加载。或者干脆在延迟加载的代码里绑定事件处理程序,这样一来代码还未加载执行时,点击不会执行任何JavaScript代码。将两者结合更佳。

    延时加载的代码不与页面元素相关联的情况下,可以使用模拟函数(stub function)来解决这个问题。模拟函数是一个与原函数名称相同但是函数体为空,或者包含一些临时代码的函数。当调用它们时,动态加载其他的JavaScript代码。当增的JavaScript代码下载完成之后,模拟函数便被新的函数覆盖。JavaScript函数没有重载。

  • 相关阅读:
    往excel中插入分组柱状图
    往excel中插入柱状图b
    向excel中插入柱状图a
    对excel进行数据筛选及过滤
    对excel进行排序及多重排序
    函数填充,计算列
    ChinaCock界面控件介绍-TCCImageViewerForm
    Allocation-Free Collections
    Delphi 10.3实现Android App的动态权限申请
    DeployMan,发布文件的利器
  • 原文地址:https://www.cnblogs.com/zhanglun/p/3684777.html
Copyright © 2011-2022 走看看