ExtJS的强大功能是大家有目共睹的,我不再介绍。但是,很多朋友在使用ExtJS的时候,往往会因为其庞大的体积望而却步,特别是在外网,这个缺点更加明显。
ExtJS 4.X 推出了一种新的技术,动态加载,即用到哪个类才下载哪个文件,这种方式确实可以大幅加快首次加载速度,但是本人并不喜欢这样。
很多网友因此下结论是ExtJS根本无法应用于外网,但实际上,我们可以通过多种手段,来解决ExtJS的体积问题。今天我将大致介绍几种常用的方法,能够极大的提高加载速度,在外网情况下,浏览器首次打开页面(包括下载、渲染)的时间控制在1~3秒内,这个速度是完全可以接受的。
这里提供一个在线体验的地址:拓扑进销存管理系统
点我在线体验 账号:csadmin 密码:password
一、 尽量合并JS、CSS、图片,减少浏览器与服务器的请求次数,提高页面加载效率。
二、 使用GZIP压缩,这个大家应该都知道,在服务器将文件传递给浏览器前,先进行压缩,浏览器接受到文件后,对其进行解压,这样可以有效的降低文件的体积。以ExtJS4.1举例,其JS的文件ext-all.js大小为1.23MB,进行GZIP压缩后大小为380.79KB,体积大幅缩小。
三、 进入管理系统前一般都需要用户输入用户名、密码、验证码,在这个期间使用异步加载技术,加载ExtJS等大文件。当用户填写完信息进入管理首页时,利用浏览器缓存的原理,可以极快的打开管理首页,这种方式是效果提升最明显的(当然这种方式并不是每个人都喜欢,所以请那些不喜欢的人就一笑而过吧)。
以下这是我在外网环境下做的几次测试,时间都在1秒左右。这个时间是完全可以接受的
这里提供一个在线体验的地址:拓扑进销存管理系统
点我在线体验 账号:csadmin 密码:password
本文仅做抛砖引玉之用,如果哪些朋友有还有别的方法,欢迎一起讨论。
来源:oschina
链接:https://my.oschina.net/u/134448/blog/125080