前端技术优化之Java Script篇

1,637 views

Published on

1 Comment
4 Likes
Statistics
Notes
  • cool
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total views
1,637
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
34
Comments
1
Likes
4
Embeds 0
No embeds

No notes for slide

前端技术优化之Java Script篇

  1. 1. 前端优化方案 By—Qone 2010 年 7 月 27 日 --JavaScript 篇
  2. 2. 测试驱动开发 <ul><li>为了编写可维护的 JavaScript ,测试驱动是必不可少的。因为每个测试都起到质量反馈的作用,给后期维护和修改创建了一个安全保护网并提供了一份可执行的文档。通过测试,我们可以保证所有的功能被覆盖,也避免了重写代码后再进行测试的高昂代价。 </li></ul><ul><li>解决方案 : 以后的开发中使用 JsUnit 和 JSMock 进行 测试驱动 。 </li></ul>
  3. 3. 文件压缩 <ul><li>a)   移除注释; </li></ul><ul><li>b)   移除额外的空格; </li></ul><ul><li>C) 细微优化; </li></ul><ul><li>d)  标识符替换; </li></ul><ul><li>解决方案 : 代码发布时,使用以上压缩工具进行压缩。 </li></ul>
  4. 4. 使用 JSON <ul><li>解决方案 : 把能更改为 JSON 数据格式的数据尽量进行更改。 。 </li></ul>
  5. 5. 浏览器兼容 <ul><li>Web 时代,主流浏览器兼容是必须的。而且当 IE 9 来到时,向下兼容可能会出现一些问题。时代在发展, Google 都摈弃了 IE6 , 既然都有权要求用户使用 IE 浏览器,为何不能要求用户对浏览器升级,或满足使用其它浏览器的用户呢? </li></ul><ul><li>解决方案 : 更改代码,使其兼容主流浏览器。 </li></ul>
  6. 6. 使用基本常识方法 <ul><li>避免使用内联引用和内部引用,尽量使用外部引用 </li></ul><ul><li>a)  使用三元操作符代替 if…else… ; </li></ul><ul><li>b) 减少 DOM 访问; </li></ul><ul><li>c)  尽量使用 switch ; </li></ul><ul><li>d) 简化常用对象定义( var obj = {}; 代替 var obj = new Object(); ) </li></ul><ul><li>解决方案 : 编写代码过程中遵循以上方法 </li></ul>
  7. 7. 代码的可读性 <ul><li>是程序员都可以写出机器可读的代码,但是要做一名好的程序员就必须写出人类可读的代码。 </li></ul><ul><li>解决方案 : 在需要的地方增加注释;降低代码的层次嵌套;遵循代码的重用规则;规范命名等等;。 </li></ul>
  8. 8. 查找瓶颈 <ul><li>a) 局域网不慢,互联网慢则为加载慢; </li></ul><ul><li>b) Chrome 不慢, IE 慢则为渲染慢; </li></ul><ul><li>c) 越用越慢则为内存泄露。 </li></ul><ul><li>解决方案 : 针对 a) 可对文件进行压缩;动态加载;加载提示。针对 b) 可缓存经常用到的节点查询结果;注意 DOM 的刷新;减少加载减少解析;晚加载晚解析。针对 b) 可参见: JS 内存泄露 。 </li></ul>
  9. 9. 相关类容链接: <ul><li>前端优化方案 -JavaScript 优化方案 </li></ul><ul><li>YUI 介绍 </li></ul><ul><li>使用 JsUnit 和 JSMock 的 JavaScript 测试驱动开发 </li></ul><ul><li>标识符 </li></ul><ul><li>JavaScript 中唯一的三元操作符 </li></ul><ul><li>JavaScript eval() 函数 </li></ul><ul><li>js 内存泄露问题 </li></ul><ul><li>内存泄露 </li></ul><ul><li>14 快速载入网站规则 </li></ul>
  10. 10. 冯小强 (Qone) QQ:452348832 Gmail : [email_address] 新 浪: http://t.sina.com/Qone 腾 讯: http://t.qq.com/Qone2010

×