zoukankan      html  css  js  c++  java
  • seo优化

    前端开发工程师来说,前端性能优化的重要性是不言而喻的,最为大家所知的是YSLOW的23条优化规则,在我的理解中,性能优化不纯粹是指用户访问网站的速度,也包括开发的效率,这里我总结下我理解中的WEB前端性能优化

    HTML部分

    1. 语义化HTML:好处在于可以使代码简洁清晰,支持不同设备,利于搜索引擎,便于团队开发;
    2. 减少DOM节点:加速页面渲染;
    3. 给图片加上正确的宽高值:这可以减少页面重绘,同时防止图片缩放;
    4. 防止src属性和link的href属性为空:当值为空时,浏览器很可能会把当前页面当成其属性值加载;
    5. 正确的闭合标签:如避免使用<div/>,浏览器会多一个将它解析成<div></div>的过程;
    6. 链接为目录或首页的地址后面加”/”,如http://www.5icool.org/;
    7. 用LINK而不用@import方式导入样式;
    8. 样式放在页头,JS放在页尾;
    9. 缩小favicon.ico并缓存;

    CSS部分

    1. 避免使用 CSS Expressions(CSS表达式):如background-color: expression( (new Date()).getHours()%2 ? “#B8D4FF” : “#F08A00″ ) ;
    2. 避免使用 CSS Filter(CSS滤镜);
    3. 使用CSS缩写,减少代码量;
    4. 通过CSSSprites把同类图片合成一张,减少图片请求;
    5. 减少查询层级:如.header .logo要好过.header .top .logo;
    6. 减少查询范围:如.header>li要好过.header li;
    7. 避免TAG标签与CLASS或ID并存:如a.top、button#submit;
    8. 删除重复的CSS;

    Javscript部分

    1. 尽量少用全局变量;
    2. 使用事件代理绑定事件,如将事件绑定在body上进行代理;
    3. 避免频繁操作DOM节点;
    4. 不使用EVAL;
    5. 减少对象查找,如a.b.c.d这种查找方式非常耗性能,尽可能把它定义在变量里;
    6. 类型转换:把数字转换成字符串使用”” + 1,浮点数转换成整型使用Math.floor()或者Math.round();
    7. 对字符串进行循环操作,譬如替换、查找,应使用正则表达式;
    8. 删除重复的JS;

    服务器部分

    1. 尽量合并CSS、JS文件,或将其直接写在页面上,减少HTTP请求;
    2. 压缩CSS、JS文件,缩短文件传输时间;
    3. 避免404错误:特别要避免给404指定一个停摆页面,否则所有404错误都将会加载一次页面;
    4. 一般要求减少DNS查询次数,如同一个页面的请求资源尽量少的使用不同的主机名,这可以减少网站并行下载的数量,但很多网站为了加速下载资源其实是特意用了多个主机名,这里要做一个权衡;
    5. 使用CDN加速,使用户从离自己最近的服务器下载文件;
    6. 减少Cookie的大小,使用无cookie的域,客户端请求静态文件的时候,减少 Cookie 的反复传输对主域名的影响;
    7. 为文件头指定Expires,使内容具有缓存性;
    8. 使用gzip压缩内容;
  • 相关阅读:
    AUDIT审计的一些使用
    HOW TO PERFORM BLOCK MEDIA RECOVERY (BMR) WHEN BACKUPS ARE NOT TAKEN BY RMAN. (Doc ID 342972.1)
    使用BBED理解和修改Oracle数据块
    Using Class of Secure Transport (COST) to Restrict Instance Registration in Oracle RAC [ID 1340831.1]
    调试利器GDB概念
    第4章 思科IOS
    第3章 ip地址和子网划分
    第2章 TCPIP
    2020年阅读过的黑客资源推荐篇
    第1章 计算机网络
  • 原文地址:https://www.cnblogs.com/xiaoleidiv/p/3417989.html
Copyright © 2011-2022 走看看