页面优化

Q:  一万个节点，行为类似，滚动时会有事件发生，渲染也很慢，非常卡，如何优化。

A:

吐槽：

优化个毛，谁写的HTML，马上炒掉(by 司徒正美)。

这脑残的页面么，我感觉拉动都卡(by 榕城-渔业泡妞)

 

实际上：这个页面是有脚本由产生的()。

写个瀑布流，甘特图，至少3W个节点。(by 司徒正美)

 

1 事件处理可以使用事件代理，利用事件冒泡的性质，来优化相同节点的处理。

2 把几十个节点改成一张图片

3 渲染的时候不要一开始渲染，class后面再用javascript加上。

4 移出视野的东西立刻销毁

5 用Textarea懒加载

---

Q: ajax优化
There are five possible values for XHR.readyState:
0 (Uninitialized): The object has been created but the open() method hasn't been called.
1 (Loading): The open() method has been called but the request hasn't been sent.
2 (Loaded): The request has been sent.
3 (Interactive). A partial response has been received.
4 (Complete): All data has been received and the connection has been closed.

 

在第Interactive可以获取，没必要等到Complete时获取数据。服务器和客户端约定格式，用一个分隔符号来划分出可以独立使用的数据段，例如{name:Lee}|{name:Fiona}，当接收到{name:Lee} | {Fi就马上执行回调函数，多出来的{Fi在之后再获取。

---

Q：CSRF解决根本实质。

A：几乎不可能伪造的随机ID；COOKIE不能跨域被获取，恶意站点无法获取TOKEN了；如果把TOKEN放到HTTP header，那么恶意站点也是无法获取TOKEN的，连猜的机会都没有。 

---

Q: 使用过的页面优化方法

A: JS合成和压缩；小图合成；300条数据的列表，删除一列，先去除CSS，再删除，耗时由10多秒降到1，2秒。其他网站的优化：Mybatis修改源码，提升基于MAP的SELECT性能；数据库索引优化。

未来可以用到的优化：requrie.js LABJS 按需加载