IPTV中的EPG前端优化

先看一下IPTV相关情况：

l 目前TPTV市场情况

a) 截止今年2月，全国IPTV总用户数达3630.2万，我国移动互联网用户规模接近9亿，人均月接入量近300M，8M宽带达半数，光纤近4成。

图 1我国整体数字电视转换情况

图 2各省数字电视用户规模及有线数字化程度

b) 今年 3 月通信业经济运行情况显示，三家基础电信企业电信业务总量完成1810.1 亿元，同比增长 22.7%，比同期增速高 7.7 个百分点；

l 中国目前市场上电信IPTV机顶盒主要有：【标清】：华为、中兴、长虹、UT、MOTO、烽火、大亚、同洲、九联、贝尔、创维、朝歌、大华、数源。【高清】：华为、中兴、MOTO、大亚、朝歌、烽火、同洲、海信、创维、凯天、UT、长虹、贝尔、飞越、九联、数源。

从上面可以看出来，以后会对IPTV的要求会越来越高，EPG前端优化时一要考虑服务器的承载能力，二要考虑机顶盒性能及兼容问题。

【准备工作】：考虑环境特殊性，需要做好以下几个准备：硬件：PC、机顶盒、网络集线器（也就是HUB，也可以使用镜像功能的交换机Switch）。软件：Chrome、Wireshark。没有远程环境，这些都得用上，如果有远程调试环境HUB和Wireshark可以不需要。

一、 减少请求数：一般一个页面最好在5个以内的请求，当请求达到10个以上，速度明显慢很多。如何减少请求数呢？

1. 减少图片数量，可将多张图片整合在一起，每一张图片都是一个请求。

2. 绝对不要存在请求不到的资源，也就是不能存在HTTP 404资源。

3. 减少iframe的请求数。

4. 减少AJAX的请求。

5. 通过AJAX异步进行延迟加载资源。

6. 合并javascript和CSS。

二、 JS代码

1. 尽量不要使用JQuery，大部分机顶盒不支持。

2. 合并并最小化JAVASCRIPT。

3. 将小的js内嵌到页面里。

4. 注意机顶盒对按键的兼容性，一般标清只支持onkeypress，大多数不支持onkeydown，如果尝试使用会造成机顶盒卡死。如果两种按键都支持可以JS进行按键判断让其只执行一次按键。

5. 尽量使用AJAX的GET异步请求，少用POST请求。

6. 尽量使用for，而不是each。

7. 尽量少使用eval。

8. 尽量使用getElementById去访问，不要使用getElementsByName、getElementsByClassName、getElementsByTagName，大部分机顶盒不兼容这些方法。

9. 尽量使用join方法去拼接字符，少用concat函数，或者+= 这样的运算符。

10. 重写系统事件时都尽量都返回false或0、null，比如系统按键、播放等事件。

11. 将共用的js 抽出出来放在外部供其它页面调用。

三、 图片：

1. 透明效果的图片尽量使用png、少使用gif。

2. 压缩jpg，删除jpg中不必要的信息。

3. 不能使img的src留空，因为有一些机顶盒会进行额外的请求，更不能设置一个不存在的值。

4. 不要在EPG前端缩放图片大小，图片可以按实际尺寸设计，也就是在img标签中尽量不要存在width、height属性。

5. 延迟加载图片，不是所有图片马上呈现，可按需显示图片。

四、 CSS

1. 避免CSS @import，@import大部分机顶盒不支持，应使用link。

2. 将小的CSS内嵌到页面里。

3. 合并并最小化CSS。

4. 将CSS压缩。

5. 干掉多余不需要的CSS。

五、 Javascript

1. 尽量少使用document.write。

2. 延迟加载javascript。

3. 调整JS顺序，将用在onload的尽量放在html文件后面。

4. 将JS压缩。

5. 不能使用event作函数名。

六、 Java

1. 禁用session，当不需要session时＜%@ page session="false"%＞ 。

2. 尽量使用＜%@ include file=”xxx.jsp” %＞，少使用<jsp:include page="xxx.jsp"/>。

3. 尽量使用 java去获取URL的参数，JS获取相对比较麻烦而且慢。

七、 不能通过前端进行优化的：

1. 做异步请求时，服务器的响应头为204时，iframe和ajax都可能解决不了问题，都可能出现重复请求，只是ajax可以表现出色一点。