商城系统是应用最广泛的Web系统,在目前多终端设备并存的条件下,支持多终端运行已经成为商城系统的一个必备功能。传统跨终端的实现主要采用独立站点的方案,即为每一套设备定制单独的Web界面,不仅增加了开发过程的工作量,而且每一次的变更都需要同时对多个独立站点进行变更,不利于后期的维护与应用的拓展。新的跨终端Web设计是通过一套系统支持多种终端设备的浏览访问。首先,需要考虑页面之间的复用性问题,基于Web Components思想的组件化页面设计是一条可行的途径;其次,跨终端设计需要通过多屏自适应,完成页面的布局自适应和高清适配;最后,还需要考虑手机等移动设备自身硬件性能的限制,对Web进行性能的优化。本文首先根据商城系统的功能需求和跨终端需求,对商城系统进行了总体的方案设计。其中,功能需求围绕商城系统设计了业务流程,跨终端需求围绕Web组件化、多屏自适应、性能优化三个方面进行了设计实现。在性能优化方面,基于虚拟DOM思想和H5的Web Worker功能,提出了新的虚拟DOM树更新算法,设计了高效的页面更新机制来加快页面的响应。最后,从商城系统功能和网站性能两方面对系统进行了测试和性能分析。实验结果表明,本系统在实现多终端访问的前提下,减少了系统的开发量,提升了页面的响应速度。