现如今,互联网技术逐步深入到人们生活中的各个方面,与人们生活息息相关的网购行为也在网络巨头的推动下呈现出愈发强劲的趋势,其中移动端购物在网购行为中已经成为主要部分而且它的占比仍然保持着快速增长,如何快速应对急剧增加的移动端购物需求所带来的巨大的移动端开发需求已经成为一项很有研究价值的课题。通过对移动端与PC端页面的相比,可以发现由于移动端设备屏幕的限制,其页面在设计和布局上有着独特但比较统一的风格。总体上,移动端页面在布局方面是可以在垂直方向上进行模块化分割的。结合移动端页面的这种特性,本文设计一种基于自定义组织结构的Vue组件进行可视化操作并动态生成移动端页面的思路,来提高页面构建的效率和可复用性等。本文搭建一个基于Node.js和REST风格移动端页面可视化构建平台,开发者需要开发出符合一定规范的Vue业务组件文件,然后利用该平台对组件进行一系列处理,之后渲染并打包产生浏览器可以直接加载渲染的静态文件,这一系列流程为可视化操作提供了前提。利用渲染后的静态文件,该平台可以为用户提供可视化操作的能力,用户可以在模拟的移动端屏幕上对组件进行组合并形成各种预览页面。平台根据用户的可视化操作进行相应的页面构建。综上所述,本文的主要工作在于:1、首先对移动端页面可视化构建平台所依赖的技术和理论进行相应的调研,为后续的系统开发提供了理论支撑和技术积累。2、对平台系统进行了总体结构上的设计,对可视化构建流程的设计以及流程中各个功能模块的设计、根据系统中所使用到的数据集进行了RESTful API设计、进行相应的数据库的设计、针对系统做了一系列的优化设计等。3、对平台系统进行实现,实现系统的前端界面结构、布局、交互,实现后端各个模块的功能,解决了系统设计中一些关键技术问题,比如组件依赖问题解决、CPU密集型任务分发等。4、系统优化。分为系统的前端优化和后端优化,研究介绍了对应的优化原理,并实现了对应的优化功能。主要包括压缩优化、前后端的缓存优化、利用多核CPU优化、针对单页应用的代码分割优化等。