目前大多数新网站均采取前后端分离, 将更多的交互逻辑分配给前端来处理, 如图2所示, 后端专注于其本职工作, 负责数据模型Model层, 进行权限控制以及进行运算工作。而前端开发人员需要与后台解耦, 独立控制视图View层。前端可以根据业务逻辑, 通过Ajax主动去获取后台数据 (Controller) , 并插入视图层展示。前端需要独立完成与用户交互的整个过程。因此, 前端负责的内容就变得更多了, 业务逻辑更多地交给前端去控制, 前端开发人员需要引用更多的框架或者写更多的逻辑去实现, 因此网页会变得越来越复杂、臃肿。电商网站是图片加载数量最多的网站类型之一。在主流的电商网站中, 主页的风格, 大多数是商品的大图展示, 往下滚动, 便是各种精美商品的中型图片展示。一般电商网站都是做长页面的, 即一页加载的内容非常多, 方便用户浏览, 不用通过点击页码切换商品。因此, 图片资源过多是导致电商网站臃肿的主要原因之一。
电商企业之间的竞争非常激烈, 电商网站会通过各种酷炫的网页效果, 来吸引用户, 留存用户。例如常见的图片轮播、全屏红包弹窗、各种精美动画等。除此复杂的设计外, 网站开发人员还需要设计更多逻辑, 这个环节就很考验网站开发人员的技术能力。如上述的各种动效, 网上均有很多CMS模板或框架可以支持使用, 开发者无需关心具体动效实现细节, 只需要引用开源框架的所有代码, 按照要求配置即可实现。这种做法得到大多数开发者的青睐, 因为它大大减少了开发难度, 节省了时间。但是, 这种做法牺牲的是网页的质量。很多时候这种模板框架的功能是大而全的, 开发者会因为需要用到某个效果, 而需要引入整个框架。这种模板或框架, 通常也依赖多个其他的模板和框架, 结果为了实现一个效果, 引入了不少冗余的资源, 网站加载的JavaScript文件数量过多, 逻辑复杂, 会降低浏览器性能。
本文地址：//www.qlpinke.com//article/24672.html
