先看一下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可以表现出色一点。